/* V15 — Single navigation system and minimal cinematic home. */
:root { --dock-ease: cubic-bezier(.2,.8,.2,1); }
header .desktop-nav, header .menu-toggle, .header .contact-nav {display:none!important;}
.header,.header.solid{justify-content:space-between;gap:20px}
.header .header-actions{margin-inline-start:auto}
/* The automatic hero image carousel continues without the old vertical thumbnail strip. */
.hero #hero-selector,.hero .hero-selector{display:none!important}
.hero .hero-bottom{position:absolute!important;top:auto!important;bottom:clamp(38px,5.4vh,62px)!important;inset-inline:0;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;pointer-events:none;z-index:5}
.hero .hero-bottom>*{pointer-events:auto}
.hero .hero-caption{min-width:0;max-width:240px;background:linear-gradient(90deg,#030b1238,transparent);border-inline-start:2px solid #81d4f7;padding-inline-start:13px}
.hero .scroll-cue{position:relative;align-self:end;white-space:nowrap;letter-spacing:.1em;font-size:10px;color:#e5f4ff}
/* Dock surface */
html .v15-dock{
  position:fixed;left:50%;bottom:clamp(16px,2.2vh,27px);right:auto;z-index:64;
  display:flex!important;direction:ltr;justify-content:center;align-items:stretch;
  width:max-content;max-width:calc(100vw - 32px);gap:5px;padding:8px;
  background:linear-gradient(155deg,rgba(20,40,59,.94),rgba(8,17,31,.95));
  border:1px solid rgba(182,219,242,.2);border-radius:27px;
  box-shadow:0 18px 55px #020a16b3,0 0 34px #55c7f00b,inset 0 1px 0 #ffffff12;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
  transform:translate3d(-50%,0,0);
  transition:transform .66s var(--dock-ease),opacity .46s ease,box-shadow .3s ease;
  will-change:transform,opacity;opacity:1;visibility:visible;
}
html .v15-dock.dock-hidden{transform:translate3d(-50%,calc(100% + 75px),0);opacity:0;pointer-events:none}
html .v15-dock .dock-link,html .v15-dock .dock-more-button{
  box-sizing:border-box;position:relative;display:flex;flex:0 0 auto;
  min-width:79px;min-height:57px;padding:9px 11px;gap:6px;
  align-items:center;justify-content:center;flex-direction:column;
  border:1px solid transparent;border-radius:19px;
  background:transparent;color:#b1c9d9;cursor:pointer;
  text-decoration:none;white-space:nowrap;
  transition:background .3s,color .3s,transform .35s var(--dock-ease),box-shadow .35s;
}
html .v15-dock .dock-link small,html .v15-dock .dock-more-button small{
  display:block!important;font:650 10px/1.25 Manrope,'IBM Plex Sans Arabic',sans-serif;
  letter-spacing:.01em;color:inherit;white-space:nowrap
}
html[lang=ar] .v15-dock .dock-link small,html[lang=ar] .v15-dock .dock-more-button small{
  font:650 10px/1.3 'IBM Plex Sans Arabic',Manrope,sans-serif;
}
html .v15-dock .dock-icon{width:21px;height:21px;flex:none;display:block}
html .v15-dock .dock-link:hover,html .v15-dock .dock-more-button:hover{
  background:#e2f6ff13;color:#fff;transform:translateY(-2px)
}
html .v15-dock .dock-link[aria-current="page"]{
  background:linear-gradient(140deg,#86cef6,#4eaddf);color:#061c30;
  box-shadow:0 5px 20px #55b8e92c,inset 0 1px 0 #ffffff75;
}
html .v15-dock .dock-link.quick-contact{
  min-width:99px;background:linear-gradient(135deg,#245d7d,#204461);
  color:#f8fbff!important;border:1px solid #82c6ed44;
  box-shadow:inset 0 0 0 1px #b1dfff10;
}
html .v15-dock .dock-link.quick-contact:hover{background:linear-gradient(135deg,#2b779a,#225875);color:white!important}
html .v15-dock .dock-link.quick-contact[aria-current="page"]{
  background:linear-gradient(140deg,#c64a52,#973b51);border-color:#efb1b754;color:#fff!important;
}
html .v15-dock .dock-link.quick-contact small,html .v15-dock .dock-link.quick-contact .dock-icon{color:#fff!important}
html .v15-dock .dock-link.quick-contact::after{display:none}
.v15-dock :is(a,button):focus-visible{outline:2px solid #ffd9a5;outline-offset:3px}
/* The mobile-only More menu appears above the dock. */
html .v15-dock .dock-more-group{display:none;position:relative;flex:1 1 0;min-width:0}
html .v15-dock .dock-more-button{width:100%;font:inherit}
html .v15-dock .dock-more-panel{
  position:absolute;bottom:calc(100% + 18px);right:0;z-index:4;
  width:min(240px,calc(100vw - 44px));padding:9px;
  border-radius:21px;border:1px solid #90cdee4a;
  background:linear-gradient(135deg,#152a3e,#0c1b2c);box-shadow:0 20px 60px #000b;
  backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);
}
html .v15-dock .dock-more-panel[hidden]{display:none!important}
html .v15-dock .dock-more-panel .dock-link{
  width:100%;min-height:53px;flex-direction:row;justify-content:flex-start;
  gap:16px;padding:11px 15px;direction:inherit;
}
html .v15-dock .dock-more-panel .dock-icon{width:19px;height:19px}
html .v15-dock .dock-more-group.is-current>.dock-more-button,
html .v15-dock .dock-more-button[aria-expanded="true"]{background:#8dcaf323;color:#f9fdff}
/* A tiny light trace indicates the hidden dock's location without blocking clicks. */
.v15-dock-peek{position:fixed;left:50%;bottom:5px;z-index:63;width:64px;height:3px;
  border-radius:999px;background:linear-gradient(90deg,transparent,#8cdbff,transparent);
  box-shadow:0 0 17px #65c9ff5c;opacity:0;transform:translateX(-50%);
  pointer-events:none;transition:opacity .55s ease}
body.dock-is-hidden .v15-dock-peek{opacity:.7}
body.modal-open .v15-dock-peek,body.menu-open .v15-dock-peek{opacity:0}
/* Light theme keeps contrast high, especially for Contact. */
html[data-theme=light] .v15-dock{background:rgba(248,251,254,.97);border-color:#bfd3e0;
  box-shadow:0 20px 55px #15344a30,0 0 0 1px #ffffffa0}
html[data-theme=light] .v15-dock .dock-link,html[data-theme=light] .v15-dock .dock-more-button{color:#34536a}
html[data-theme=light] .v15-dock .dock-link:hover,html[data-theme=light] .v15-dock .dock-more-button:hover{background:#e3eff6;color:#15374f}
html[data-theme=light] .v15-dock .dock-link[aria-current="page"]{background:#19648e;color:white}
html[data-theme=light] .v15-dock .dock-link.quick-contact{background:linear-gradient(135deg,#195578,#163d5d);color:white!important;border-color:#2b7094}
html[data-theme=light] .v15-dock .dock-link.quick-contact:hover{background:linear-gradient(135deg,#1b6d98,#164a6b);color:white!important}
html[data-theme=light] .v15-dock .dock-link.quick-contact[aria-current="page"]{background:#a63243;color:white!important}
html[data-theme=light] .v15-dock .dock-more-panel{background:#fff;border-color:#c7d8e5;box-shadow:0 20px 65px #1a3b502b}
/* Keep the original portfolio's visual content and light-theme treatment untouched. */
@media(max-width:1150px) and (min-width:901px){
 html .v15-dock{gap:2px;padding:7px}
 html .v15-dock .dock-link{min-width:70px;padding-inline:8px}
 .hero .scroll-cue{display:none}
 .hero .hero-bottom{bottom:110px!important}
}
@media(max-width:900px){
 html .v15-dock{width:min(580px,calc(100vw - 24px));bottom:max(12px,env(safe-area-inset-bottom));gap:2px;padding:6px;border-radius:22px}
 html .v15-dock.dock-hidden{transform:translate3d(-50%,0,0)!important;opacity:1!important;pointer-events:auto!important}
 html .v15-dock .dock-link,html .v15-dock .dock-more-button{
   flex:1 1 0;min-width:0!important;min-height:52px;padding:7px 3px!important;
   gap:5px;border-radius:16px;transform:none!important;
 }
 html .v15-dock .dock-secondary{display:none!important}
 html .v15-dock .dock-more-group{display:flex;align-items:stretch}
 html .v15-dock .dock-more-panel .dock-link{display:flex!important;min-height:54px;justify-content:flex-start;padding-inline:15px!important}
 html .v15-dock .dock-icon{width:20px;height:20px}
 html .v15-dock .dock-link small,html .v15-dock .dock-more-button small{font-size:9px}
 .v15-dock-peek{display:none}
 .hero .hero-bottom{bottom:107px!important}
 .hero .scroll-cue{display:none!important}
}
@media(max-width:470px){
 .header .header-actions{gap:5px}
 .header .brand-name{font-size:9px}
 .header .brand-name small{font-size:6px}
 .header .brand-logo{width:39px;height:39px}
 .header .brand-logo img{width:49px;height:49px}
 .header .theme-toggle{width:34px;height:34px}
 html .v15-dock{width:calc(100vw - 18px);padding:5px;gap:0}
 html .v15-dock .dock-link,html .v15-dock .dock-more-button{min-height:53px;border-radius:14px;gap:4px}
 html .v15-dock .dock-icon{width:19px;height:19px}
 html .v15-dock .dock-link small,html .v15-dock .dock-more-button small{font-size:8px}
 .hero .hero-bottom{bottom:98px!important}
}
@media(prefers-reduced-motion:reduce){
 html .v15-dock,.v15-dock-peek{transition:none!important}
}
