/* WebJoiner site v2 — shell: announcement bar, header, mega menu, mobile menu, footer */

/* announcement bar (dismissible; state in localStorage, wrapped in try/catch) */
.annc{background:var(--ink);color:#fff;font-size:var(--fs-14)}
.annc__in{display:flex;align-items:center;justify-content:center;gap:var(--s2);min-height:40px;position:relative;padding-right:calc(var(--gutter) + 36px)}
.annc__link{display:inline-flex;align-items:center;gap:10px;color:#fff;padding:8px 0;line-height:1.35;text-align:center}
.annc__link:hover{color:#fff;text-decoration:none}
.annc__link:hover .annc__text{text-decoration:underline;text-underline-offset:3px}
.annc__link:focus-visible,.annc__close:focus-visible{outline-color:var(--accent-fill)}
.annc__tag{flex:none;padding:1px 8px;border-radius:var(--r-pill);background:var(--accent-fill);color:var(--ink);font-weight:600;font-size:var(--fs-12);line-height:1.6}
.annc__go{flex:none;width:6px;height:6px;border:solid var(--accent-fill);border-width:1.75px 1.75px 0 0;transform:rotate(45deg);transition:transform var(--t-fast) var(--ease)}
.annc__link:hover .annc__go{transform:translateX(3px) rotate(45deg)}
.annc__close{position:absolute;right:var(--gutter);top:50%;transform:translateY(-50%);width:32px;height:32px;margin-right:-6px;border:0;border-radius:var(--r);background:none;color:#fff;cursor:pointer;display:grid;place-items:center;opacity:.85}
.annc__close:hover{opacity:1;background:rgba(255,255,255,.12)}
.annc__close:focus-visible{outline-offset:0}
.annc__close svg{width:16px;height:16px}
.annc-off .annc,.annc[hidden]{display:none}
@media (max-width:600px){.annc__in{justify-content:flex-start}.annc__link{text-align:left;font-size:var(--fs-13)}}

/* header: sticky, blurred; shadow toggled by an IntersectionObserver sentinel (no scroll listener) */
.hdr-sentinel{height:1px;margin-bottom:-1px}
.hdr{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(1.6) blur(14px);backdrop-filter:saturate(1.6) blur(14px);border-bottom:1px solid var(--line);transition:box-shadow var(--t) var(--ease),background var(--t) var(--ease)}
.hdr.is-scrolled{background:rgba(255,255,255,.92);box-shadow:0 1px 0 rgba(12,34,51,.02),0 8px 24px -16px rgba(12,34,51,.22)}
.hdr__in{display:flex;align-items:center;gap:var(--s6);height:var(--header-h)}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);font-weight:650;font-size:1.125rem;letter-spacing:-.02em;flex:none}
.brand:hover{color:var(--ink);text-decoration:none}
.brand svg{width:28px;height:28px}
.brand img{display:block;width:auto;height:28px}

.nav{display:flex;align-items:center;gap:2px;margin-left:var(--s4)}
.nav__item{position:relative}
.nav__link,.nav__trigger{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border:0;border-radius:var(--r);background:none;color:var(--ink);font:500 var(--fs-14)/1 var(--font);cursor:pointer;text-decoration:none;transition:background var(--t-fast),color var(--t-fast)}
.nav__link:hover,.nav__trigger:hover,.nav__trigger[aria-expanded="true"]{background:var(--bg-soft);color:var(--ink);text-decoration:none}
.nav__link[aria-current="page"],.nav__item[data-current] .nav__trigger{color:var(--accent);box-shadow:inset 0 -2px 0 var(--accent-fill)}
.nav__trigger::after{content:"";width:6px;height:6px;border:solid var(--muted);border-width:0 1.5px 1.5px 0;transform:translateY(-2px) rotate(45deg);transition:transform var(--t-fast) var(--ease)}
.nav__trigger[aria-expanded="true"]::after{transform:translateY(1px) rotate(225deg)}
.hdr__end{display:flex;align-items:center;gap:var(--s3);margin-left:auto}
.hdr__login{display:inline-flex;align-items:center;gap:6px;font:500 var(--fs-14)/1 var(--font);color:var(--ink);padding:10px 8px;border-radius:var(--r)}
.hdr__login svg{width:16px;height:16px;color:var(--muted)}
.hdr__login:hover{color:var(--accent);text-decoration:none;background:var(--bg-soft)}
.hdr__login:hover svg{color:var(--accent)}

/* mega menu */
.mega{position:absolute;top:calc(100% + 10px);left:-16px;z-index:60;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-3);padding:var(--s3);opacity:0;transform:translateY(-6px);pointer-events:none;visibility:hidden;transition:opacity var(--t-fast) var(--ease),transform var(--t-fast) var(--ease),visibility 0s linear var(--t-fast)}
.mega.is-open{opacity:1;transform:none;pointer-events:auto;visibility:visible;transition-delay:0s}
.mega::before{content:"";position:absolute;inset:-12px 0 auto;height:12px}
.mega--product{width:min(960px,calc(100vw - 240px));display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:0 var(--s3)}
.mega__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s2)}
.mega__group{min-width:0}
.mega__h{display:flex;align-items:center;gap:8px;padding:10px 12px 4px;font-size:var(--fs-12);font-weight:600;color:var(--muted);letter-spacing:.01em}
.mega--narrow{width:340px}
.mega__grid{display:grid;grid-template-columns:1fr;gap:2px;list-style:none}
.mega__link{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:start;padding:10px 12px;border-radius:var(--r);color:var(--text);text-decoration:none;transition:background var(--t-fast)}
.mega__link:hover,.mega__link:focus-visible{background:var(--bg-soft);text-decoration:none;color:var(--text)}
.mega__link b{display:block;color:var(--ink);font-weight:600;font-size:var(--fs-14);line-height:1.35}
.mega__link:hover b,.mega__link[aria-current="page"] b{color:var(--accent)}
.mega__link span.d,.mega__new .d{display:block;font-size:var(--fs-13);line-height:1.45;color:var(--muted);margin-top:2px}
.mega__ico{width:36px;height:36px;border-radius:var(--r);display:grid;place-items:center;background:var(--accent-soft);color:var(--accent);transition:background var(--t-fast),color var(--t-fast)}
.mega__link:hover .mega__ico,.mega__new a:hover .mega__ico{background:var(--accent-fill);color:var(--ink)}
.mega__ico svg{width:18px;height:18px}
.mega__ico--sm{width:28px;height:28px}
.mega__ico--sm svg{width:15px;height:15px}
.mega__link.is-soon .mega__ico{background:var(--bg-soft);color:var(--muted)}
.mega__aside{display:flex;flex-direction:column;gap:var(--s2);padding:var(--s2) var(--s4) var(--s4);border-radius:var(--r);background:linear-gradient(180deg,var(--tint),#fff)}
.mega__aside .mega__h{padding:6px 0 2px}
.mega__new{list-style:none;display:grid;gap:2px;margin:0 calc(var(--s2) * -1)}
.mega__new a{display:grid;grid-template-columns:28px 1fr;gap:10px;align-items:start;padding:8px;border-radius:var(--r);color:var(--text)}
.mega__new a:hover{background:#fff;text-decoration:none;color:var(--text)}
.mega__new b{display:block;color:var(--ink);font-size:var(--fs-14);font-weight:600;line-height:1.35}
.mega__aside .more{margin-top:auto;font-size:var(--fs-14)}
.mega__foot{grid-column:1 / -1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin:var(--s3) calc(var(--s3) * -1) calc(var(--s3) * -1);padding:14px 24px;background:var(--bg-soft);border-top:1px solid var(--line);border-radius:0 0 var(--r-lg) var(--r-lg);font-size:var(--fs-14);color:var(--muted)}
@media (max-width:1180px){.mega--product{grid-template-columns:minmax(0,1fr)}.mega__aside{display:none}}

/* burger + mobile sheet */
.burger{display:none;width:44px;height:44px;margin-right:-10px;border:0;background:none;border-radius:var(--r);cursor:pointer;color:var(--ink);place-items:center}
.burger svg{width:22px;height:22px}
.mnav{position:fixed;inset:0;z-index:80;background:#fff;display:flex;flex-direction:column;overflow-y:auto;padding:0 var(--gutter) calc(24px + env(safe-area-inset-bottom));opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity var(--t) var(--ease),transform var(--t) var(--ease),visibility 0s linear var(--t)}
.mnav.is-open{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.mnav__top{display:flex;align-items:center;justify-content:space-between;height:var(--header-h);flex:none}
.mnav__close{width:44px;height:44px;margin-right:-10px;border:0;background:none;border-radius:var(--r);cursor:pointer;color:var(--ink);display:grid;place-items:center}
.mnav__close svg{width:22px;height:22px}
.mnav__group{padding:var(--s4) 0;border-top:1px solid var(--line)}
.mnav__group h2{font-size:var(--fs-13);font-weight:600;color:var(--muted);letter-spacing:0;margin-bottom:var(--s2)}
.mnav__group ul{list-style:none;display:grid}
.mnav__group a{display:flex;align-items:center;gap:12px;min-height:44px;color:var(--ink);font-weight:500;font-size:var(--fs-16)}
.mnav__group a[aria-current="page"]{color:var(--accent)}
.mnav__ico{flex:none;width:30px;height:30px;border-radius:var(--r);display:grid;place-items:center;background:var(--accent-soft);color:var(--accent)}
.mnav__ico svg{width:16px;height:16px}
.mnav__cta{display:grid;gap:var(--s3);margin-top:auto;padding-top:var(--s6)}
.mnav__cta .btn{width:100%}
body.is-locked{overflow:hidden}

@media (max-width:1023px){
  .nav,.hdr__end .hdr__login,.hdr__end .hdr__demo{display:none}
  .burger{display:grid}
  .hdr__end{gap:var(--s2)}
}
@media (min-width:1024px) and (max-width:1120px){.hdr__end .hdr__demo{display:none}}
@media (max-width:359px){.hdr__end .btn{display:none}}

/* footer */
.ftr{background:var(--bg-soft);border-top:1px solid var(--line);padding:var(--s20) 0 var(--s10);font-size:var(--fs-14)}
.ftr__band{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--s12);align-items:start;padding-bottom:var(--s12);border-bottom:1px solid var(--line)}
.ftr__pitch{margin-top:var(--s5);max-width:52ch;font-size:var(--fs-18);line-height:1.55;color:var(--text)}
.ftr__cta{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.ftr__contact{display:grid;gap:var(--s4);margin:0;padding:var(--s6);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1)}
.ftr__contact div{display:grid;grid-template-columns:minmax(0,9.5em) minmax(0,1fr);gap:var(--s3);align-items:baseline}
.ftr__contact dt{display:inline-flex;align-items:center;gap:8px;color:var(--muted)}
.ftr__contact dt svg{width:16px;height:16px;color:var(--accent);flex:none;align-self:center}
.ftr__contact dd{margin:0;color:var(--text);min-width:0;overflow-wrap:anywhere}
.ftr__cols{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--s10) var(--s8);padding:var(--s12) 0}
.ftr__col h2{font-size:var(--fs-14);font-weight:600;letter-spacing:-.005em;color:var(--ink);margin-bottom:var(--s4)}
.ftr__col ul{list-style:none;display:grid;gap:var(--s3)}
.ftr__col a{color:var(--muted);line-height:1.4}
.ftr__col a:hover{color:var(--accent)}
.ftr__legal{display:grid;grid-template-columns:minmax(0,max-content) minmax(0,1fr);gap:6px var(--s8);padding:var(--s6) 0;border-top:1px solid var(--line);color:var(--muted);font-size:var(--fs-13);line-height:1.5}
.ftr__legal>span:first-child{color:var(--ink);font-weight:500}
@media (max-width:720px){.ftr__legal{grid-template-columns:1fr}.ftr__facts{flex-direction:column;align-items:flex-start}.ftr__facts li+li::before{display:none}}
.ftr__bottom{display:flex;flex-direction:column;gap:var(--s4);padding-top:var(--s6);border-top:1px solid var(--line);color:var(--muted);font-size:var(--fs-13)}
.ftr__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s3) var(--s8)}
.ftr__sep{margin:0 6px;opacity:.6}
.ftr__facts{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:0;list-style:none;font-size:var(--fs-12,12px);opacity:.9}
.ftr__facts li{display:inline-flex;align-items:center;gap:6px}
.ftr__facts li+li::before{content:"";width:3px;height:3px;border-radius:50%;background:currentColor;opacity:.5;margin-right:12px}
.ftr__facts svg{width:14px;height:14px;flex:none}
.ftr__bottom p{margin:0}
.ftr__parent a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.ftr__parent a:hover{color:var(--ink)}
.ftr__links{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2) var(--s5)}
.ftr__links a{color:var(--muted)}
.ftr__links a:hover{color:var(--ink)}
/* social icon links (footer + İletişim); rendered only for the URLs set in SITE.social */
.social{list-style:none;display:flex;flex-wrap:wrap;gap:var(--s2)}
.social a{display:grid;place-items:center;width:40px;height:40px;border-radius:var(--r-pill);border:1px solid var(--line-strong);background:#fff;color:var(--ink);transition:color var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.social a:hover{color:var(--accent-strong);border-color:var(--accent-line);background:var(--accent-soft);text-decoration:none}
.social a:focus-visible{outline:none;box-shadow:var(--sh-focus)}
.social svg{width:20px;height:20px}
.ftr__social{margin-top:var(--s6)}
@media (max-width:1100px){.ftr__cols{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.ftr__band{grid-template-columns:1fr;gap:var(--s8)}}
@media (max-width:720px){
  .ftr{padding:var(--s16) 0 var(--s8)}
  .ftr__cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s8) var(--s6);padding:var(--s10) 0}
  .ftr__pitch{font-size:var(--fs-16)}
  .ftr__cta .btn{flex:1 1 100%}
  .ftr__contact{padding:var(--s5)}
  .ftr__contact div{grid-template-columns:1fr;gap:2px}
  .ftr__row{flex-direction:column;align-items:flex-start}
}
