/* DkTechnoLab v5 — "Split Islands" header
   Desktop (>=992px): three floating white-glass pills (brand / nav / actions) that glide together into
   one continuous capsule after 80px of scroll (.island.is-merged), with light mega cards below the nav pill.
   Mobile: mini island on top + app-like bottom dock + bottom sheet. Logic: assets/js/header.js */
:root {
  --header-h: 86px;           /* JS keeps this exact */
  --dock-h: 0px;
  --isl-top: 14px;
  --isl-h: 58px;
  --isl-bg: rgba(255, 255, 255, .88);
  --isl-bg-solid: #1F1A10;
  --isl-line: #EFE7D3;
  --isl-text: #1F1A10;
  --isl-ink: #1F1A10;
  --isl-cyan: #FFC107;      /* main yellow (ring, dots) */
  --isl-cyan-soft: #9A6B00; /* dark-yellow for icons/text on white */
  --isl-orange: #FFC107;    /* CTA yellow */
  --isl-tint: #FFF4CC;
  --isl-hover: #FFF4CC;
  --isl-spring: cubic-bezier(.32, 1.28, .52, 1);
  --isl-smooth: cubic-bezier(.22, .8, .26, 1);
  --isl-merge: 450ms cubic-bezier(.2, .8, .2, 1);
  --isl-piece-shadow: 0 1px 2px rgba(60, 45, 10, .05), 0 12px 32px -14px rgba(60, 45, 10, .22);
  --isl-shadow: inset 0 1px 0 rgba(255, 255, 255, .9), inset 0 0 0 1px #EFE7D3,
                0 2px 6px rgba(60, 45, 10, .06), 0 18px 44px -18px rgba(60, 45, 10, .26);
}

/* The header floats over the page: reserve its space */
main#main { padding-top: var(--header-h); }
html { scroll-padding-top: calc(var(--header-h) + 12px); }
.svc-nav { top: var(--header-h); }
.sidebar-sticky { top: calc(var(--header-h) + 16px); }

.island { position: fixed; top: 0; left: 0; right: 0; height: 0; z-index: 1030; pointer-events: none; }
.island a, .island button { -webkit-tap-highlight-color: transparent; }
.island a:focus-visible, .island button:focus-visible,
.island-dock a:focus-visible, .island-dock button:focus-visible,
.isheet a:focus-visible, .isheet button:focus-visible { outline: 2px solid #F5A300; outline-offset: 2px; }

/* Scroll-progress ring (desktop logo + mobile orb) */
.island-ring { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); pointer-events: none; }
.island-ring circle { fill: none; stroke-width: 2.5; }
.island-ring .ring-track { stroke: rgba(201, 148, 0, .16); }
.island-ring .ring-fill { stroke: #F5A300; stroke-linecap: round; stroke-dasharray: 100; stroke-dashoffset: 100; filter: drop-shadow(0 0 2px rgba(255, 193, 7, .7)); }

/* Status dot (mobile mini island + sheet) */
.st-dot { position: relative; flex: none; width: 8px; height: 8px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34, 197, 94, .18); }
.st-dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: inherit; animation: isl-ping 2s ease-out infinite; }
.is-closed .st-dot { background: #f5a524; box-shadow: 0 0 0 3px rgba(245, 165, 36, .18); }
.is-closed .st-dot::after { animation: none; }
@keyframes isl-ping { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(2.6); opacity: 0; } }

.cta-dot { flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: #1F1A10; color: #FFC107; font-size: .95rem; transition: transform .4s var(--isl-spring); }
.island-cta:hover .cta-dot, .isheet-cta:hover .cta-dot { transform: rotate(45deg); }
.ip-ico { flex: none; width: 42px; height: 42px; border-radius: 13px; display: grid; place-items: center; background: var(--isl-tint); color: #9A6B00; font-size: 1.12rem; transition: background .25s ease, color .25s ease, box-shadow .25s ease; }

/* ---------- Desktop: split islands ---------- */
.isl-wrap {
  position: absolute; top: var(--isl-top); left: 0; right: 0;
  max-width: 1240px; margin: 0 auto; padding: 0 20px;
  display: flex; align-items: flex-start; justify-content: space-between; gap: 12px;
  pointer-events: none;
  transition: max-width var(--isl-merge), gap var(--isl-merge);
}
/* One shared shadow for the merged capsule (pieces drop their own so the seams stay clean) */
.isl-wrap::before {
  content: ""; position: absolute; top: 0; left: 20px; right: 20px; height: var(--isl-h);
  border-radius: 999px; box-shadow: var(--isl-piece-shadow); opacity: 0; pointer-events: none;
  transition: opacity var(--isl-merge);
}
.isl-piece {
  position: relative; flex: 0 0 auto; height: var(--isl-h); pointer-events: auto;
  display: flex; align-items: center;
  background: var(--isl-bg);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%);
  border: 1px solid var(--isl-line);
  border-radius: 29px;
  box-shadow: var(--isl-piece-shadow);
  color: var(--isl-ink);
  transition: border-radius var(--isl-merge), box-shadow var(--isl-merge), margin var(--isl-merge), flex-grow var(--isl-merge), background-color .3s ease;
}

/* 1. Brand pill */
.isl-brand { gap: 11px; padding: 0 22px 0 16px; text-decoration: none; white-space: nowrap; }
.isl-brand:hover { color: var(--isl-ink); }
.island-logo { position: relative; flex: none; width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; }
.island-logo img { width: 38px; height: 38px; border-radius: 50%; background: #fff; padding: 4px; object-fit: contain; box-shadow: 0 0 0 1px #EFE7D3, 0 2px 8px rgba(60, 45, 10, .12); transition: transform .4s var(--isl-spring); }
.isl-brand:hover .island-logo img { transform: rotate(-12deg) scale(1.05); }
.isl-word { display: flex; flex-direction: column; line-height: 1; }
.isl-name { font-family: "Exo 2", var(--dk-font-head, sans-serif); font-weight: 700; font-size: 1.1rem; letter-spacing: -.005em; color: #1F1A10; }
.isl-name b { font-weight: 700; color: #9A6B00; }
.isl-cap { margin-top: 4px; font-family: var(--dk-font-body, Inter, sans-serif); font-size: .62rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; color: #7A7262; }

/* 2. Nav pill + liquid hover pill */
.isl-nav { justify-content: center; padding: 0 7px; flex-shrink: 1; min-width: 0; }
.isl-nav ul { display: flex; align-items: center; gap: 2px; list-style: none; margin: 0; padding: 0; }
.island-link {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: 5px;
  height: 42px; padding: 0 15px; border: 0; border-radius: 999px; background: none; white-space: nowrap;
  font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 600; font-size: .95rem; line-height: 1;
  color: var(--isl-text); text-decoration: none; cursor: pointer;
  transition: color .2s ease, background-color .25s ease, padding var(--isl-merge);
}
.island-link:hover, .island-link:focus-visible { color: var(--isl-ink); }
.island-link.active { background: #FFC107; color: #1F1A10; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 6px 14px -8px rgba(245, 180, 0, .8); }
.island-trigger .bi { font-size: .62rem; opacity: .7; transition: transform .35s var(--isl-spring); }
.island-trigger[aria-expanded="true"] .bi { transform: rotate(180deg); opacity: 1; }
.island-liquid {
  --dl: .42s; --dr: .42s;
  position: absolute; top: 50%; left: 0; right: 100%; height: 42px; margin-top: -21px;
  border-radius: 999px; pointer-events: none; opacity: 0; background: #FFF4CC;
  box-shadow: inset 0 0 0 1px rgba(245, 180, 0, .22);
  transition: left var(--dl) var(--isl-spring), right var(--dr) var(--isl-spring), opacity .25s ease;
}
.island-liquid.go-right { --dl: .56s; --dr: .34s; }
.island-liquid.go-left { --dl: .34s; --dr: .56s; }
.island-liquid.is-on { opacity: 1; }

/* 3. Actions pill */
.isl-actions { gap: 6px; padding: 0 6px; }
.island-icon {
  position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; border: 0;
  display: grid; place-items: center; background: #FFFBF0; color: var(--isl-ink); font-size: 1.02rem; text-decoration: none;
  box-shadow: inset 0 0 0 1px #EFE7D3;
  transition: background .2s ease, color .2s ease, transform .3s var(--isl-spring);
}
.island-icon:hover, .island-icon:focus-visible { background: #FFF4CC; color: #7A5400; transform: scale(1.06); }
.island-tip {
  position: absolute; top: calc(100% + 12px); left: 50%; transform: translate(-50%, -4px);
  padding: 5px 9px; border-radius: 8px; background: var(--isl-bg-solid); color: #fff;
  font: 600 .72rem/1.2 var(--dk-font-body, Inter, sans-serif); letter-spacing: .04em; white-space: nowrap;
  box-shadow: 0 10px 24px -10px rgba(60, 45, 10, .5); opacity: 0; pointer-events: none;
  transition: opacity .2s ease, transform .25s var(--isl-smooth);
}
.island-tip::before { content: ""; position: absolute; top: -4px; left: 50%; width: 8px; height: 8px; margin-left: -4px; background: inherit; transform: rotate(45deg); border-radius: 2px; }
.island-icon:hover .island-tip, .island-icon:focus-visible .island-tip { opacity: 1; transform: translate(-50%, 0); }
.island-cta {
  flex: none; display: inline-flex; align-items: center; gap: 10px; height: 44px; padding: 0 5px 0 18px; margin-left: 2px;
  border-radius: 999px; background: var(--isl-orange); color: #1F1A10; text-decoration: none; white-space: nowrap;
  font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 700; font-size: .93rem;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .45), 0 10px 24px -12px rgba(245, 180, 0, .8);
  transition: background .2s ease, transform .3s var(--isl-spring);
}
.island-cta:hover { background: #F2B200; color: #1F1A10; }
.island-cta:active { transform: scale(.97); }
.island-cta .cta-dot { width: 34px; height: 34px; font-size: .92rem; }

/* ---------- Scroll merge: the three pills glide into one capsule ---------- */
.island.is-merged .isl-wrap { max-width: 1320px; gap: 0; } /* capsule itself ~1120px */
.island.is-merged .isl-wrap::before { opacity: 1; }
.island.is-merged .isl-piece { box-shadow: 0 1px 2px rgba(60, 45, 10, 0), 0 12px 32px -14px rgba(60, 45, 10, 0); }
.island.is-merged .isl-brand { border-radius: 29px 0 0 29px; }
.island.is-merged .isl-nav { border-radius: 0; flex-grow: 1; margin: 0 -1px; }
.island.is-merged .isl-actions { border-radius: 0 29px 29px 0; }
.island.is-merged .island-link { padding: 0 13px; }
.isl-wrap.no-anim, .isl-wrap.no-anim *, .isl-wrap.no-anim::before { transition: none !important; }

/* ---------- Mega cards (floating below the nav pill) ---------- */
.island-panel {
  position: absolute; top: calc(100% + 8px); left: 50%; z-index: 2;
  width: var(--pw, 780px); max-width: calc(100vw - 32px);
  padding: 14px 14px 16px; border-radius: 24px;
  background: rgba(255, 255, 255, .985); border: 1px solid #EFE7D3;
  box-shadow: 0 2px 6px rgba(60, 45, 10, .06), 0 28px 60px -22px rgba(60, 45, 10, .3);
  visibility: hidden; opacity: 0; pointer-events: none;
  transform: translate(calc(-50% + var(--dx, 0px)), 8px);
  transition: opacity .2s ease, transform .28s var(--isl-smooth), visibility 0s linear .28s;
}
.island-panel::before { content: ""; position: absolute; left: 0; right: 0; top: -10px; height: 10px; }
.island-panel.panel-services { --pw: 800px; }
.island-panel.panel-tech { --pw: 600px; }
.island-panel.is-active {
  visibility: visible; opacity: 1; pointer-events: auto;
  transform: translate(calc(-50% + var(--dx, 0px)), 0);
  transition: opacity .22s ease, transform .32s var(--isl-smooth), visibility 0s;
}
.ip-grid { display: grid; grid-template-columns: 1fr 250px; gap: 12px; }
.ip-label { margin: 2px 12px 8px; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #9A6B00; }
.ip-tiles { display: grid; gap: 4px; }
.ip-2 { grid-template-columns: 1fr 1fr; }
.ip-tile {
  display: flex; align-items: flex-start; gap: 12px; padding: 12px; border-radius: 16px;
  color: var(--isl-ink); text-decoration: none; white-space: normal;
  transition: background .2s ease, transform .3s var(--isl-spring);
}
.ip-tile:hover, .ip-tile:focus-visible { background: #FFFBF0; color: var(--isl-ink); transform: translateX(2px); }
.ip-tile:hover .ip-ico, .ip-tile:focus-visible .ip-ico { background: linear-gradient(135deg, #FFD54F, #FFC107 45%, #F59E0B); color: #1F1A10; box-shadow: 0 8px 18px -8px rgba(245, 180, 0, .75); }
.ip-tile b { display: block; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-size: .95rem; font-weight: 700; margin: 1px 0 2px; }
.ip-tile small { display: block; font-size: .8rem; line-height: 1.4; color: #7A7262; }
.ip-all { display: inline-flex; align-items: center; gap: 6px; margin: 8px 0 0 12px; font-size: .86rem; font-weight: 600; color: #9A6B00; text-decoration: none; }
.ip-all:hover { color: #7A5400; }
.ip-all .bi { transition: transform .3s var(--isl-spring); }
.ip-all:hover .bi { transform: translateX(4px); }
.ip-promo {
  display: flex; flex-direction: column; align-items: flex-start; gap: 8px; padding: 20px; border-radius: 20px;
  color: #1F1A10; text-decoration: none; white-space: normal; position: relative; overflow: hidden;
  background: radial-gradient(220px 160px at 100% 0%, rgba(255, 255, 255, .55), transparent 70%),
              linear-gradient(150deg, #FFF4CC 0%, #FFE082 55%, #FFD54F 100%);
  border: 1px solid rgba(245, 180, 0, .35);
  transition: transform .35s var(--isl-spring), border-color .25s ease;
}
.ip-promo:hover { color: #1F1A10; transform: translateY(-2px); border-color: rgba(201, 148, 0, .6); }
.ip-badge { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: rgba(255, 255, 255, .7); color: #7A5400; font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.ip-promo b { font-family: var(--dk-font-head, "Exo 2", sans-serif); font-size: 1.08rem; line-height: 1.3; }
.ip-promo small { font-size: .82rem; line-height: 1.5; color: #4A4434; }
.ip-go { margin-top: auto; display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; background: #1F1A10; color: #FFC107; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 700; font-size: .86rem; }
.ip-go .bi { transition: transform .35s var(--isl-spring); }
.ip-promo:hover .ip-go .bi { transform: rotate(45deg); }
.island-panel.is-active .ip-tile, .island-panel.is-active .ip-promo, .island-panel.is-active .ip-all { animation: isl-in .4s var(--isl-smooth) both; animation-delay: calc(.06s + var(--i, 0) * 30ms); }
@keyframes isl-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

/* Narrow desktop: drop the caption + phone, tighten the links */
@media (min-width: 992px) and (max-width: 1199.98px) {
  .isl-wrap { gap: 6px; }
  .isl-cap, .isl-phone { display: none; }
  .isl-brand { padding-right: 15px; gap: 8px; }
  .isl-nav { padding: 0 4px; }
  .isl-nav ul { gap: 0; }
  .island-link, .island.is-merged .island-link { padding: 0 9px; font-size: .88rem; }
  .island-trigger { gap: 4px; }
  .isl-actions { gap: 5px; padding: 0 5px; }
  .island-cta { padding-left: 14px; gap: 8px; font-size: .88rem; }
  .ip-grid { grid-template-columns: 1fr 220px; }
  .island-panel.panel-services { --pw: 740px; }
}

/* ---------- Mobile: mini island ---------- */
.island-mini { display: none; }
.island-dock, .isheet, .isheet-backdrop { display: none; }

@media (max-width: 991.98px) {
  :root { --header-h: 66px; --dock-h: 84px; }
  .isl-wrap { display: none; }
  .island-mini {
    position: absolute; top: 10px; left: 50%; transform: translate(-50%, 0);
    display: flex; align-items: center; gap: 12px; height: 46px; padding: 4px 16px 4px 4px;
    border-radius: 999px; pointer-events: auto;
    background: var(--isl-bg); -webkit-backdrop-filter: saturate(170%) blur(18px); backdrop-filter: saturate(170%) blur(18px);
    box-shadow: var(--isl-shadow);
    transition: transform .45s var(--isl-smooth);
  }
  .island.is-hidden .island-mini { transform: translate(-50%, -80px); }
  .mini-brand { display: flex; align-items: center; gap: 9px; text-decoration: none; }
  .mini-orb { position: relative; width: 38px; height: 38px; display: grid; place-items: center; }
  .mini-orb img { width: 30px; height: 30px; border-radius: 50%; background: #fff; padding: 3px; object-fit: contain; box-shadow: 0 0 0 1px #EFE7D3; }
  .mini-name { font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 800; font-size: 1rem; color: var(--isl-ink); letter-spacing: -.01em; }
  .mini-name span { color: #C99400; }
  .mini-status { display: grid; place-items: center; width: 14px; height: 14px; }

  /* Bottom dock */
  .island-dock {
    position: fixed; left: 50%; bottom: calc(12px + env(safe-area-inset-bottom, 0px)); z-index: 1036;
    transform: translateX(-50%);
    display: grid; grid-template-columns: repeat(5, 1fr); align-items: center;
    width: min(440px, calc(100% - 24px)); height: 66px; padding: 0 6px;
    border-radius: 26px; background: var(--isl-bg);
    -webkit-backdrop-filter: saturate(170%) blur(18px); backdrop-filter: saturate(170%) blur(18px);
    box-shadow: var(--isl-shadow);
    transition: transform .45s var(--isl-smooth), opacity .3s ease;
  }
  .modal-open .island-dock { transform: translate(-50%, 140%); opacity: 0; }
  .dock-btn {
    position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    height: 54px; border: 0; border-radius: 18px; background: none; color: #7A7262;
    font-size: .66rem; font-weight: 600; letter-spacing: .02em; text-decoration: none;
    transition: color .2s ease, background .2s ease, transform .2s ease;
  }
  .dock-btn .bi { font-size: 1.2rem; line-height: 1; }
  .dock-btn:hover, .dock-btn:focus-visible { color: var(--isl-ink); background: #FFF8E1; }
  .dock-btn:active { transform: scale(.92); }
  .dock-btn.active { color: var(--isl-ink); }
  .dock-btn.active .bi { color: #9A6B00; }
  .dock-btn.active::after { content: ""; position: absolute; bottom: 3px; width: 4px; height: 4px; border-radius: 50%; background: #F5A300; }
  .dock-quote .bi { color: #C99400; }
  .dock-core {
    justify-self: center; width: 62px; height: 62px; margin-top: -30px; padding: 0;
    display: grid; place-items: center; border-radius: 50%;
    border: 3px solid transparent;
    background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, #FFD54F, #FFC107 45%, #F59E0B) border-box;
    box-shadow: 0 0 0 5px rgba(255, 255, 255, .92), 0 0 0 6px #EFE7D3, 0 14px 28px -8px rgba(245, 180, 0, .65);
    transition: transform .4s var(--isl-spring);
  }
  .dock-core img { width: 34px; height: 34px; object-fit: contain; transition: transform .5s var(--isl-spring); }
  .dock-core:active { transform: scale(.92); }
  .dock-core[aria-expanded="true"] img { transform: rotate(360deg) scale(.9); }

  body.has-dock, body.has-dock.has-mbar { padding-bottom: calc(var(--dock-h) + 12px); }
  body.has-dock .to-top { bottom: calc(var(--dock-h) + 84px) !important; right: 18px !important; }
  body.has-dock .dk-cookie { bottom: calc(var(--dock-h) + 10px) !important; }
  body.has-dock .dk-toasts { bottom: calc(var(--dock-h) + 14px) !important; }

  /* Bottom sheet */
  .isheet-backdrop {
    display: block; position: fixed; inset: 0; z-index: 1048; background: rgba(60, 45, 10, .28);
    -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); opacity: 0; transition: opacity .35s ease;
  }
  .isheet-backdrop.is-open { opacity: 1; }
  .isheet-backdrop[hidden], .isheet[hidden] { display: none; }
  .isheet {
    display: flex; flex-direction: column; position: fixed; left: 0; right: 0; bottom: 0; z-index: 1050;
    max-height: 88vh; max-height: 88dvh; margin: 0 auto; max-width: 640px;
    border-radius: 28px 28px 0 0; color: var(--isl-ink);
    background: rgba(255, 255, 255, .97); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
    box-shadow: inset 0 1px 0 #fff, 0 0 0 1px #EFE7D3, 0 -20px 60px -20px rgba(60, 45, 10, .35);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    transform: translateY(100%); transition: transform .48s cubic-bezier(.32, .72, 0, 1);
    touch-action: pan-y;
  }
  .isheet.is-open { transform: translateY(0); }
  .isheet.is-dragging { transition: none; }
  .isheet-grip { padding: 10px 0 6px; display: grid; place-items: center; cursor: grab; touch-action: none; }
  .isheet-handle { width: 44px; height: 5px; border-radius: 5px; background: #E6DABB; }
  .isheet-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 2px 18px 10px; touch-action: none; }
  .isheet-title { margin: 0 0 4px; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 800; font-size: 1.3rem; color: var(--isl-ink); }
  .isheet-status { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 600; color: #4A4434; }
  .isheet-close { width: 42px; height: 42px; flex: none; border-radius: 50%; border: 0; background: #FFF8E1; color: var(--isl-ink); display: grid; place-items: center; transition: transform .35s var(--isl-spring), background .2s ease; }
  .isheet-close:hover { background: var(--isl-hover); transform: rotate(90deg); }
  .isheet-body { overflow-y: auto; overscroll-behavior: contain; padding: 0 18px 22px; -webkit-overflow-scrolling: touch; }
  .isheet-label { margin: 16px 2px 10px; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-size: .7rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: #9A6B00; scroll-margin-top: 8px; }
  .isheet-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
  .isheet-tech { grid-template-columns: repeat(3, 1fr); }
  .isheet-tile {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 74px; padding: 10px 4px;
    border-radius: 18px; background: #FFFBF0; border: 1px solid #EFE7D3;
    color: var(--isl-ink); font-size: .76rem; font-weight: 600; text-align: center; text-decoration: none;
    transition: background .2s ease, transform .2s ease;
  }
  .isheet-tile .bi { font-size: 1.25rem; color: #9A6B00; }
  .isheet-tile:hover, .isheet-tile:focus-visible { background: var(--isl-hover); color: var(--isl-ink); }
  .isheet-tile:active { transform: scale(.95); }
  .isheet-tile.active { background: linear-gradient(135deg, #FFE082, #FFC107); border-color: rgba(201, 148, 0, .45); }
  .isheet-tile.active .bi { color: #1F1A10; }
  .isheet-list { display: grid; gap: 6px; }
  .isheet-list a { display: flex; align-items: center; gap: 12px; padding: 10px; border-radius: 16px; background: #FFFBF0; color: var(--isl-ink); text-decoration: none; transition: background .2s ease; }
  .isheet-list a:hover, .isheet-list a:focus-visible { background: var(--isl-hover); color: var(--isl-ink); }
  .isheet-list b { display: block; font-family: var(--dk-font-head, "Exo 2", sans-serif); font-size: .94rem; font-weight: 700; }
  .isheet-list small { display: block; font-size: .76rem; color: #7A7262; }
  .isheet-contact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 20px; }
  .isc-btn { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 12px 6px; border-radius: 18px; background: #FFFBF0; border: 1px solid #EFE7D3; color: var(--isl-ink); font-size: .8rem; font-weight: 600; text-decoration: none; }
  .isc-btn .bi { font-size: 1.2rem; color: #9A6B00; }
  .isc-btn:hover, .isc-btn:focus-visible { background: var(--isl-hover); color: var(--isl-ink); }
  .isc-wa .bi { color: #25d366; }
  .isheet-cta {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; height: 54px; margin-top: 12px; padding: 0 8px 0 22px;
    border-radius: 999px; background: var(--isl-orange); color: #1F1A10; text-decoration: none;
    font-family: var(--dk-font-head, "Exo 2", sans-serif); font-weight: 700; font-size: 1rem;
    box-shadow: 0 12px 28px -12px rgba(245, 180, 0, .75);
  }
  .isheet-cta:hover { color: #1F1A10; background: #F2B200; }
  .isheet-cta .cta-dot { width: 40px; height: 40px; }
  html.isheet-lock, html.isheet-lock body { overflow: hidden; }
}
@media (min-width: 576px) and (max-width: 991.98px) {
  .isheet-list { grid-template-columns: 1fr 1fr; }
  .isheet-grid { grid-template-columns: repeat(8, 1fr); }
  .isheet-tech { grid-template-columns: repeat(6, 1fr); }
}

/* The dock replaces the widgets' mobile CTA bar */
.dk-mbar { display: none !important; }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .island *, .island *::before, .isl-wrap::before, .island-mini, .island-liquid, .island-panel, .island-dock, .island-dock *, .isheet, .isheet *, .isheet-backdrop {
    transition: none !important; animation: none !important;
  }
}

@media (max-width: 991.98px) {
  .island-mini { height: 52px; padding: 5px 18px 5px 5px; width: calc(100% - 24px); max-width: 560px; justify-content: space-between; }
  .mini-orb { width: 42px; height: 42px; }
  .mini-orb img { width: 34px; height: 34px; }
  .island.is-hidden .island-mini { transform: translate(-50%, 0); }
}

/* Original DK logo (black artwork) shown as a dark glowing badge */
.isl-mark, .mini-mark { display: block; width: auto; flex: none; border-radius: 10px; background: #000;
  box-shadow: 0 0 0 1px rgba(255, 193, 7, .35), 0 6px 18px -6px rgba(255, 170, 0, .55); }
.isl-mark { height: 40px; }
.mini-mark { height: 32px; border-radius: 8px; }
.isl-brand { gap: 10px; }
.dock-core img { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
/* Full original logo (mark + wordmark) — no separate text */
.isl-mark { height: 52px; border-radius: 12px; }
.mini-mark { height: 42px; border-radius: 10px; }
.isl-brand { padding: 0 6px; }
/* The black logo badge itself is the left island piece */
.isl-piece.isl-brand { background: none; border: 0; box-shadow: none; padding: 0; -webkit-backdrop-filter: none; backdrop-filter: none; }
.isl-piece.isl-brand::before, .isl-piece.isl-brand::after { display: none; }
.isl-brand .isl-mark { height: var(--isl-h); width: auto; max-width: none; border-radius: 16px;
  box-shadow: 0 0 0 1px rgba(255, 193, 7, .35), 0 12px 32px -14px rgba(60, 45, 10, .45); }
.island.is-merged .isl-brand .isl-mark { border-radius: 16px 0 0 16px; }

/* Transparent original logo (no black badge) — final */
.isl-piece.isl-brand { background: var(--isl-glass, rgba(255,255,255,.88)); border: 1px solid #EFE7D3;
  box-shadow: 0 1px 2px rgba(60,45,10,.05), 0 12px 32px -14px rgba(60,45,10,.22);
  -webkit-backdrop-filter: blur(16px) saturate(160%); backdrop-filter: blur(16px) saturate(160%); padding: 0 20px; }
.isl-brand .isl-mark, .island.is-merged .isl-brand .isl-mark { height: 48px; width: auto; border-radius: 0; background: none; box-shadow: none; }
.mini-mark { height: 34px; width: auto; border-radius: 0; background: none; box-shadow: none; }
.dock-core img { width: 46px; height: 46px; border-radius: 0; object-fit: contain; }
/* Wide logo: keep it from overlapping the nav, comfortable spacing */
.isl-piece.isl-brand { flex: 0 0 auto; padding: 0 22px 0 18px; overflow: hidden; }
.isl-brand .isl-mark, .island.is-merged .isl-brand .isl-mark { height: 40px; max-width: 210px; object-fit: contain; }
.island.is-merged .isl-brand { padding-right: 20px; border-right: 1px solid #EFE7D3; }
@media (min-width: 992px) and (max-width: 1199.98px) {
  .isl-brand .isl-mark, .island.is-merged .isl-brand .isl-mark { height: 32px; max-width: 165px; }
  .isl-piece.isl-brand { padding: 0 14px; }
}
/* Logo hover: gentle lift + soft glow, no box/border */
.isl-brand .isl-mark { transition: transform .35s var(--isl-spring, cubic-bezier(.2,.8,.2,1)), filter .35s ease; }
.isl-brand:hover .isl-mark, .isl-brand:focus-visible .isl-mark { box-shadow: none; transform: scale(1.04); filter: drop-shadow(0 4px 10px rgba(255, 179, 0, .35)); }
.isl-brand:focus { outline: none; }
.isl-brand:focus-visible { outline: 2px solid rgba(255, 193, 7, .6); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .isl-brand:hover .isl-mark { transform: none; } }