/* The outer dock is a stable measuring box; only its inner surface enters and exits. */
.sl-site .sl-contact-dock{
 position:fixed;inset-inline:0;bottom:calc(10px + var(--sl-preview-offset,0px));z-index:115;
 display:block;width:min(560px,calc(100% - 48px));max-width:none;height:auto;
 margin-inline:auto;padding:0;border:0;border-radius:0;background:transparent;
 box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;
 color:#172320;font-family:Heebo,sans-serif;direction:rtl;pointer-events:none;
}
.sl-site .sl-contact-dock-surface{
 box-sizing:border-box;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;
 width:100%;padding:5px;border:1px solid #c8b989;border-radius:999px;
 background:#faf8f2f2;color:#172320;box-shadow:0 8px 28px #0b1d171c;
 backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color-scheme:light;
 opacity:1;visibility:visible;transform:none;transform-origin:center bottom;pointer-events:auto;
 transition:opacity 420ms cubic-bezier(.16,1,.3,1),transform 420ms cubic-bezier(.16,1,.3,1),visibility 0s 0s;
}
/* The head flag prevents a first-paint flash before the footer controller is ready. */
html[data-sl-ui-enhanced="true"] .sl-site .sl-contact-dock:not([data-sl-dock-ready]) .sl-contact-dock-surface{
 opacity:0;visibility:hidden;pointer-events:none;transform:translateY(calc(100% + 14px)) scale(.98);transition:none;
}
.sl-site .sl-contact-dock-surface>a{
 position:relative;box-sizing:border-box;display:flex;align-items:center;justify-content:center;gap:8px;
 min-width:0;min-height:48px;padding:5px 7px;border:0;border-radius:999px;
 background:transparent;color:#172320;font-size:13px;font-weight:400;line-height:1.4;
 text-decoration:none;white-space:nowrap;
 transition:background-color .16s ease,color .16s ease;
}
.sl-site .sl-contact-dock-surface>a:first-child{background:#172320;color:#faf8f2;font-weight:500}
.sl-site .sl-contact-dock-surface>a>.sl-icon{width:18px;height:18px;flex:none}
.sl-site .sl-contact-dock-surface>a>span{position:relative;display:inline-block}
.sl-site .sl-contact-dock-surface>a:not(:first-child)>span::after{
 content:"";position:absolute;inset:auto 0 -4px;height:1px;background:#b0975d;
 transform:scaleX(0);transform-origin:right center;pointer-events:none;
 transition:transform .2s cubic-bezier(.2,.7,.2,1);
}
.sl-site .sl-contact-dock-surface>a:focus-visible{z-index:1;outline:2px solid #a68a4d;outline-offset:2px}
.sl-site .sl-contact-dock-surface>a:focus-visible>span::after{transform:scaleX(1)}
.sl-site .sl-contact-dock-surface>a:active{background:#172320;color:#faf8f2}
.sl-site .sl-contact-dock-surface>a:first-child:active{background:#2d4938}
.sl-site .sl-contact-dock-surface>a:active>span::after{background:#cdbb8c}

/* Dialog logic hides the surface; the geometry remains available to the story engine. */
.sl-site .sl-contact-dock[data-sl-dock-ready="true"]{visibility:visible}
.sl-site .sl-contact-dock[data-sl-dock-ready="true"][data-dock-state="hidden"] .sl-contact-dock-surface{
 opacity:0;transform:translateY(calc(100% + 14px)) scale(.98);visibility:hidden;pointer-events:none;
 transition:opacity 220ms cubic-bezier(.4,0,1,1),transform 220ms cubic-bezier(.4,0,1,1),visibility 0s 220ms;
}
.sl-site .sl-contact-dock[data-sl-dock-ready="true"][data-dock-state="shown"] .sl-contact-dock-surface{
 opacity:1;transform:none;visibility:visible;pointer-events:auto;
 transition:opacity 420ms cubic-bezier(.16,1,.3,1),transform 420ms cubic-bezier(.16,1,.3,1),visibility 0s 0s;
}
@media(hover:hover) and (pointer:fine){
 .sl-site .sl-contact-dock-surface>a:not(:first-child):hover{background:#cdbb8c17}
 .sl-site .sl-contact-dock-surface>a:first-child:hover{background:#274333}
 .sl-site .sl-contact-dock-surface>a:not(:first-child):hover>span::after{transform:scaleX(1)}
 .sl-site .sl-contact-dock-surface>a:not(:first-child):active{background:#172320;color:#faf8f2}
}
@media(max-width:760px){
 .sl-site .sl-contact-dock{inset-inline:12px;width:auto;margin-inline:0;bottom:calc(10px + var(--sl-preview-offset,0px))}
 .sl-site .sl-contact-dock-surface{gap:0;padding:5px;border-width:1px}
 .sl-site .sl-contact-dock-surface>a{min-height:46px;padding:5px;gap:7px;font-size:11px}
 .sl-site .sl-contact-dock-surface>a>.sl-icon{width:17px;height:17px}
}
@media(prefers-reduced-motion:reduce){
 .sl-site .sl-contact-dock-surface,
 .sl-site .sl-contact-dock-surface>a,
 .sl-site .sl-contact-dock-surface>a>span::after{transition:none!important}
 .sl-site .sl-contact-dock[data-sl-dock-ready="true"][data-dock-state="hidden"] .sl-contact-dock-surface{transform:none;visibility:hidden}
}
