/* Klow Medya QR — sade tema: mor, mavi, beyaz */
body.landing, .on-light {
  --bg:#ffffff; --paper:#ffffff; --sand:#f6f6ff; --sand-2:#eef0ff; --sand-3:#dfe2fb; --plum:#14123a; --plum-2:#1f1b5c;
  --ink:#14123a; --ink-2:#4d4b7a; --ink-3:#8583ad; --line:#e4e5f6; --c1:#3b5bdb; --c2:#6d3fe0;
  background:var(--bg); color:var(--ink);
}
.landing .site-header { background: rgba(255,255,255,.92); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.landing .brand { color: var(--ink); }
.landing .nav a.link { color: var(--ink-2); } .landing .nav a.link:hover { color: var(--c2); }
@media (max-width: 960px) { .landing .nav { background: #fff; } }
.landing .btn-primary { background: linear-gradient(120deg, #3b5bdb, #6d3fe0); color:#fff; box-shadow: 0 10px 26px -12px rgba(80,70,220,.6); }
.landing .btn-ghost, .on-light .btn-ghost { border-color: #cfd2f3; color: var(--ink); }
.landing .btn-ghost:hover, .on-light .btn-ghost:hover { background: var(--sand-2); border-color: var(--c2); }
.landing .grad-text, .on-light .grad-text { background: linear-gradient(120deg, #3b5bdb, #7a4fe0); -webkit-background-clip:text; background-clip:text; color:transparent; }
.landing .eyebrow, .on-light .eyebrow { color: var(--c2); }
.landing .hero { background: radial-gradient(800px 500px at 90% 20%, rgba(122,84,245,.14), transparent 62%), radial-gradient(700px 480px at 0% 100%, rgba(59,91,219,.10), transparent 60%), #fff; }
.landing .hero .lead, .landing .lead { color: var(--ink-2); }
.on-dark, .landing .themes, .landing .claim-sec, .landing .sectors, .landing .tablet, .landing .why { --ink:#f3f0fd; --ink-2:#c3bfe6; --ink-3:#9a96c6; --line:rgba(255,255,255,.14); --c2:#a99bff; color:#e9e6fb; }
.landing .themes.on-dark { background: linear-gradient(160deg, #14123a, #26207a); }
.on-dark h1, .on-dark h2, .on-dark h3, .landing .claim-sec h2, .landing .sectors h2, .landing .sectors h3, .landing .tablet h2, .landing .tablet h3, .landing .why h2, .landing .why h3 { color:#fff; }
.landing .sectors .eyebrow, .landing .tablet .eyebrow { color:#c9bfff; }
.on-dark .eyebrow, .landing .claim-sec .eyebrow { color:#b9aee0; }
.on-dark .lead, .on-dark .muted { color:#c3bfe6; }
.landing .claim-sec { background: linear-gradient(120deg, #3b28a8, #2a4fd0); }
.landing .site-footer, .landing footer { background:#14123a; color:#c3bfe6; }
.landing .site-footer h4, .landing .site-footer .brand { color:#fff; }
.landing .site-footer .brand img, .landing .claim-sec .brand img { filter: brightness(0) invert(1); }

/* açık bölümler */
.landing .panelsec { background: var(--sand); }
.landing .pricing { background: #fff; }
.landing .toggle { background: var(--sand-2); border-color: var(--line); } .landing .toggle button { color: var(--ink-2); } .landing .toggle button.on { background: #fff; color: var(--ink); box-shadow: 0 2px 8px rgba(40,40,120,.12); }
.landing .plan { background: #fff; border-color: var(--line); color: var(--ink); box-shadow: 0 18px 40px -28px rgba(40,40,140,.35); }
.landing .plan h3, .landing .plan .price b { color: var(--ink); }
.landing .plan.popular { background: linear-gradient(150deg, #5b3fd0, #2f4bd0); color:#fff; }
.landing .plan.popular h3, .landing .plan.popular .price b, .landing .plan.popular li, .landing .plan.popular .tag, .landing .plan.popular .setup, .landing .plan.popular .price span { color:#fff; }
.landing .plan.popular .btn-primary { background:#fff; color:#2a2086; }
.landing #iletisim { background: #fff; }
.landing .contact form { background: var(--sand); border-color: var(--line); }
.landing .field label { color: var(--ink-2); }
.landing .contact input, .landing .contact textarea { background:#fff; color: var(--ink); border:1px solid var(--line); }
.landing .site-footer { background:#14123a; }


/* ===== Telefon: titanyum çerçeve, cam parlaması, yan tuşlar ===== */
.phone {
  --rx: 0deg; --mx: 0deg; --my: 0deg;
  background: linear-gradient(145deg, #5a5a78 0%, #1b1a2e 18%, #0b0a18 50%, #26244a 82%, #6c6a92 100%);
  padding: calc(var(--h) * .012);
  border-radius: calc(var(--h) * .066);
  box-shadow:
    0 0 0 1.5px rgba(255,255,255,.22) inset,
    0 0 0 calc(var(--h) * .0035) #05040f,
    0 60px 80px -34px rgba(52,40,160,.55),
    0 30px 50px -30px rgba(10,8,40,.6);
  transform: perspective(1400px) rotateX(calc(var(--my) + var(--rx) * -1)) rotateY(var(--mx));
  transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.phone::before { /* dinamik ada */
  top: calc(var(--h) * .026); width: 27%; height: calc(var(--h) * .027); background: #05040f; box-shadow: 0 0 0 1px rgba(255,255,255,.06);
}
.phone::after { /* yan tuşlar */
  content:''; position:absolute; left: calc(var(--h) * -.0045); top: 18%; width: calc(var(--h) * .0045); height: 7%; border-radius: 3px 0 0 3px;
  background: linear-gradient(#3a3858,#1a1930); box-shadow: 0 calc(var(--h) * .085) 0 #2a2848, calc(var(--h) * .485 + var(--h) * .0045 * 0 + var(--h) * .0045) calc(var(--h) * .06) 0 #2a2848;
}
.phone iframe, .phone .screen { border-radius: calc(var(--h) * .056); box-shadow: 0 0 0 1px rgba(0,0,0,.6); }
.phone > iframe + i, .phone .glare { display:none; }
.hero-stage .phone::selection { background: none; }
/* cam parlaması */
.phone .screen::after { content:''; position:absolute; inset:0; pointer-events:none; background: linear-gradient(115deg, rgba(255,255,255,.14), rgba(255,255,255,0) 32%); border-radius: inherit; }
.hero-stage .phone { animation: phoneFloat 7s ease-in-out infinite; }
@keyframes phoneFloat { 0%,100% { translate: 0 0; } 50% { translate: 0 -14px; } }
.hero-stage { perspective: 1400px; }

/* yüzen bildirim kartları */
.chip-f { position:absolute; z-index:3; display:flex; gap:10px; align-items:center; background: rgba(255,255,255,.92); backdrop-filter: blur(10px);
  border:1px solid var(--line); border-radius: 14px; padding: 10px 16px 10px 12px; box-shadow: 0 22px 40px -22px rgba(52,40,160,.45); white-space:nowrap; }
.chip-f b { display:block; font: 600 .82rem var(--font); color: var(--ink); line-height:1.3; }
.chip-f span { font-size:.72rem; color: var(--ink-2); }
.chip-f .dot { width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg,#3b5bdb,#6d3fe0); position:relative; flex:none; }
.chip-f .dot::after { content:''; position:absolute; inset:9px; border-radius:50%; background:#fff; opacity:.9; }
.chip-f .dot.b { background: linear-gradient(135deg,#22a6f2,#3b5bdb); } .chip-f .dot.p { background: linear-gradient(135deg,#8a5cf0,#c15cf0); }
.chip-f.c1 { right: -4%; top: 16%; animation: bob 6s ease-in-out infinite; }
.chip-f.c2 { left: -10%; top: 30%; animation: bob 7s ease-in-out -2s infinite; }
.chip-f.c3 { right: 0; bottom: 20%; animation: bob 8s ease-in-out -4s infinite; }
@keyframes bob { 0%,100% { translate:0 0; } 50% { translate:0 -10px; } }
@media (max-width: 1000px) { .chip-f.c2 { left: 0; } .chip-f.c1 { right: 0; } .chip-f.c3 { display:none; } }
@media (max-width: 600px) { .chip-f { display:none; } }

/* hero arka plan: akan renkli küreler */
.landing .hero { position: relative; }
.landing .hero::before, .landing .hero::after { content:''; position:absolute; border-radius:50%; filter: blur(70px); opacity:.55; z-index:0; pointer-events:none; }
.landing .hero::before { width: 520px; height:520px; right:-120px; top:-80px; background: radial-gradient(circle,#8a5cf0,transparent 70%); animation: orb 16s ease-in-out infinite; }
.landing .hero::after { width: 460px; height:460px; left:-140px; bottom:-120px; background: radial-gradient(circle,#3b5bdb,transparent 70%); animation: orb 19s ease-in-out -6s infinite reverse; }
@keyframes orb { 0%,100% { transform: translate(0,0) scale(1); } 50% { transform: translate(-50px,40px) scale(1.15); } }
.landing .hero .container { position: relative; z-index:1; }

/* ilerleme çubuğu */
.fx-progress { position:fixed; left:0; top:0; height:3px; width:100%; z-index:100; transform-origin:0 50%; transform:scaleX(0); background: linear-gradient(90deg,#3b5bdb,#8a5cf0,#22a6f2); }

/* kaydırınca gelen elemanlar */
.fx .a { opacity:0; transition: opacity .9s cubic-bezier(.2,.7,.2,1) var(--d,0ms), transform .9s cubic-bezier(.2,.7,.2,1) var(--d,0ms); will-change: transform, opacity; }
.fx .a[data-a="up"] { transform: translateY(44px); }
.fx .a[data-a="left"] { transform: translateX(-56px); }
.fx .a[data-a="right"] { transform: translateX(56px); }
.fx .a[data-a="zoom"] { transform: scale(.86) translateY(24px); }
.fx .a.in { opacity:1; transform: none; }
.fx .chip-f.a.in { opacity:1; }
/* başlık kelime kelime */
.split .w { display:inline-block; overflow:hidden; vertical-align:bottom; padding-bottom:.12em; margin-bottom:-.12em; }
.split .w > i { display:inline-block; font-style:inherit; transform: translateY(110%); transition: transform .9s cubic-bezier(.2,.8,.2,1); transition-delay: calc(var(--wi) * 55ms); }
.split.in .w > i { transform:none; }
.split .grad-text .w > i { font-style: inherit; }

/* kart etkileşimi: imleci izleyen ışık + kalkma */
.why-card, .feat, .plan { position:relative; overflow:hidden; transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.why-card::before, .feat::before, .plan::before { content:''; position:absolute; inset:0; pointer-events:none; opacity:0; transition: opacity .3s;
  background: radial-gradient(260px circle at var(--gx,50%) var(--gy,50%), rgba(109,63,224,.16), transparent 70%); }
.why-card:hover::before, .feat:hover::before, .plan:hover::before { opacity:1; }
.fx .why-card.in:hover, .fx .feat.in:hover, .fx .plan.in:hover { transform: translateY(-8px); box-shadow: 0 34px 60px -30px rgba(60,50,180,.45); }
.btn { position:relative; overflow:hidden; transition: transform .25s, box-shadow .25s, background .25s, filter .25s; }
.btn:hover { transform: translateY(-2px); }
.btn-primary::after { content:''; position:absolute; top:0; left:-120%; width:60%; height:100%; background: linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent); transform: skewX(-20deg); animation: shine 4.5s ease-in-out infinite; }
@keyframes shine { 0%,60% { left:-120%; } 100% { left:160%; } }
.site-header .btn-primary::after { animation-duration: 6s; }

/* bölümler arası yumuşak ayraç */
.hero-meta div b { background: linear-gradient(120deg,#3b5bdb,#6d3fe0); -webkit-background-clip:text; background-clip:text; color:transparent; }
.eyebrow { position:relative; }
.eyebrow::before { content:''; display:inline-block; width:22px; height:2px; background: currentColor; margin-right:10px; vertical-align:middle; transform-origin:left; animation: grow 1.2s ease both; }
@keyframes grow { from { transform: scaleX(0); } }
.stand, .stand-link { transition: transform .4s cubic-bezier(.2,.7,.2,1), filter .4s; }
.stand-link:hover { transform: translateY(-10px) rotate(-1.5deg) scale(1.04); filter: drop-shadow(0 30px 30px rgba(0,0,0,.35)); }
.stands .stand-link, .stands .stand { animation: bob 7s ease-in-out infinite; }
.stands > :nth-child(2) { animation-delay: -2s; } .stands > :nth-child(3) { animation-delay: -4s; }
.marq, #marq { animation-duration: 38s; }
@media (prefers-reduced-motion: reduce) { .hero-stage .phone, .chip-f, .stands > *, .landing .hero::before, .landing .hero::after, .btn-primary::after { animation: none !important; } }

/* ======================= SAHNE: maskot + uygulama gösterimi ======================= */
.hero .container { grid-template-columns: 1fr 1.05fr; }
.hero-stage { min-height: 640px; width: 100%; justify-content: center; }
.hero-stage::before { display: none; }
.hero-stage .chip-f, .hero-stage .qr-card, .hero-stage .kodi, .hero-stage .sc-bubble { z-index: 4; }

.sc-bg { position:absolute; inset: 2% 0 2% 0; display:grid; place-items:center; z-index:0; }
.sc-bg i { position:absolute; border-radius:50%; aspect-ratio:1; }
.sc-bg .r1 { width: 92%; background: linear-gradient(145deg,#7c3aed 0%,#4f46e5 50%,#2f6df0 100%); box-shadow: 0 60px 100px -50px rgba(79,70,229,.7); animation: breathe 8s ease-in-out infinite; }
.sc-bg .r2 { width: 112%; border: 2px dashed rgba(124,58,237,.28); animation: spin 60s linear infinite; }
.sc-bg .r3 { width: 74%; border: 2px solid rgba(255,255,255,.22); animation: spin 40s linear infinite reverse; border-style: dotted; }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes breathe { 0%,100% { transform: scale(1); } 50% { transform: scale(1.04); } }

/* düz, markaya uygun telefon */
.mphone { position:relative; z-index:2; width: 262px; height: 528px; border-radius: 44px; padding: 9px; margin-left: 12%;
  background: linear-gradient(160deg,#fff,#dcd9ff); box-shadow: 0 0 0 3px rgba(20,18,58,.92), 0 40px 60px -22px rgba(20,18,80,.65), 0 0 0 10px rgba(255,255,255,.14);
  animation: phoneFloat 7s ease-in-out infinite; }
.mp-notch { position:absolute; z-index:5; top: 16px; left:50%; width: 78px; height: 20px; border-radius: 99px; background:#14123a; transform: translateX(-50%); }
.mp-screen { position:relative; width:100%; height:100%; border-radius: 36px; overflow:hidden; background:#fff; isolation:isolate; }

.mp-scan { position:absolute; inset:0; z-index:3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; text-align:center; padding: 0 22px;
  background: linear-gradient(180deg,#f5f3ff,#e7ebff); animation: scanSc 12s infinite both; }
.mp-scan b { font: 700 1.05rem var(--font); color:#14123a; margin-top: 14px; } .mp-scan span { font-size:.78rem; color:#5d5b8c; }
.mp-cam { position:relative; width: 170px; height:170px; padding: 18px; border-radius: 22px; background:#fff; box-shadow: 0 20px 30px -18px rgba(60,50,180,.5); }
.mp-cam > i { position:absolute; width:26px; height:26px; border: 4px solid #6d3fe0; }
.mp-cam > i:nth-child(1){ left:6px; top:6px; border-right:0; border-bottom:0; border-radius:10px 0 0 0; }
.mp-cam > i:nth-child(2){ right:6px; top:6px; border-left:0; border-bottom:0; border-radius:0 10px 0 0; }
.mp-cam > i:nth-child(3){ left:6px; bottom:6px; border-right:0; border-top:0; border-radius:0 0 0 10px; }
.mp-cam > i:nth-child(4){ right:6px; bottom:6px; border-left:0; border-top:0; border-radius:0 0 10px 0; }
.mp-qr canvas { width:100%; height:auto; display:block; }
.mp-line { position:absolute; left:10px; right:10px; top:14px; height:3px; border-radius:3px; background: linear-gradient(90deg,transparent,#22a6f2,transparent); box-shadow: 0 0 14px 3px rgba(34,166,242,.7); animation: scanLine 1.5s ease-in-out infinite alternate; }
@keyframes scanLine { to { top: calc(100% - 17px); } }
@keyframes scanSc { 0%,24% { opacity:1; transform:none; } 30%,96% { opacity:0; transform: scale(1.08); visibility:hidden; } 100% { opacity:1; transform:none; visibility:visible; } }

.mp-menu { position:absolute; inset:0; z-index:2; padding: 46px 14px 14px; background:#fff; color:#14123a; animation: menuIn 12s infinite both, theme 12s infinite both; }
.mp-top { text-align:left; margin-bottom: 10px; } .mp-top b { display:block; font: 700 1.2rem var(--font); letter-spacing:-.01em; } .mp-top span { font-size:.72rem; opacity:.6; }
.mp-chips { display:flex; gap:6px; margin-bottom: 12px; overflow:hidden; }
.mp-chips i { font-style:normal; font-size:.68rem; font-weight:600; padding: 6px 11px; border-radius:99px; background: rgba(124,58,237,.1); white-space:nowrap; }
.mp-chips i.on { background: linear-gradient(120deg,#6d3fe0,#3b5bdb); color:#fff; }
.mp-row { display:grid; grid-template-columns: 54px 1fr auto; align-items:center; gap:10px; padding: 8px; margin-bottom: 8px; border-radius: 16px; background: rgba(124,58,237,.07); animation: rowIn 12s infinite both; text-align:left; }
.mp-row img { width:54px; height:54px; border-radius: 14px; object-fit:cover; background:#fff; }
.mp-row b { display:block; font: 600 .84rem var(--font); line-height:1.25; } .mp-row span { font-size:.66rem; opacity:.62; line-height:1.3; display:block; }
.mp-row em { font: 700 .88rem var(--font); font-style:normal; color:#6d3fe0; }
.mp-row.r1 { animation-delay: 0s; } .mp-row.r2 { animation-delay: .18s; } .mp-row.r3 { animation-delay: .36s; } .mp-row.r4 { animation-delay: .54s; }
.mp-row.r2 { animation-name: rowIn, flash; animation-duration: 12s, 12s; animation-iteration-count: infinite, infinite; animation-fill-mode: both, both; animation-delay: .18s, 0s; }
.pr { position:relative; display:inline-block; min-width: 46px; text-align:right; }
.pr u { text-decoration:none; position:absolute; right:0; top:0; white-space:nowrap; } .pr u:first-child { position:relative; animation: oldP 12s infinite both; } .pr u:last-child { animation: newP 12s infinite both; color:#22a6f2; }
.mp-toast { position:absolute; left:14px; right:14px; bottom: 16px; display:flex; align-items:center; gap:8px; padding: 11px 14px; border-radius: 14px; background: #14123a; color:#fff; font: 600 .76rem var(--font); animation: toast 12s infinite both; }
.mp-toast i { width:16px; height:16px; border-radius:50%; background:#22c55e; position:relative; } .mp-toast i::after { content:''; position:absolute; left:5px; top:3px; width:4px; height:7px; border: solid #fff; border-width:0 2px 2px 0; transform: rotate(45deg); }
@keyframes menuIn { 0%,27% { opacity:0; transform: translateY(24px); } 34%,95% { opacity:1; transform:none; } 99%,100% { opacity:0; } }
@keyframes rowIn { 0%,29% { opacity:0; transform: translateX(26px); } 37%,95% { opacity:1; transform:none; } 99%,100% { opacity:0; } }
@keyframes flash { 0%,56% { background: rgba(124,58,237,.07); } 60%,66% { background: rgba(34,166,242,.28); } 74%,100% { background: rgba(124,58,237,.07); } }
@keyframes oldP { 0%,57% { opacity:1; } 60%,100% { opacity:0; } }
@keyframes newP { 0%,57% { opacity:0; transform: translateY(8px); } 61%,100% { opacity:1; transform:none; } }
@keyframes toast { 0%,57% { opacity:0; transform: translateY(30px); } 62%,74% { opacity:1; transform:none; } 79%,100% { opacity:0; transform: translateY(30px); } }
@keyframes theme { 0%,80% { background:#fff; color:#14123a; } 85%,93% { background:#17133f; color:#f3f0ff; } 98%,100% { background:#fff; color:#14123a; } }

.kodi { position:absolute; left: -6%; bottom: -3%; width: min(300px, 46%); filter: drop-shadow(0 24px 24px rgba(20,18,80,.35)); animation: kodiIn 1s cubic-bezier(.2,.9,.3,1.2) both .5s; }
@keyframes kodiIn { from { opacity:0; transform: translateY(60px) scale(.8); } }
.sc-bubble { position:absolute; left: -2%; bottom: 41%; max-width: 190px; padding: 12px 16px; border-radius: 18px 18px 18px 4px; background:#fff; color:#14123a; font: 600 .82rem/1.35 var(--font);
  box-shadow: 0 18px 30px -18px rgba(40,30,160,.55); animation: bob 5s ease-in-out infinite, pop 1s .9s both cubic-bezier(.2,.9,.3,1.4); }
@keyframes pop { from { opacity:0; transform: scale(.4); } }

.sc-food { position:absolute; z-index:3; width: 92px; height:92px; padding: 10px; border-radius: 50%; background:#fff; box-shadow: 0 18px 30px -16px rgba(30,20,120,.55); object-fit:contain; animation: bob 6s ease-in-out infinite; }
.sc-food.f1 { left: 2%; top: 6%; animation-delay: -1s; } .sc-food.f2 { right: 0; top: 2%; width:104px; height:104px; animation-delay: -3s; }
.sc-food.f3 { right: -2%; top: 44%; animation-delay: -2s; } .sc-food.f4 { left: 6%; top: 40%; width:78px; height:78px; animation-delay: -4s; }
.sc-food.f5 { right: 10%; bottom: 2%; width:96px; height:96px; animation-delay: -5s; } .sc-food.f6 { left: 38%; bottom: -2%; width:74px; height:74px; animation-delay: -2.5s; }
.sc-spark { position:absolute; z-index:3; width:14px; height:14px; background:#fff; clip-path: polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%); animation: tw 2.4s ease-in-out infinite; }
.sc-spark.s1 { left: 30%; top: 8%; } .sc-spark.s2 { right: 24%; top: 30%; animation-delay: -.8s; width:20px;height:20px; } .sc-spark.s3 { left: 18%; top: 62%; animation-delay: -1.4s; } .sc-spark.s4 { right: 8%; bottom: 30%; animation-delay: -.4s; }
@keyframes tw { 0%,100% { transform: scale(.3) rotate(0); opacity:.2; } 50% { transform: scale(1) rotate(90deg); opacity:1; } }

.hero-stage .qr-card { left: auto; right: 16%; top: -2%; bottom:auto; width: 150px; transform: rotate(6deg); animation: bob 7s ease-in-out infinite; }
.hero-stage .chip-f.c1 { right: -3%; top: 26%; left:auto; } .hero-stage .chip-f.c2 { left: -4%; top: 22%; } .hero-stage .chip-f.c3 { right: 2%; bottom: 22%; }
.hero-stage .phone-cap { display:none; }
.hero-stage .chip-f.a { opacity:1; }
@media (max-width: 1000px) { .hero-stage { min-height: 600px; max-width: 560px; margin: 0 auto; } }
@media (max-width: 600px) { .hero-stage { min-height: 560px; } .mphone { width: 228px; height: 462px; margin-left: 6%; } .kodi { width: 44%; left: -4%; } .sc-food { width: 66px; height:66px; } .sc-food.f2 { width:74px; height:74px; } .hero-stage .qr-card { width: 110px; right: 4%; } .sc-bubble { max-width: 150px; font-size:.74rem; } .chip-f { display:none; } }

/* ===== diğer telefonlar: markaya uygun düz çerçeve + maskot ===== */
.phone { background: linear-gradient(160deg,#fff,#d9d6ff) !important; border-radius: calc(var(--h) * .075) !important; padding: calc(var(--h) * .014) !important;
  box-shadow: 0 0 0 3px rgba(20,18,58,.92), 0 0 0 9px rgba(124,58,237,.16), 0 40px 60px -26px rgba(52,40,200,.55) !important; }
.phone::before { background:#14123a !important; box-shadow:none !important; }
.phone::after { display:none !important; }
.phone iframe, .phone .screen { border-radius: calc(var(--h) * .062) !important; box-shadow:none !important; }
.pw { position:relative; display:flex; justify-content:center; }
.pw > .kodi-s { position:absolute; width: 120px; bottom: 2%; left: -100px; z-index:4; filter: drop-shadow(0 14px 14px rgba(20,18,80,.3)); animation: none; }
.pw > .bub { position:absolute; left: -120px; top: 16%; z-index:4; max-width:150px; padding:10px 14px; border-radius:16px 16px 16px 4px; background:#fff; color:#14123a; font:600 .76rem/1.35 var(--font); box-shadow:0 16px 26px -16px rgba(40,30,160,.55); animation: bob 5s ease-in-out infinite; }
@media (max-width: 1100px) { .pw > .kodi-s, .pw > .bub { display:none; } }