/* AlKhaber identity · 19 October 2026 */
:root{--brand-navy:#092b42;--brand-deep:#062236;--brand-copper:#c7854c;--brand-ivory:#faf7f0;--brand-petrol:#14675b;--brand-focus:#a56029;--brand-halo:rgb(199 133 76 / 18%)}
.brand{position:relative}
.brand>img{border-radius:14px;box-shadow:0 0 0 1px rgb(199 133 76 / 36%);transition:box-shadow .25s,transform .25s}
.brand:hover>img,.brand:focus-visible>img{box-shadow:0 0 0 2px var(--brand-copper),0 6px 22px var(--brand-halo);transform:translateY(-2px)}
.brand small{letter-spacing:0;font-weight:500}
.site-header{border-bottom-color:rgb(199 133 76 / 25%)}
.site-header .header-inner{position:relative}
.home-page .header-inner{border-color:rgb(199 133 76 / 42%);box-shadow:0 16px 50px rgb(0 0 0 / 13%)}
.home-page .header-inner::after{content:"";position:absolute;bottom:-1px;right:32px;width:80px;height:2px;background:linear-gradient(90deg,transparent,var(--brand-copper));pointer-events:none}
.main-nav a[aria-current=page]::after{height:3px;border-radius:3px}
.btn[href^="tel:"]{border-color:rgb(199 133 76 / 65%);box-shadow:0 5px 18px rgb(6 34 54 / 10%)}
.btn[href^="tel:"]:focus-visible{outline:3px solid var(--brand-copper);outline-offset:5px}
.service-card{border-radius:18px}
.site-footer .brand>img{box-shadow:0 0 0 1px rgb(199 133 76 / 50%)}
/* The entire component is one native telephone link. */
.contact-dock{width:246px;height:auto;left:max(24px,env(safe-area-inset-left));bottom:calc(24px + env(safe-area-inset-bottom));isolation:isolate}
.contact-dock .dock-call{position:relative;display:flex;gap:14px;justify-content:flex-start;width:100%;min-height:80px;padding:12px 17px;border:1px solid #c7854c;border-radius:22px;color:var(--brand-ivory);background:linear-gradient(125deg,#123d51 0%,var(--brand-navy) 50%,var(--brand-deep) 100%);box-shadow:0 12px 34px rgb(6 34 54 / 24%),inset 0 1px 0 rgb(255 255 255 / 10%);overflow:hidden;transition:transform .2s,box-shadow .2s,border-color .2s}
.dock-call::before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,rgb(255 255 255 / 11%) 49%,transparent 68%);transform:translateX(120%);animation:brand-dock-sheen 1.8s ease-out .5s 1}
.dock-call::after{content:"";position:absolute;bottom:0;inset-inline-start:18px;inset-inline-end:18px;height:2px;background:linear-gradient(90deg,transparent,#c7854c,transparent);opacity:.8;pointer-events:none}
.dock-brand-mark{display:block;position:relative;flex:0 0 48px;width:48px;height:48px;border-radius:16px;background:var(--brand-deep);box-shadow:0 0 0 1px rgb(238 214 191 / 50%);transition:transform .25s}
.dock-brand-mark>img{width:48px;height:48px;border-radius:16px}
.dock-phone-badge{display:grid;place-items:center;position:absolute;left:-6px;bottom:-5px;width:25px;height:25px;border:2px solid var(--brand-deep);border-radius:50%;background:var(--brand-copper);color:var(--brand-deep)}
.dock-phone-badge>.icon{width:13px;height:13px;stroke-width:2.2}
.contact-dock .dock-call-copy{gap:3px;position:relative;z-index:1;min-width:0;text-align:start}
.contact-dock .dock-call-copy strong{font-size:1.05rem;font-weight:800;line-height:1.4;color:#fffdf9}
.dock-call-copy .dock-call-caption{font-size:.72rem;line-height:1.5;color:#e4e9e8;letter-spacing:0}
.dock-call-copy .dock-call-number{font-size:.85rem;line-height:1.45;color:#eed6bf;font-weight:700;letter-spacing:.055em}
.contact-dock .dock-call:hover,.contact-dock .dock-call:focus-visible{background:linear-gradient(125deg,#16485c,var(--brand-navy) 55%,var(--brand-deep));border-color:#eed6bf;box-shadow:0 15px 38px rgb(6 34 54 / 28%),0 0 0 4px var(--brand-halo);transform:translateY(-3px)}
.dock-call:hover .dock-brand-mark,.dock-call:focus-visible .dock-brand-mark{transform:rotate(-5deg)}
.dock-call:hover .dock-phone-badge,.dock-call:focus-visible .dock-phone-badge{animation:brand-phone-nudge .45s ease-in-out 1}
@keyframes brand-dock-sheen{to{transform:translateX(-120%)}}
@keyframes brand-phone-nudge{0%,100%{transform:rotate(0)}35%{transform:rotate(12deg)}70%{transform:rotate(-10deg)}}
@media(max-width:700px){.contact-dock{left:max(14px,env(safe-area-inset-left));bottom:calc(14px + env(safe-area-inset-bottom));width:224px;max-width:calc(100vw - 28px)}.contact-dock .dock-call{min-height:74px;padding:10px 14px;gap:13px;border-radius:20px}.dock-brand-mark,.dock-brand-mark>img{width:44px;height:44px;border-radius:14px}.dock-brand-mark{flex-basis:44px}.contact-dock .dock-call-copy strong{font-size:.96rem}.dock-call-copy .dock-call-caption{font-size:.68rem}.dock-call-copy .dock-call-number{font-size:.8rem}.brand small{font-size:.67rem}.hero-label{flex-wrap:wrap}}
@media(max-width:350px){.brand strong{font-size:1.35rem}.brand small{font-size:.58rem}.header-inner{gap:8px}}
@media(prefers-reduced-motion:reduce){.dock-call::before{animation:none;display:none}.dock-call:hover .dock-phone-badge,.dock-call:focus-visible .dock-phone-badge{animation:none}.contact-dock .dock-call:hover,.contact-dock .dock-call:focus-visible,.dock-call:hover .dock-brand-mark,.dock-call:focus-visible .dock-brand-mark,.brand:hover>img,.brand:focus-visible>img{transform:none}}
@media print{.contact-dock{display:none!important}}