/*
Theme Name: BBR Studio
Theme URI: https://www.bbrmedia.com.tr/
Author: BBR Media
Description: BBR Media dijital ajans teması. Koyu mor sinematik tasarım, açılış animasyonu, sayaçlar, WhatsApp randevu asistanı ve iletişim formu içerir.
Version: 3.1.0
Requires at least: 5.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: bbrstudio
*/

body{margin:0;background:#12021C;font-family:'DM Sans',system-ui,sans-serif;color:#F3E8FA}
a{color:inherit;text-decoration:none;transition:opacity .2s ease}
a:hover{opacity:.85}
input,textarea{font-family:'DM Sans',system-ui,sans-serif}
html{scroll-behavior:smooth}
@keyframes phscroll{0%,12%{transform:translateY(0)}88%,100%{transform:translateY(-250px)}}
.phscroll{animation:phscroll 20s ease-in-out infinite alternate}
@keyframes blink{0%,80%,100%{opacity:.25}40%{opacity:1}}
.dot{display:inline-block;width:7px;height:7px;border-radius:99px;background:#D9B8EA;animation:blink 1.2s infinite}
.dot2{animation-delay:.2s}
.dot3{animation-delay:.4s}
.msgin{animation:fadeUp .35s ease backwards}
.chip{transition:background .2s ease,transform .2s ease}
.chip:hover{background:rgba(227,166,255,.22);transform:translateY(-2px)}
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
@keyframes floaty2{0%,100%{transform:translateY(0)}50%{transform:translateY(12px)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(217,166,242,.65)}70%{box-shadow:0 0 0 10px rgba(217,166,242,0)}100%{box-shadow:0 0 0 0 rgba(217,166,242,0)}}
@keyframes marq{to{transform:translateX(-50%)}}
@keyframes rvIn{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:none}}
@keyframes drift{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(1.12)}}
@keyframes drift2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-50px,30px) scale(1.08)}}
@keyframes shine{0%{left:-60%}60%,100%{left:140%}}
@keyframes draw{from{stroke-dashoffset:400}to{stroke-dashoffset:0}}
@keyframes tilt{0%,100%{transform:perspective(1400px) rotateY(-14deg) rotateX(6deg) rotateZ(1deg) translateY(0)}50%{transform:perspective(1400px) rotateY(-10deg) rotateX(4deg) rotateZ(1deg) translateY(-12px)}}
.fu{animation:fadeUp 1s cubic-bezier(.2,.7,.2,1) backwards}
.d1{animation-delay:.12s}
.d2{animation-delay:.26s}
.d3{animation-delay:.4s}
.d4{animation-delay:.55s}
.bars>div{transform-origin:bottom;animation:grow 1.1s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:.9s}
.bars>div:nth-child(2){animation-delay:1s}
.bars>div:nth-child(3){animation-delay:1.1s}
.bars>div:nth-child(4){animation-delay:1.2s}
.bars>div:nth-child(5){animation-delay:1.3s}
.bars>div:nth-child(6){animation-delay:1.4s}
.floaty{animation:floaty 6s ease-in-out infinite}
.floaty2{animation:floaty2 7s ease-in-out infinite}
.phone3d{animation:tilt 9s ease-in-out infinite}
.pulse{animation:pulse 2s ease-out infinite}
.marq{animation:marq 36s linear infinite}
.blob1{animation:drift 16s ease-in-out infinite}
.blob2{animation:drift2 20s ease-in-out infinite}
.line{stroke-dasharray:400;animation:draw 2.4s ease-out .8s backwards}
.glass{background:linear-gradient(145deg,rgba(255,255,255,.10),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
.gtext{background:linear-gradient(95deg,#FFFFFF 0%,#F0D4FF 45%,#C47DF0 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.pbtn{position:relative;overflow:hidden}
.pbtn::after{content:'';position:absolute;top:0;left:-60%;width:36%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.4),transparent);transform:skewX(-20deg);animation:shine 3.6s ease-in-out infinite}
.lift{transition:transform .4s cubic-bezier(.2,.7,.2,1),box-shadow .4s ease,border-color .4s ease}
.lift:hover{transform:translateY(-10px);box-shadow:0 30px 70px rgba(130,30,190,.28)}
@supports (animation-timeline:view()){.rv{animation:rvIn linear backwards;animation-timeline:view();animation-range:entry 0% entry 45%}}

@keyframes ldOut{0%,86%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@keyframes ldTop{0%,80%{transform:translateY(0)}100%{transform:translateY(-101%)}}
@keyframes ldBot{0%,80%{transform:translateY(0)}100%{transform:translateY(101%)}}
@keyframes ldLet{0%{opacity:0;transform:translateY(60%) scale(.9);filter:blur(14px)}100%{opacity:1;transform:none;filter:blur(0)}}
@keyframes ldGlow{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:.9;transform:scale(1)}}
@keyframes ldSweep{0%{left:-40%}100%{left:130%}}
@keyframes ldSub{0%{opacity:0;transform:translateY(14px)}100%{opacity:1;transform:none}}
@keyframes ldLine{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
@keyframes ldWrapOut{0%,76%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.12)}}
.ld{position:fixed;left:0;top:0;width:100%;height:100%;z-index:200;pointer-events:none;animation:ldOut 3.9s linear forwards}
.ld .p{position:absolute;left:0;width:100%;height:50.2%;background:#050008}
.ld .p1{top:0;animation:ldTop 3.9s cubic-bezier(.76,0,.2,1) forwards}
.ld .p2{bottom:0;animation:ldBot 3.9s cubic-bezier(.76,0,.2,1) forwards}
.ldwrap{animation:ldWrapOut 3.9s ease forwards}
.ldglow{animation:ldGlow 2.4s ease-out .1s both}
.ldl{display:inline-block;opacity:0;animation:ldLet .9s cubic-bezier(.2,.8,.2,1) forwards}
@keyframes ldPulse{0%,100%{text-shadow:0 0 0 rgba(226,150,255,0)}50%{text-shadow:0 0 46px rgba(226,150,255,.85)}}
.ldlet{animation:ldPulse 1.4s ease-in-out 1.4s both}
.ldsub{opacity:0;animation:ldSub .9s ease 1.7s forwards}
.ldline{transform-origin:center;transform:scaleX(0);animation:ldLine 1.1s cubic-bezier(.6,0,.2,1) 1.2s forwards}
html{scroll-behavior:smooth}
.totop{position:fixed;left:24px;bottom:100px;z-index:50;width:48px;height:48px;border-radius:99px;display:flex;align-items:center;justify-content:center;background:rgba(30,6,46,.82);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border:1px solid rgba(227,166,255,.35);box-shadow:0 12px 34px rgba(0,0,0,.35);transition:transform .3s,background .3s}
.totop:hover{transform:translateY(-4px);background:#6A0D8C}
@keyframes ttShow{from{opacity:0;transform:translateY(16px);visibility:hidden}to{opacity:1;transform:none;visibility:visible}}
@supports (animation-timeline:scroll()){.totop{animation:ttShow linear both;animation-timeline:scroll(root);animation-range:300px 700px}}
[id]{scroll-margin-top:90px}
.tl{transition:color .25s,transform .25s}.tl:hover{color:#E3A6FF;transform:translateX(3px)}
@media (prefers-reduced-motion:reduce){.ld{display:none!important}}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.admin-bar #topbar{top:32px!important}
@media (max-width:782px){.admin-bar #topbar{top:46px!important}}
html{scroll-behavior:smooth}
body{margin:0}

@keyframes sprog{to{transform:scaleX(1)}}
.sprog{position:fixed;left:0;top:0;height:3px;width:100%;transform-origin:left;transform:scaleX(0);background:linear-gradient(90deg,#A23AD8,#E3A6FF);z-index:210;pointer-events:none}
@supports (animation-timeline:scroll()){.sprog{animation:sprog linear both;animation-timeline:scroll(root)}}
@supports not (animation-timeline:view()){.js .rv{opacity:0;transform:translateY(44px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.js .rv.in{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1!important;transform:none!important}.sprog{display:none}}

@media (max-width:640px){
body.home h1{font-size:clamp(38px,11.2vw,56px)!important;letter-spacing:-1px!important;overflow-wrap:anywhere}
body.home h2{font-size:clamp(30px,8.6vw,44px)!important;letter-spacing:-.8px!important;overflow-wrap:anywhere}
[style*="font-size:29px"]{font-size:20px!important;line-height:1.5!important}
[style*="padding:48px"]{padding:26px!important}
.gtext{overflow-wrap:anywhere}
}
@media (max-width:640px){[style*="right:96px"]{right:16px!important;bottom:96px!important;max-width:calc(100vw - 32px)!important}}
h1,h2,h3,p,li,a,span{overflow-wrap:anywhere}
[style*="font-size:68px"]{font-size:clamp(40px,11vw,68px)!important}
@media (max-width:640px){[style*="font-size:42px"]{font-size:clamp(26px,7.6vw,36px)!important}[style*="padding:32px"]{padding:22px!important}}
@media (max-width:400px){[style*="font-size:29px"]{font-size:18px!important}body.home h2{font-size:clamp(26px,8vw,34px)!important}}

/* ===== v3: ortak bileşenler, başlık/menü, mobil ve erişilebilirlik ===== */
.mgbtn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 22px;border-radius:999px;border:1px solid rgba(227,166,255,.45);background:rgba(227,166,255,.08);color:#F0D4FF;font-weight:600;font-size:15px;white-space:nowrap;box-sizing:border-box;transition:background .2s,border-color .2s}
.mgbtn:hover{background:rgba(227,166,255,.18);border-color:#E3A6FF;opacity:1}
.skip{position:absolute;left:12px;top:-60px;z-index:300;padding:12px 18px;border-radius:12px;background:#fff;color:#22052F;font-weight:700}
.skip:focus{top:12px}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid #E3A6FF;outline-offset:3px}

/* Başlık */
.hd{position:fixed;left:0;top:0;width:100%;z-index:55;background:rgba(14,1,22,.72);-webkit-backdrop-filter:blur(18px) saturate(1.3);backdrop-filter:blur(18px) saturate(1.3);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 10px 40px rgba(0,0,0,.25)}
.hd-in{max-width:1240px;margin:0 auto;padding:14px 32px;display:flex;align-items:center;justify-content:space-between;gap:16px;box-sizing:border-box}
.hd-logo{font-family:Quicksand,sans-serif;font-weight:700;font-size:26px;letter-spacing:-.01em;color:#fff;white-space:nowrap;display:flex;align-items:center;min-height:44px}
.hd-nav{display:flex;gap:6px;padding:6px;border-radius:999px;font-size:15px;font-weight:500}
.hd-nav a{padding:10px 18px;border-radius:999px;white-space:nowrap}
.hd-nav a:hover{background:rgba(255,255,255,.1);opacity:1}
.hd-acts{display:flex;align-items:center;gap:10px}
.hd-cta{display:inline-flex;align-items:center;min-height:46px;padding:0 26px;border-radius:999px;background:linear-gradient(135deg,#A23AD8,#6A0D8C);box-shadow:0 10px 36px rgba(155,47,209,.5),inset 0 1px 0 rgba(255,255,255,.3);color:#fff;font-weight:600;font-size:15px;white-space:nowrap}
.hd-burger{display:none;width:46px;height:46px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.06);cursor:pointer;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.hd-burger span{display:block;width:20px;height:2px;border-radius:2px;background:#fff;transition:transform .25s,opacity .2s}
.hd-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.hd-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.hd-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.hd-menu{border-top:1px solid rgba(255,255,255,.08);background:rgba(14,1,22,.97);max-height:calc(100dvh - 72px);overflow-y:auto;padding:8px 20px calc(24px + env(safe-area-inset-bottom))}
.hd-menu[hidden]{display:none}
.hd-menu nav{display:flex;flex-direction:column}
.hd-menu nav a{display:flex;align-items:center;min-height:56px;font-size:18px;font-weight:500;color:#F3E8FA;border-bottom:1px solid rgba(255,255,255,.08)}
.hd-menu-cta{display:flex;flex-direction:column;gap:12px;margin-top:20px}
.hd-cta-m{display:flex;align-items:center;justify-content:center;min-height:54px;border-radius:999px;background:linear-gradient(135deg,#A23AD8,#6A0D8C);color:#fff;font-weight:600;font-size:16px;box-shadow:0 10px 30px rgba(155,47,209,.45)}
.mgbtn-m{justify-content:center;min-height:54px;font-size:16px}
body.menu-open{overflow:hidden}
.admin-bar .hd{top:32px}
@media (max-width:782px){.admin-bar .hd{top:46px}}
@media (max-width:1100px){.hd-nav a{padding:10px 13px}.hd-in{padding:12px 20px}}
@media (max-width:900px){
  .hd-nav,.hd-cta{display:none}
  .hd-burger{display:flex}
  .hd-in{padding:10px 16px;padding-top:max(10px,env(safe-area-inset-top))}
  .hd-logo{font-size:24px}
  .hd-acts .mgbtn{min-height:44px;padding:0 16px;font-size:14px}
  .tbsp{height:68px!important}
}
@media (max-width:380px){.hd-acts .mgbtn span{display:none}.hd-acts .mgbtn{padding:0 13px}}

/* Form hata metinleri (ana sayfa) */
.cf-err{margin:0;font-size:13.5px;color:#FFB4C8}
.cf-err:empty{display:none}
.cf input[aria-invalid="true"],.cf textarea[aria-invalid="true"]{border-color:#FF7BA3!important}
#cf-status.ok{color:#8CEBB0}#cf-status.err{color:#FFB4C8}
#cf-status a{color:#E3A6FF;text-decoration:underline}

/* Mobil iyileştirmeler */
@media (max-width:640px){
  .totop{left:16px;bottom:88px;width:44px;height:44px}
  a[aria-label*="WhatsApp"][style*="fixed"]{width:54px!important;height:54px!important;left:16px!important;bottom:20px!important}
}
img{max-width:100%}
