/* A compact concierge-style contact dialog, shared by both locales and the blog. */
.contact-dialog{width:min(920px,calc(100% - 48px));padding:0;border:1px solid #c5d9e3;border-radius:24px;background:#f2f7fa;box-shadow:0 32px 100px #041b3b66,0 0 0 1px #ffffff66;max-height:calc(100dvh - 40px)}
.contact-dialog::backdrop{background:#071b2bb8;backdrop-filter:blur(9px)}
.contact-dialog .contact-section{padding:0}
.contact-dialog .section-heading{position:relative;isolation:isolate;overflow:hidden;margin:0;padding:32px 38px 28px;background:radial-gradient(ellipse at 100% 0,#26738b70,transparent 65%),linear-gradient(120deg,#0c273e,#153e55);border-bottom:1px solid #376477}
.contact-dialog .section-heading:before{content:"";position:absolute;inset:0;z-index:-1;background:url('/assets/brand/ocean-contours.svg') 70% 50%/cover;opacity:.6;pointer-events:none}
.contact-dialog .small-label{display:block;color:#9dd6db;font-size:8px;letter-spacing:2.2px;padding-right:36px}
.contact-dialog .section-heading h2{font-size:30px;font-weight:600;letter-spacing:-.7px;color:#f2fbff;max-width:none;margin:13px 0 10px;line-height:1.35}
.contact-dialog .section-heading>p{color:#b0c9d6;font-size:12px;line-height:1.9;max-width:710px;padding-right:18px}
.contact-dialog-close{right:16px;top:16px;width:36px;height:36px;border:1px solid #c1e6ef30;border-radius:11px;background:#b5dfec13;color:#daedf3;transition:background .2s}
.contact-dialog-close:hover{background:#b5dfec2b}
.contact-dialog-close .ui-icon{width:18px;height:18px}
.contact-dialog .contact-grid{padding:25px 28px 0;gap:18px}
.contact-dialog .contact-card{position:relative;display:flex;flex-direction:row;align-items:center;gap:19px;padding:25px 20px;background:linear-gradient(145deg,#fff,#f7fcfa);border:1px solid #dae8e5;border-radius:16px;box-shadow:0 5px 18px #193b5205}
.contact-dialog .telegram-card{background:linear-gradient(145deg,#fff,#f4f9fd);border-color:#d9e6ef}
.contact-dialog .contact-card:before{content:"";position:absolute;top:0;left:24px;right:24px;height:1px;background:linear-gradient(90deg,transparent,#64b89e80,transparent)}
.contact-dialog .telegram-card:before{background:linear-gradient(90deg,transparent,#66abc880,transparent)}
.contact-dialog .contact-qr-link{width:136px;flex:0 0 136px;border-radius:12px;border:1px solid #e0e9ec;box-shadow:0 4px 14px #163a4b05;background:#fff}
.contact-dialog .contact-card-copy{text-align:left;flex:1}
.contact-dialog .contact-card h3{justify-content:flex-start;font-size:21px;gap:7px;font-weight:650;letter-spacing:-.6px;margin:0 0 8px}
.contact-dialog .contact-card h3 img{width:25px;height:25px}
.contact-dialog .contact-handle{font-size:12px;letter-spacing:0;color:#617c8c;margin:0 0 16px}
.contact-dialog .contact-card-actions{display:flex;flex-direction:column;align-items:stretch;gap:5px}
.contact-dialog .contact-add,.contact-dialog .telegram-card .contact-add{position:relative;justify-content:center;min-height:42px;padding:10px 24px 10px 12px;gap:8px;border:1px solid #c6e6d8;border-radius:8px;background:linear-gradient(115deg,#f0faf5,#e5f4ed);color:#217153;font-size:12px;box-shadow:none}
.contact-dialog .telegram-card .contact-add{border-color:#cbdfea;background:linear-gradient(115deg,#f0f8fd,#e7f2fa);color:#286d94}
.contact-dialog .contact-add>span{position:absolute;right:11px}
.contact-dialog .contact-add:hover{background:#dcefe5;border-color:#add5c3}
.contact-dialog .telegram-card .contact-add:hover{background:#dcecf7;border-color:#afcfE2}
.contact-dialog .contact-copy{align-self:flex-start;min-height:32px;padding:5px 0;font-size:10px;color:#5b7b8a;text-decoration:underline;text-decoration-color:#b5c9d2;text-underline-offset:4px}
.contact-dialog .contact-copy:hover{color:#07869a}
.contact-dialog .contact-section-note{margin:19px 28px 0;font-size:10px;color:#678190;line-height:1.8}
.contact-dialog .contact-feedback{margin:6px 20px 15px;min-height:16px;font-size:11px}
.contact-dialog :focus-visible{outline-color:#59c8cf}
@media(max-width:800px){
.contact-dialog{width:calc(100% - 32px)}
.contact-dialog .contact-grid{padding:20px 22px 0;grid-template-columns:1fr;gap:12px}
.contact-dialog .contact-card{padding:20px 24px;gap:24px}
.contact-dialog .contact-card-copy{max-width:none}
.contact-dialog .contact-card-actions{flex-direction:row;align-items:center;gap:15px}
.contact-dialog .contact-add{min-width:150px}
.contact-dialog .contact-copy{align-self:auto}
}
@media(max-width:580px){
.contact-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px);border-radius:20px}
.contact-dialog .section-heading{padding:26px 23px 22px}
.contact-dialog .small-label{font-size:7px;letter-spacing:1.4px}
.contact-dialog .section-heading h2{font-size:25px;margin:13px 0 9px;max-width:none}
.contact-dialog .section-heading>p{font-size:11px;padding:0}
.contact-dialog-close{right:12px;top:12px;width:32px;height:32px;border-radius:9px}
.contact-dialog .contact-grid{padding:16px 16px 0;gap:12px}
.contact-dialog .contact-card{padding:17px 14px;gap:15px;border-radius:13px}
.contact-dialog .contact-qr-link{width:108px;flex-basis:108px;border-radius:9px}
.contact-dialog .contact-card h3{font-size:20px;gap:6px;margin-bottom:7px}
.contact-dialog .contact-card h3 img{width:23px;height:23px}
.contact-dialog .contact-handle{font-size:12px;margin-bottom:12px}
.contact-dialog .contact-card-actions{flex-direction:column;align-items:stretch;gap:3px}
.contact-dialog .contact-add,.contact-dialog .telegram-card .contact-add{min-width:0;font-size:11px;min-height:40px;padding:9px 25px 9px 10px}
.contact-dialog .contact-copy{align-self:flex-start;font-size:10px}
.contact-dialog .contact-section-note{margin:15px 24px 0;font-size:9px}
.contact-dialog .contact-feedback{margin-bottom:12px;font-size:10px}
}
@media(max-width:360px){
.contact-dialog .section-heading{padding:25px 19px 19px}
.contact-dialog .section-heading h2{font-size:22px}
.contact-dialog .contact-grid{padding:14px 12px 0}
.contact-dialog .contact-card{padding:15px 10px;gap:12px}
.contact-dialog .contact-qr-link{width:90px;flex-basis:90px}
.contact-dialog .contact-card h3{font-size:18px;gap:5px}
.contact-dialog .contact-card h3 img{width:21px;height:21px}
.contact-dialog .contact-handle{font-size:11px}
}
/* Optional callback request, with a clear ten-minute response promise. */
.contact-dialog .other-contact{margin:18px 28px 8px;border:1px solid #d9e5ec;border-radius:13px;background:#fff}
.other-contact summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 20px;color:#21465a}
.other-contact summary::-webkit-details-marker{display:none}
.other-contact summary strong{display:block;font-size:13px;font-weight:600}
.other-contact summary small{display:block;font-size:11px;color:#688392;margin-top:5px;line-height:1.6}
.other-contact summary>.ui-icon{width:18px;height:18px;color:#168696;transition:transform .2s}
.other-contact[open] summary>.ui-icon{transform:rotate(45deg)}
.other-contact[open] summary{border-bottom:1px solid #e8eff3}
#other-contact-form{padding:18px 20px 4px}
.lead-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.lead-fields label{display:block;color:#355668;font-size:11px;font-weight:500;line-height:1.8}
.lead-fields input,.lead-fields textarea{box-sizing:border-box;display:block;width:100%;min-width:0;margin-top:6px;border:1px solid #cedee7;background:#f8fbfd;border-radius:8px;padding:11px 12px;font:inherit;font-size:14px;color:#1b3e51;line-height:1.5}
.lead-fields textarea{resize:vertical;min-height:70px}
.lead-fields input::placeholder,.lead-fields textarea::placeholder{font-size:11px;color:#8aa0ad}
.lead-fields input:focus,.lead-fields textarea:focus{border-color:#1a8a99;outline:2px solid #1a8a991c;outline-offset:1px}
.lead-wide{grid-column:1/-1}
.lead-trap{display:none}
.lead-consent{display:flex;align-items:flex-start;gap:8px;color:#6a8190;font-size:10px;line-height:1.8;margin:15px 0}
.lead-consent input{appearance:auto;width:15px;height:15px;flex:none;margin:2px 0 0;accent-color:#157d8b}
.contact-dialog .lead-submit{width:100%;display:flex;align-items:center;justify-content:center;gap:12px;min-height:44px;border-radius:8px;background:linear-gradient(115deg,#153a50,#1b5365);color:#fff;font-size:12px;font-weight:600}
.lead-submit:disabled{opacity:.6;cursor:wait}
.lead-status{min-height:18px;font-size:11px;line-height:1.8;margin:10px 0;color:#a64242}
.lead-status.is-success{color:#187c65}
@media(max-width:580px){.contact-dialog .other-contact{margin:14px 16px 5px}.other-contact summary{padding:14px 15px}.other-contact summary strong{font-size:12px}.other-contact summary small{font-size:10px}#other-contact-form{padding:15px 15px 3px}.lead-fields{grid-template-columns:1fr;gap:12px}.lead-fields input,.lead-fields textarea{font-size:16px}.lead-consent{font-size:10px}}
@media(max-width:360px){.contact-dialog .other-contact{margin-inline:12px}}
.contact-close-dock{position:sticky;top:0;height:0;z-index:5;pointer-events:none}
.contact-close-dock .contact-dialog-close{pointer-events:auto;background:#244c60;box-shadow:0 2px 8px #09233b20}

/* Native dialog autofocus stays accessible without a ring on touch/pointer open. */
.contact-dialog[data-focus-mode="pointer"] .contact-dialog-close:focus,
.contact-dialog[data-focus-mode="pointer"] .contact-dialog-close:focus-visible{outline:none}
.contact-dialog .contact-dialog-close{-webkit-tap-highlight-color:transparent}
