:root{
  --gocce-cm-x:32px;
  --gocce-cm-y:32px;
  --gocce-cm-bg:#080808;
  --gocce-cm-bg2:#121212;
  --gocce-cm-ink:#ffffff;
  --gocce-cm-muted:#9d9d9d;
  --gocce-cm-accent:#d4b07a;
  --gocce-cm-ease:cubic-bezier(.65,0,.35,1);
  --gocce-admin:0px;
}
body.admin-bar{--gocce-admin:32px}
@media(max-width:782px){body.admin-bar{--gocce-admin:46px}}

#gocce-circle-menu,
#gocce-circle-menu *,
#gocce-circle-menu-btn,
#gocce-circle-menu-btn *{
  box-sizing:border-box;
}

/* Buton */
.gocce-circle-menu-btn{
  width:58px;
  height:58px;
  min-width:58px;
  padding:0;
  margin:0;
  border:1px solid #d9d9d9;
  border-radius:18px;
  background:#fff;
  color:#050505;
  display:grid!important;
  place-items:center;
  position:relative;
  z-index:2147483646;
  cursor:pointer;
  box-shadow:0 10px 28px rgba(0,0,0,.10);
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  transition:transform .2s ease,box-shadow .2s ease,background .25s ease;
}
.gocce-circle-menu-btn:hover{
  transform:scale(1.06);
  box-shadow:0 14px 34px rgba(0,0,0,.16);
}
.gocce-circle-menu-btn:active{transform:scale(.94)}
.gocce-circle-menu-btn:focus-visible{
  outline:2px solid var(--gocce-cm-accent);
  outline-offset:3px;
}

.gocce-circle-menu-btn > span{
  position:relative;
  width:25px;
  height:18px;
  display:block;
}
.gocce-circle-menu-btn i{
  position:absolute;
  left:0;
  width:25px;
  height:2.5px;
  border-radius:99px;
  background:#080808;
  transition:
    translate .30s ease,
    rotate .30s .05s ease,
    opacity .20s ease,
    background .25s ease;
}
.gocce-circle-menu-btn i:nth-child(1){top:0}
.gocce-circle-menu-btn i:nth-child(2){top:8px}
.gocce-circle-menu-btn i:nth-child(3){top:16px}

.gocce-circle-menu-btn[aria-expanded="true"]{
  background:#171717;
  border-color:#2c2c2c;
  color:#fff;
}
.gocce-circle-menu-btn[aria-expanded="true"] i{
  background:#fff;
}
.gocce-circle-menu-btn[aria-expanded="true"] i:nth-child(1){
  translate:0 8px;
  rotate:45deg;
}
.gocce-circle-menu-btn[aria-expanded="true"] i:nth-child(2){
  opacity:0;
  translate:-7px 0;
}
.gocce-circle-menu-btn[aria-expanded="true"] i:nth-child(3){
  translate:0 -8px;
  rotate:-45deg;
}

/* Tam ekran menü */
.gocce-circle-menu{
  position:fixed;
  inset:0;
  z-index:2147483645;
  background:
    radial-gradient(115% 115% at 0% 0%,#1b1b1b 0%,#0e0e0e 42%,#070707 100%);
  color:#fff;
  overflow:auto;

  clip-path:circle(0px at var(--gocce-cm-x) var(--gocce-cm-y));
  visibility:hidden;
  pointer-events:none;

  transition:
    clip-path .70s var(--gocce-cm-ease),
    visibility 0s .70s;
}

html.gocce-circle-open .gocce-circle-menu{
  clip-path:circle(170vmax at var(--gocce-cm-x) var(--gocce-cm-y));
  visibility:visible;
  pointer-events:auto;
  transition:
    clip-path .70s var(--gocce-cm-ease),
    visibility 0s 0s;
}

html.gocce-circle-open,
body.gocce-circle-open{
  overflow:hidden!important;
}

.gocce-circle-menu__inner{
  width:min(1180px,calc(100% - 72px));
  min-height:100%;
  margin:0 auto;
  padding:calc(var(--gocce-admin) + 70px) 0 54px;
  display:grid;
  grid-template-columns:220px minmax(0,1fr);
  grid-template-rows:auto 1fr auto;
  column-gap:70px;
}

.gocce-circle-menu__brand{
  grid-column:1;
  grid-row:1;
  align-self:start;
  padding-top:10px;
}
.gocce-circle-menu__brand strong{
  display:block;
  color:#fff;
  font:800 29px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.16em;
}
.gocce-circle-menu__brand span{
  display:block;
  margin-top:8px;
  color:var(--gocce-cm-muted);
  font:750 10px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.18em;
}

.gocce-circle-menu__links{
  grid-column:2;
  grid-row:1 / span 2;
  align-self:center;
  width:100%;
}
.gocce-circle-menu__links a{
  display:grid;
  grid-template-columns:58px minmax(0,1fr);
  align-items:baseline;
  gap:18px;
  padding:13px 0 16px;

  color:#fff!important;
  text-decoration:none!important;
  border-bottom:1px solid #242424;
  opacity:0;
  translate:0 26px;

  transition:
    opacity .30s ease,
    translate .46s cubic-bezier(.2,.7,.2,1),
    color .2s ease,
    border-color .2s ease;
}
html.gocce-circle-open .gocce-circle-menu__links a{
  opacity:1;
  translate:0 0;
  transition-delay:calc(.18s + (var(--i) * .065s));
}
.gocce-circle-menu__links a small{
  color:var(--gocce-cm-accent);
  font:800 11px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.13em;
  font-variant-numeric:tabular-nums;
}
.gocce-circle-menu__links a span{
  font:800 clamp(38px,4.7vw,74px)/.95 Arial,Helvetica,sans-serif;
  letter-spacing:-.055em;
}
.gocce-circle-menu__links a:hover,
.gocce-circle-menu__links a:focus-visible{
  color:var(--gocce-cm-accent)!important;
  border-color:#514229;
}
.gocce-circle-menu__links a:focus-visible{
  outline:2px solid var(--gocce-cm-accent);
  outline-offset:5px;
  border-radius:6px;
}

.gocce-circle-menu__meta{
  grid-column:1;
  grid-row:3;
  align-self:end;
  color:#a9a9a9;
  opacity:0;
  translate:0 20px;
  transition:
    opacity .30s ease,
    translate .42s cubic-bezier(.2,.7,.2,1);
}
html.gocce-circle-open .gocce-circle-menu__meta{
  opacity:1;
  translate:0 0;
  transition-delay:.62s;
}
.gocce-circle-menu__meta > span{
  display:block;
  max-width:210px;
  font:500 12px/1.6 Arial,Helvetica,sans-serif;
}
.gocce-circle-menu__meta > div{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  margin-top:20px;
}
.gocce-circle-menu__meta a{
  color:#fff!important;
  text-decoration:none!important;
  font:800 10px/1 Arial,Helvetica,sans-serif;
  letter-spacing:.08em;
  border-bottom:1px solid #505050;
  padding-bottom:4px;
}

@media(max-width:900px){
  .gocce-circle-menu__inner{
    width:min(100% - 38px,720px);
    padding:calc(var(--gocce-admin) + 90px) 0 32px;
    display:flex;
    flex-direction:column;
  }
  .gocce-circle-menu__brand{
    margin-bottom:34px;
    padding-top:0;
  }
  .gocce-circle-menu__links{
    align-self:stretch;
  }
  .gocce-circle-menu__links a{
    grid-template-columns:46px minmax(0,1fr);
    padding:12px 0 14px;
  }
  .gocce-circle-menu__links a span{
    font-size:clamp(31px,8.8vw,52px);
  }
  .gocce-circle-menu__meta{
    margin-top:30px;
  }
  .gocce-circle-menu__meta > span{
    max-width:100%;
  }
}

@media(max-width:520px){
  .gocce-circle-menu-btn{
    width:54px;
    height:54px;
    min-width:54px;
    border-radius:16px;
  }
  .gocce-circle-menu__inner{
    width:calc(100% - 32px);
  }
  .gocce-circle-menu__links a{
    grid-template-columns:38px minmax(0,1fr);
    gap:9px;
  }
  .gocce-circle-menu__links a span{
    font-size:clamp(28px,8.6vw,40px);
  }
  .gocce-circle-menu__brand strong{font-size:24px}
}

@media(prefers-reduced-motion:reduce){
  .gocce-circle-menu{
    clip-path:none;
    opacity:0;
    transition:opacity .15s ease,visibility 0s .15s;
  }
  html.gocce-circle-open .gocce-circle-menu{
    opacity:1;
    transition:opacity .15s ease,visibility 0s;
  }
  .gocce-circle-menu__links a,
  .gocce-circle-menu__meta{
    translate:0 0;
    transition:opacity .15s ease;
  }
}


/* v1.0.1 — butonu HER DURUMDA sol üstte sabitle */
#gocce-circle-menu-btn.gocce-circle-menu-btn{
  position:fixed!important;
  top:calc(var(--gocce-admin) + 18px)!important;
  left:18px!important;
  right:auto!important;
  bottom:auto!important;

  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;

  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  min-height:58px!important;
  max-height:58px!important;

  margin:0!important;
  padding:0!important;
  transform:none!important;
  z-index:2147483647!important;
}

#gocce-circle-menu-btn.gocce-circle-menu-btn:hover{
  transform:scale(1.06)!important;
}

#gocce-circle-menu-btn.gocce-circle-menu-btn:active{
  transform:scale(.94)!important;
}

@media(max-width:782px){
  #gocce-circle-menu-btn.gocce-circle-menu-btn{
    top:calc(var(--gocce-admin) + 12px)!important;
    left:12px!important;
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    max-width:54px!important;
    min-height:54px!important;
    max-height:54px!important;
  }
}


/* v1.0.2 — SOL ÜSTTE, SAYFAYLA BİRLİKTE KAYBOLUR (fixed DEĞİL) */
html body #gocce-circle-menu-btn.gocce-circle-menu-btn{
  position:absolute!important;
  top:18px!important;
  left:18px!important;
  right:auto!important;
  bottom:auto!important;

  width:58px!important;
  height:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  min-height:58px!important;
  max-height:58px!important;

  display:grid!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  z-index:2147483647!important;
}

/* Admin bar varsa buton onun altına gelsin; yine absolute kalır. */
body.admin-bar #gocce-circle-menu-btn.gocce-circle-menu-btn{
  top:50px!important;
}
@media(max-width:782px){
  html body #gocce-circle-menu-btn.gocce-circle-menu-btn{
    top:12px!important;
    left:12px!important;
    width:54px!important;
    height:54px!important;
    min-width:54px!important;
    max-width:54px!important;
    min-height:54px!important;
    max-height:54px!important;
  }
  body.admin-bar #gocce-circle-menu-btn.gocce-circle-menu-btn{
    top:58px!important;
  }
}


/* v1.0.3 - theme CSS'e karşı menü kabuğunu koru */
html body #gocce-circle-menu.gocce-circle-menu{
  display:block!important;
  position:fixed!important;
  inset:0!important;
  width:100vw!important;
  height:100vh!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  z-index:2147483646!important;
}
html.gocce-circle-open body #gocce-circle-menu.gocce-circle-menu{
  visibility:visible!important;
  pointer-events:auto!important;
  opacity:1!important;
}


/* =========================================================
   v1.0.4 — menü yazıları biraz daha sola + hover anında
   ========================================================= */

/* Masaüstünde link kolonunu merkezin biraz soluna taşı. */
@media(min-width:901px){
  .gocce-circle-menu__inner{
    width:min(1320px,calc(100% - 48px))!important;
    margin-left:24px!important;
    margin-right:auto!important;
    grid-template-columns:120px minmax(0,1fr)!important;
    column-gap:34px!important;
  }

  .gocce-circle-menu__links{
    padding-left:0!important;
    margin-left:0!important;
  }
}

/* Hover rengi beklemeden, mouse geldiği AN değişsin. */
.gocce-circle-menu__links a:hover,
.gocce-circle-menu__links a:focus-visible{
  transition-delay:0s!important;
  color:var(--gocce-cm-accent)!important;
  border-color:#514229!important;
}

/* Yazının kendisi de gecikmesiz renk değiştirsin. */
.gocce-circle-menu__links a span{
  transition:color .08s linear!important;
}

.gocce-circle-menu__links a:hover span,
.gocce-circle-menu__links a:focus-visible span{
  color:var(--gocce-cm-accent)!important;
  transition-delay:0s!important;
}


/* =========================================================
   v1.0.6 — GİRİŞ / KAYIT doğrudan HEDİYE KUTULARI altında
   Brand/GOCCE 1988 alanına bağlı değildir.
   ========================================================= */

.gocce-circle-menu__auth-row{
  width:100%;
  display:flex;
  align-items:center;
  gap:10px;
  padding-top:18px;
  margin-top:4px;
  opacity:0;
  translate:0 18px;
  transition:
    opacity .28s ease,
    translate .38s cubic-bezier(.2,.7,.2,1);
}

html.gocce-circle-open .gocce-circle-menu__auth-row{
  opacity:1;
  translate:0 0;
  transition-delay:.62s;
}

.gocce-circle-menu__auth-row button,
.gocce-circle-menu__auth-row a{
  min-height:44px;
  padding:0 18px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:8px!important;
  text-decoration:none!important;
  font:800 11px/1 Arial,Helvetica,sans-serif!important;
  letter-spacing:.08em!important;
  cursor:pointer!important;
  transition:
    background .10s ease,
    color .10s ease,
    border-color .10s ease,
    transform .10s ease!important;
}

.gocce-circle-menu__auth-login{
  border:1px solid rgba(255,255,255,.44)!important;
  background:transparent!important;
  color:#fff!important;
}

.gocce-circle-menu__auth-register,
.gocce-circle-menu__auth-account{
  border:1px solid #fff!important;
  background:#fff!important;
  color:#111!important;
}

.gocce-circle-menu__auth-row button:hover,
.gocce-circle-menu__auth-row a:hover{
  transform:translateY(-1px)!important;
}

.gocce-circle-menu__auth-login:hover{
  background:rgba(255,255,255,.10)!important;
  color:#fff!important;
}

.gocce-circle-menu__auth-register:hover,
.gocce-circle-menu__auth-account:hover{
  background:#e9e9e9!important;
  color:#111!important;
}

@media(max-width:900px){
  .gocce-circle-menu__auth-row{
    padding-top:14px;
    gap:8px;
  }

  .gocce-circle-menu__auth-row button,
  .gocce-circle-menu__auth-row a{
    flex:1 1 0;
    min-width:0;
    min-height:42px;
    padding:0 10px!important;
  }
}

@media(max-width:520px){
  .gocce-circle-menu__auth-row{
    margin-top:2px;
  }

  .gocce-circle-menu__auth-row button,
  .gocce-circle-menu__auth-row a{
    min-height:40px;
    font-size:10px!important;
  }
}