/* BEF UI hover system for the elements added on top of the Framer template. Template buttons tilt and grow on
   hover with a spring; these follow the same rule so every button behaves alike. */
:root{--bef-spring:cubic-bezier(.34,1.56,.64,1)}
.bef-bl__cta a,.bef-bl__tag,.bef-code a,.bef-lang a,.bef-process__btn,.bef-faq__btn,.bef-cc button{
  transition:transform .5s var(--bef-spring),background-color .25s ease,color .25s ease,opacity .25s ease!important}
.bef-bl__cta a:hover,.bef-bl__tag:hover,.bef-code a:hover,.bef-lang a:hover,.bef-process__btn:hover,.bef-faq__btn:hover,
.bef-cc button:hover{transform:rotate(3deg) scale(1.04)!important}
.bef-bl__cta a:active,.bef-bl__tag:active,.bef-code a:active,.bef-lang a:active,.bef-process__btn:active,.bef-faq__btn:active,
.bef-cc button:active{transform:scale(.97)!important}
/* text links with an arrow: the arrow moves */
.bef-bl__more>h2 a{display:inline-block;transition:transform .5s var(--bef-spring)}
.bef-bl__more>h2 a:hover{transform:translateX(4px)}
.bef-bl__card b:after{display:inline-block;transition:transform .5s var(--bef-spring)}
.bef-bl__card:hover b:after{transform:translateX(4px)}
/* cards: lift and tilt, like the process cards */
.bef-bl__card:hover{transform:translateY(-6px) rotate(-1deg)!important}
.bef-bl__body a{transition:color .2s ease}.bef-bl__body a:hover{color:#ff641f}
/* Desktop header: the four menu links sit in the exact centre; BEF Code and the TR/EN switch sit on the right, next to
   the "Randevu Al" button (119 px, 8 px from the bar's edge), 12 px apart. */
@media (min-width:1200px){
  .framer-1ra53ci>.framer-1ptyjgh{position:static}
  .framer-1ra53ci>.framer-1ptyjgh>.bef-lang,.framer-1ra53ci>.framer-1ptyjgh>.bef-code{position:absolute;top:50%;
    transform:translateY(-50%);margin:0}
  .framer-1ra53ci>.framer-1ptyjgh>.bef-lang{right:139px}
  .framer-1ra53ci>.framer-1ptyjgh>.bef-code{right:232px}
}
/* Services mega menu (bef-ui.js), desktop only */
.bef-dd{position:fixed;left:50%;top:0;z-index:60;width:min(940px,calc(100vw - 48px));opacity:0;visibility:hidden;
  pointer-events:none;transform:translate(-50%,-10px) scale(.98);transform-origin:50% 0;
  transition:opacity .2s ease,transform .5s var(--bef-spring),visibility 0s linear .2s;
  font-family:"Open Sauce One","Open Sauce One Placeholder",sans-serif;color:#fff}
.bef-dd.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0) scale(1);
  transition:opacity .2s ease,transform .5s var(--bef-spring),visibility 0s}
.bef-dd:before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.bef-dd__in{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:8px;padding:8px;border-radius:28px;
  background:#1c1917;box-shadow:0 40px 90px -30px rgba(28,25,23,.6),0 0 0 1px rgba(255,255,255,.06) inset}
.bef-dd__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px;padding:8px;align-content:start}
.bef-dd__item{display:flex;gap:14px;align-items:flex-start;padding:14px;border-radius:18px;color:#fff;text-decoration:none;
  opacity:0;transform:translateY(6px);transition:background-color .2s ease,opacity .3s ease,transform .5s var(--bef-spring)}
.bef-dd.is-open .bef-dd__item{opacity:1;transform:none}
.bef-dd.is-open .bef-dd__item:nth-child(2){transition-delay:0s,.03s,.03s}
.bef-dd.is-open .bef-dd__item:nth-child(3){transition-delay:0s,.06s,.06s}
.bef-dd.is-open .bef-dd__item:nth-child(4){transition-delay:0s,.09s,.09s}
.bef-dd.is-open .bef-dd__item:nth-child(5){transition-delay:0s,.12s,.12s}
.bef-dd.is-open .bef-dd__item:nth-child(6){transition-delay:0s,.15s,.15s}
.bef-dd__item.is-active,.bef-dd__item:focus-visible{background:rgba(255,255,255,.07);outline:none}
.bef-dd__ico{flex:none;width:42px;height:42px;border-radius:13px;background:rgba(255,100,31,.14);display:flex;align-items:center;
  justify-content:center;transition:background-color .25s ease,transform .5s var(--bef-spring)}
.bef-dd__ico svg{width:20px;height:20px;fill:none;stroke:#ff641f;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;
  transition:stroke .25s ease}
.bef-dd__item.is-active .bef-dd__ico{background:#ff641f;transform:rotate(-6deg) scale(1.06)}
.bef-dd__item.is-active .bef-dd__ico svg{stroke:#1c1917}
.bef-dd__t{display:block;font-weight:600;font-size:15px;line-height:1.3;letter-spacing:-.01em}
.bef-dd__d{display:block;margin-top:4px;font-size:13px;line-height:1.45;color:rgba(255,255,255,.6)}
.bef-dd__feat{position:relative;border-radius:22px;overflow:hidden;background:#292524;min-height:0}
.bef-dd__img{position:absolute;inset:0}
.bef-dd__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.06);
  transition:opacity .35s ease,transform .8s var(--bef-spring)}
.bef-dd__img img.is-on{opacity:1;transform:scale(1)}
.bef-dd__feat:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,25,23,0) 30%,rgba(28,25,23,.92) 100%)}
.bef-dd__body{position:absolute;left:0;right:0;bottom:0;z-index:1;display:flex;flex-direction:column;gap:6px;padding:18px}
.bef-dd__kick{font-weight:600;font-size:11px;line-height:1.2;letter-spacing:.08em;text-transform:uppercase;color:#ff641f}
.bef-dd__num{font-weight:700;font-size:40px;line-height:1;letter-spacing:-.04em}
.bef-dd__lbl{font-size:13px;line-height:1.4;color:rgba(255,255,255,.75)}
.bef-dd__foot{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 8px;
  padding:12px 0 6px;border-top:1px solid rgba(255,255,255,.08)}
.bef-dd__note{font-size:13px;line-height:1.4;color:rgba(255,255,255,.6)}
.bef-dd__cta{display:flex;gap:8px;flex:none}
.bef-dd__btn{display:inline-flex;align-items:center;height:40px;padding:0 18px;border-radius:999px;font-weight:600;font-size:14px;
  line-height:1;text-decoration:none;white-space:nowrap;transition:transform .5s var(--bef-spring),background-color .2s ease}
.bef-dd__btn--p{background:#ff641f;color:#1c1917}
.bef-dd__btn--g{background:rgba(255,255,255,.08);color:#fff}
.bef-dd__btn:hover{transform:rotate(3deg) scale(1.04)}
.bef-dd__btn--g:hover{background:rgba(255,255,255,.14)}
@media (max-width:1199.98px){.bef-dd{display:none}}

/* Home pain point "Reklama ayrı ajans, web'e ayrı ajans": wide enough for two lines in TR and EN (the other cards are
   284-384px). On phones the card sits flush right, so it grows to the left there. */
.framer-q7lnlh-container{width:284px!important}
@media (max-width:809.98px){.framer-q7lnlh-container{left:auto!important;right:0!important}}

/* Section eyebrow chips: the Framer tag component (.framer-NgB49) and the BEF copies (FAQ, blog) share one design,
   a light pill with a hairline border and an orange dot before a dark uppercase label. Works on the grey and the
   white sections alike. */
.framer-NgB49.framer-1gilzre,.bef-faq__tag,.bef-bl__tag{display:inline-flex!important;align-items:center!important;
  gap:8px!important;height:30px!important;box-sizing:border-box!important;padding:0 13px 0 11px!important;
  border-radius:999px!important;background:rgba(255,255,255,.72)!important;box-shadow:inset 0 0 0 1px rgba(28,25,23,.1)!important;
  color:#1c1917!important;font:600 12px/1 "Open Sauce One","Open Sauce One Placeholder",sans-serif!important;
  letter-spacing:.08em!important;text-transform:uppercase!important}
.framer-NgB49.framer-1gilzre:before,.bef-faq__tag:before,.bef-bl__tag:before{content:"";flex:none;width:6px;height:6px;
  border-radius:50%;background:#ff641f;box-shadow:0 0 0 3px rgba(255,100,31,.18)}
.framer-NgB49.framer-1gilzre .framer-text{--framer-text-color:#1c1917!important;color:#1c1917!important;line-height:1!important}