/* KaifaNET dock prototype — isolated to index.html, never loaded on inner pages. */
:root { --dock-h: 104px; }
html{scroll-padding-top:24px}
body{padding-bottom:116px}
.dock-topbar{position:relative;z-index:9;background:transparent;border:0}
.dock-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;padding-top:27px;padding-bottom:18px;min-height:100px}
.dock-topbar .brand img{width:194px;height:auto;display:block;filter:drop-shadow(0 2px 16px rgba(156,64,255,.04))}
.dock-header-right{display:flex;align-items:center;gap:21px}
.dock-network-chip{display:inline-flex;align-items:center;gap:9px;color:#b6b2bb;font-size:12px;letter-spacing:.01em;white-space:nowrap}
.dock-green-dot{width:7px;height:7px;border-radius:50%;background:#7ad9a9;box-shadow:0 0 0 4px rgba(102,212,162,.09)}
.dock-header-cta{display:inline-flex;align-items:center;gap:8px;padding:10px 15px;min-height:41px;background:#a522ef;color:#fff;font-size:12px;font-weight:700;border-radius:11px;box-shadow:0 7px 23px rgba(162,46,237,.18);transition:background .18s,transform .18s}
.dock-header-cta:hover{background:#b23dff;transform:translateY(-1px)}
.dock-header-cta svg{width:15px;height:15px}
.kaifa-dock{position:fixed;z-index:201;left:50%;bottom:max(21px,env(safe-area-inset-bottom));transform:translateX(-50%);width:min(calc(100vw - 32px),1080px)}
.dock-glass{display:flex;align-items:flex-end;justify-content:center;gap:4px;width:100%;padding:14px 16px 12px;border:1px solid rgba(255,255,255,.21);border-radius:25px;background:linear-gradient(158deg,rgba(88,71,108,.57) 0%,rgba(39,33,47,.84) 32%,rgba(23,19,31,.9) 100%);box-shadow:0 24px 65px rgba(0,0,0,.65),0 2px 16px rgba(25,11,49,.5),inset 0 1px 0 rgba(255,255,255,.20),inset 0 -1px 0 rgba(255,255,255,.035);-webkit-backdrop-filter:blur(28px) saturate(160%);backdrop-filter:blur(28px) saturate(160%);position:relative;isolation:isolate}
.dock-glass::before{position:absolute;inset:2px 15px auto;content:'';height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.21),transparent);pointer-events:none}
.dock-link{position:relative;display:flex;flex:1 1 0;min-width:72px;max-width:112px;flex-direction:column;align-items:center;justify-content:flex-end;gap:8px;height:76px;white-space:nowrap;text-align:center;color:#ddd7e6;outline-offset:5px;border-radius:11px;text-decoration:none;z-index:1;transition:color .15s,text-shadow .15s}
.dock-link:hover,.dock-link:focus-visible,.dock-link.is-current{color:#fff;text-shadow:0 1px 12px rgba(255,255,255,.12)}
.dock-tile{position:relative;display:grid;place-items:center;height:43px;width:43px;flex-shrink:0;border:1px solid rgba(255,255,255,.12);border-radius:13px;background:linear-gradient(140deg,rgba(97,83,114,.55),rgba(37,29,49,.84));box-shadow:0 5px 9px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.11);transform-origin:center bottom;will-change:transform;transition:transform .22s cubic-bezier(.17,.75,.28,1.38),box-shadow .2s,background .2s;pointer-events:none}
.dock-tile svg{display:block;width:24px;height:24px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.22))}
.dock-link[data-dock-id="home"] .dock-tile{background:linear-gradient(145deg,#9f41df,#5c277c);border-color:rgba(245,204,255,.4)}
.dock-link[data-dock-id="features"] .dock-tile{background:linear-gradient(145deg,#5c4f85,#332b53)}
.dock-link[data-dock-id="apps"] .dock-tile{background:linear-gradient(145deg,#4b7188,#2e4158)}
.dock-link[data-dock-id="guide"] .dock-tile{background:linear-gradient(145deg,#805e85,#4d3256)}
.dock-link[data-dock-id="pricing"] .dock-tile{background:linear-gradient(145deg,#6c5a90,#3b2e65)}
.dock-link[data-dock-id="roadmap"] .dock-tile{background:linear-gradient(145deg,#5e637e,#343853)}
.dock-link[data-dock-id="blog"] .dock-tile{background:linear-gradient(145deg,#72507c,#49294c)}
.dock-link.is-connect .dock-tile{background:linear-gradient(145deg,#bd5aff,#7e24d1);border-color:rgba(255,206,255,.45);box-shadow:0 0 0 1px rgba(161,84,255,.15),0 6px 16px rgba(172,66,255,.3),inset 0 1px rgba(255,255,255,.35)}
.dock-link:hover .dock-tile,.dock-link:focus-visible .dock-tile{transform:translateY(-11px) scale(1.24);box-shadow:0 13px 24px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.23)}
.dock-link.is-near .dock-tile{transform:translateY(-4px) scale(1.09)}
.dock-label{display:block;width:100%;white-space:normal;font-size:12px;line-height:1.15;font-weight:700;letter-spacing:-.01em;max-width:none;min-height:28px;color:inherit}
.dock-active-dot{position:absolute;bottom:-7px;width:4px;height:4px;border-radius:50%;background:rgba(215,178,255,.92);box-shadow:0 0 5px rgba(201,116,255,.65);opacity:0}
.dock-link.is-current .dock-active-dot{opacity:1}
.dock-tooltip{position:absolute;bottom:calc(100% + 19px);left:50%;transform:translate(-50%,6px);padding:7px 10px;background:rgba(29,24,37,.96);border:1px solid rgba(255,255,255,.18);border-radius:9px;color:#faf7ff;font-size:11px;box-shadow:0 10px 30px rgba(0,0,0,.4);pointer-events:none;opacity:0;transition:transform .15s,opacity .15s}
.dock-link:hover .dock-tooltip,.dock-link:focus-visible .dock-tooltip{opacity:1;transform:translate(-50%,0)}
.dock-mobile-wrap{display:none}
/* Preserve structure; relocate initial hero into the space previously reserved by sticky header. */
.hero{padding-top:68px}
.hero h1{letter-spacing:-.055em;word-spacing:.03em}
/* Extend bottom spacing so dock never covers the bottom-most footer or SEO copy. */
.footer{padding-bottom:72px}
@media(min-width:761px) and (max-width:1120px){.kaifa-dock{width:min(calc(100vw - 24px),960px)}.dock-glass{gap:2px;padding-inline:10px}.dock-link{min-width:64px;max-width:98px;height:72px}.dock-label{font-size:11px;min-height:26px}}
@media(max-width:760px){
  body{padding-bottom:120px}
  .dock-topbar-inner{min-height:76px;padding-top:16px;padding-bottom:12px}
  .dock-topbar .brand img{width:156px}
  .dock-header-right{gap:10px}
  .dock-network-chip{display:none}
  .dock-header-cta{padding:10px 11px;min-height:38px;font-size:11px;border-radius:9px}
  .dock-desktop{display:none}
  .dock-mobile-wrap{display:block}
  .dock-mobile{z-index:240;bottom:max(13px,env(safe-area-inset-bottom));width:min(384px,calc(100vw - 20px))}
  .dock-mobile .dock-glass{width:100%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;gap:1px;padding:10px 7px 12px;border-radius:22px}
  .dock-mobile .dock-link{flex:initial;width:auto;height:61px;gap:7px;justify-content:flex-end;min-width:0;border:0;background:none;padding:0;cursor:pointer;font:inherit}
  .dock-mobile .dock-tile{height:40px;width:40px;border-radius:12px}
  .dock-mobile .dock-tile svg{width:22px;height:22px}
  .dock-mobile .dock-label{font-size:10px;font-weight:700;color:#f2eef8}
  .dock-mobile .dock-link:hover .dock-tile{transform:none}
  .dock-mobile .dock-link:active .dock-tile{transform:scale(.91)}
  .dock-mobile .dock-active-dot{bottom:-6px}
  .dock-extra-menu{position:fixed;z-index:235;bottom:calc(max(13px,env(safe-area-inset-bottom)) + 99px);left:50%;transform:translate(-50%,14px) scale(.975);width:min(384px,calc(100vw - 20px));max-height:min(63vh,520px);overflow:auto;overscroll-behavior:contain;background:linear-gradient(145deg,rgba(52,39,64,.97),rgba(18,15,25,.98));border:1px solid rgba(238,213,255,.22);border-radius:22px;padding:13px;box-shadow:0 19px 75px rgba(0,0,0,.73),inset 0 1px 0 rgba(255,255,255,.11);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);opacity:0;pointer-events:none;transition:transform .2s ease,opacity .2s ease}
  .dock-mobile-wrap.is-open .dock-extra-menu{opacity:1;transform:translate(-50%,0) scale(1);pointer-events:auto}
  .dock-extra-header{padding:6px 7px 12px;display:flex;align-items:center;justify-content:space-between;color:#eee8f5;font-size:12px;font-weight:750;letter-spacing:.02em}
  .dock-extra-close{border:1px solid rgba(255,255,255,.16);display:grid;place-items:center;background:rgba(255,255,255,.06);width:27px;height:27px;border-radius:8px;color:#fff}
  .dock-extra-close svg{width:15px;height:15px}
  .dock-extra-menu>a{display:flex;align-items:center;gap:13px;color:#f4effa;min-height:49px;border-top:1px solid rgba(255,255,255,.065);padding:9px 8px;font-size:14px}
  .dock-extra-menu>a:hover{background:rgba(255,255,255,.065);border-radius:9px}
  .dock-extra-menu>a>svg{width:20px;height:20px;color:#bd7ef2}
  .dock-extra-menu .dock-mini-arrow{margin-left:auto;width:15px;height:15px;color:#8a8292}
  .dock-mobile-shade{position:fixed;inset:0;z-index:230;background:rgba(0,0,0,.43);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}
  .dock-mobile-wrap.is-open .dock-more .dock-tile{background:linear-gradient(145deg,#a843f1,#602983)}
  .dock-link.is-near .dock-tile{transform:none}
  .hero{padding-top:49px}
  .footer{padding-bottom:35px}
}
@media(max-width:365px){.dock-mobile .dock-tile{width:37px;height:37px}.dock-mobile .dock-link{gap:7px}.dock-header-cta{font-size:10px}}
@media(prefers-reduced-motion:reduce){.dock-link .dock-tile,.dock-extra-menu,.dock-link .dock-tooltip{transition:none!important}}
@media(max-width:365px){.dock-mobile .dock-label{font-size:8px;letter-spacing:-.04em}}


/* v3 — tight content-sized macOS Dock, responsive and no horizontal bleed. */
@media (min-width: 761px) {
  .kaifa-dock.dock-desktop {
    width: max-content;
    max-width: calc(100vw - 36px);
    left: 50%;
    right: auto;
    transform: translateX(-50%);
  }
  .dock-desktop .dock-glass {
    width: max-content;
    max-width: 100%;
    display: flex;
    gap: 2px;
    padding: 10px 13px 9px;
    align-items: flex-end;
    justify-content: center;
    border-radius: 24px;
  }
  .dock-desktop .dock-link {
    flex: 0 0 91px;
    min-width: 0;
    max-width: none;
    height: 81px;
    gap: 8px;
    justify-content: flex-end;
  }
  .dock-desktop .dock-link[data-dock-id="roadmap"] { flex-basis: 108px; }
  .dock-desktop .dock-link[data-dock-id="features"] { flex-basis: 106px; }
  .dock-desktop .dock-link[data-dock-id="connect"] { flex-basis: 110px; }
  .dock-desktop .dock-label {
    font-size: 11.5px;
    line-height: 1.15;
    font-weight: 730;
    color: #f0ecf7;
    white-space: nowrap;
    min-height: 17px;
    text-shadow: 0 1px 8px rgba(0,0,0,.35);
  }
  .dock-desktop .dock-tile { width: 45px; height: 45px; }
  .dock-desktop .dock-tile svg { width: 25px; height: 25px; }
  .dock-desktop .dock-active-dot { bottom: -5px; }
}
@media (min-width: 761px) and (max-width: 980px) {
  .dock-desktop .dock-glass { gap: 1px; padding-inline: 7px; }
  .dock-desktop .dock-link { flex-basis: clamp(61px, 8.2vw, 82px); }
  .dock-desktop .dock-link[data-dock-id="features"] { flex-basis: clamp(80px, 11vw, 95px); }
  .dock-desktop .dock-link[data-dock-id="roadmap"] { flex-basis: clamp(86px, 11.5vw, 103px); }
  .dock-desktop .dock-link[data-dock-id="connect"] { flex-basis: clamp(82px, 11vw, 100px); }
  .dock-desktop .dock-label { font-size: clamp(9.5px, 1.2vw, 11px); letter-spacing: -.03em; }
  .dock-desktop .dock-tile { width: 41px; height: 41px; }
}
@media (max-width: 760px) {
  .dock-mobile-wrap {display:block;}
  .dock-mobile {
    left: 50%; right: auto;
    width: min(370px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    transform: translateX(-50%);
    bottom: max(11px, env(safe-area-inset-bottom));
  }
  .dock-mobile .dock-glass {
    box-sizing: border-box;
    width: 100%;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0;
    justify-content: stretch;
    align-items: center;
    padding: 9px 5px 11px;
    border-radius: 20px;
  }
  .dock-mobile .dock-link {
    width: 100%; min-width: 0; max-width: none;
    height: 65px; gap: 6px;
    align-items: center; justify-content: flex-end;
    overflow: visible;
    padding: 0;
  }
  .dock-mobile .dock-tile {
    width: clamp(34px, 10vw, 40px);
    height: clamp(34px, 10vw, 40px);
    border-radius: 11px;
  }
  .dock-mobile .dock-tile svg { width: 21px; height: 21px; }
  .dock-mobile .dock-label {
    width: 100%; max-width: 100%; min-width: 0;
    text-align: center;
    overflow-wrap: anywhere;
    white-space: normal;
    line-height: 1.1;
    font-size: clamp(9px, 2.6vw, 11px);
    font-weight: 750;
    color: #f5f0fa;
    min-height: 17px;
    letter-spacing: -.015em;
  }
  .dock-mobile .dock-link.is-current .dock-label { color:#fff; }
  .dock-mobile .dock-active-dot { bottom: -7px; }
  .dock-extra-menu {
    width: min(370px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    bottom: calc(max(11px, env(safe-area-inset-bottom)) + 96px);
  }
  body { padding-bottom: 122px; }
}
@media (max-width: 360px) {
  .dock-mobile .dock-label { font-size: 9px; }
  .dock-mobile .dock-link { height: 62px; }
  .dock-mobile .dock-glass {padding-inline: 4px;}
}
/* Final typography + protect the inherited footer at tablet desktop widths. */
@media (min-width: 981px) {
  .dock-desktop .dock-label { font-size: 12.5px; }
  .dock-desktop .dock-link[data-dock-id="guide"] { flex-basis: 101px; }
  .dock-desktop .dock-link[data-dock-id="roadmap"] { flex-basis: 119px; }
  .dock-desktop .dock-link[data-dock-id="connect"] { flex-basis: 119px; }
}
@media (min-width: 881px) and (max-width: 1220px) {
  .footer-main { flex-wrap: wrap; }
  .footer-links { width: 100%; flex-wrap: wrap; gap: 14px 22px; }
}
html, body { max-width: 100%; overflow-x: clip; }
@media (min-width: 981px) {
  .dock-desktop .dock-link { flex-basis: 72px; }
  .dock-desktop .dock-link[data-dock-id="home"] { flex-basis: 74px; }
  .dock-desktop .dock-link[data-dock-id="features"] { flex-basis: 106px; }
  .dock-desktop .dock-link[data-dock-id="apps"] { flex-basis: 101px; }
  .dock-desktop .dock-link[data-dock-id="guide"] { flex-basis: 102px; }
  .dock-desktop .dock-link[data-dock-id="pricing"] { flex-basis: 72px; }
  .dock-desktop .dock-link[data-dock-id="roadmap"] { flex-basis: 121px; }
  .dock-desktop .dock-link[data-dock-id="blog"] { flex-basis: 66px; }
  .dock-desktop .dock-link[data-dock-id="connect"] { flex-basis: 117px; }
}


/* KaifaNET Compact Dock V6 — balanced desktop spacing, no mobile changes.
   Eight equal-width columns, aligned icon baselines and caption centers. */
@media (min-width: 761px) {
  .kaifa-dock.dock-desktop {
    box-sizing: border-box;
    left: 50%;
    right: auto;
    width: min(924px, calc(100vw - 32px));
    max-width: calc(100vw - 32px);
    transform: translateX(-50%);
  }
  .dock-desktop .dock-glass {
    box-sizing: border-box;
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    align-items: end;
    justify-items: stretch;
    gap: 0;
    width: 100%;
    max-width: 100%;
    padding: 16px 13px 9px;
    border-radius: 27px;
    border: 1px solid rgba(255,255,255,.24);
    background:
      linear-gradient(180deg, rgba(255,255,255,.14), rgba(255,255,255,.04) 23%, rgba(255,255,255,.012)),
      linear-gradient(145deg, rgba(92,71,113,.44) 0%, rgba(46,37,58,.54) 32%, rgba(21,18,30,.72) 100%);
    box-shadow:
      0 24px 60px rgba(0,0,0,.56),
      0 7px 25px rgba(80,37,126,.16),
      inset 0 1px 0 rgba(255,255,255,.28),
      inset 0 -1px 0 rgba(255,255,255,.06);
    -webkit-backdrop-filter: blur(34px) saturate(180%);
    backdrop-filter: blur(34px) saturate(180%);
    overflow: hidden;
  }
  .dock-desktop .dock-glass::before {
    inset: 1px 17px auto;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.42), rgba(255,255,255,.16), transparent);
  }
  .dock-desktop .dock-glass::after {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background:
      radial-gradient(120% 90% at 50% 0%, rgba(255,255,255,.13) 0%, rgba(255,255,255,0) 48%),
      radial-gradient(90% 60% at 50% 110%, rgba(167,77,255,.08) 0%, rgba(167,77,255,0) 62%);
    pointer-events: none;
  }
  .dock-desktop .dock-link,
  .dock-desktop .dock-link[data-dock-id] {
    box-sizing: border-box;
    flex: none;
    width: 100%;
    min-width: 0;
    max-width: none;
    height: 78px;
    padding: 0 2px;
    margin: 0;
    justify-self: stretch;
    justify-content: flex-end;
    gap: 7px;
    align-items: center;
  }
  .dock-desktop .dock-label {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    min-height: 28px;
    white-space: normal;
    overflow-wrap: normal;
    text-align: center;
    font-size: 12.25px;
    line-height: 1.13;
    letter-spacing: -.018em;
    color: #fcfbff;
    font-weight: 720;
    text-shadow: 0 1px 12px rgba(0,0,0,.34);
  }
  .dock-desktop .dock-tile {
    width: 42px;
    height: 42px;
    margin-inline: auto;
    border-radius: 12px;
    transform-origin: center bottom;
  }
  .dock-desktop .dock-tile svg { width: 23px; height: 23px; }
  .dock-desktop .dock-active-dot { bottom: -3px; }
}
@media (min-width: 761px) and (max-width: 950px) {
  .kaifa-dock.dock-desktop {
    width: min(924px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
  }
  .dock-desktop .dock-glass { padding: 15px 9px 8px; }
  .dock-desktop .dock-link,
  .dock-desktop .dock-link[data-dock-id] { height: 75px; gap: 6px; padding-inline: 1px; }
  .dock-desktop .dock-label { font-size: clamp(10.25px, 1.27vw, 11.7px); }
  .dock-desktop .dock-tile { width: 39px; height: 39px; }
  .dock-desktop .dock-tile svg { width: 22px; height: 22px; }
}


/* V7 — restrained hover: icon stays INSIDE the glass, captions never jump.
   Desktop-only. Mobile Dock is intentionally unchanged. */
@media (min-width: 761px) and (hover: hover) {
  .dock-desktop .dock-tile {
    transition: transform .19s cubic-bezier(.22,.68,.28,1), box-shadow .19s ease, filter .19s ease;
  }
  .dock-desktop .dock-link:hover .dock-tile,
  .dock-desktop .dock-link:focus-visible .dock-tile {
    transform: translateY(-2px) scale(1.055);
    filter: brightness(1.09);
    box-shadow: 0 8px 17px rgba(0,0,0,.3),
                0 0 0 1px rgba(207,157,255,.2),
                inset 0 1px 0 rgba(255,255,255,.25);
  }
  .dock-desktop .dock-link.is-near .dock-tile {
    transform: translateY(-1px) scale(1.015);
  }
  .dock-desktop .dock-link:hover.is-near .dock-tile,
  .dock-desktop .dock-link:focus-visible.is-near .dock-tile {
    transform: translateY(-2px) scale(1.055);
  }
  /* Captions are visible already. The extra tooltip used to peek through the
     clipped panel as a little triangle on hover. */
  .dock-desktop .dock-tooltip { display:none; }
}