/* Animacje telefonów: gość (karty wydarzeń) i partner (nowa oferta). */
/* Telefon z animacją (gość i partner) */
.t-tel { width: 360px; max-width: 100%; aspect-ratio: 360 / 760; border: 10px solid #2a3558; border-radius: 52px; overflow: hidden; background: var(--papier);
  box-shadow: 0 60px 120px rgba(0,0,0,.35); container-type: inline-size; }
.t-ek { position: relative; height: 100%; display: flex; flex-direction: column; font-size: 13px; color: var(--atrament); transition: opacity .5s; overflow: hidden; }
.t-ek.koniec { opacity: 0; }
.t-top { display: flex; justify-content: space-between; align-items: center; padding: 18px 18px 8px; position: relative; z-index: 2; }
.t-top .znak { font-size: 21px; }
.t-okolica { font-size: 12px; color: var(--szary); display: inline-flex; align-items: center; gap: 5px; font-weight: 600; }
.t-okolica::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--limonka-c); }
.t-okres { display: flex; margin: 4px 14px; background: #e6eaf1; border-radius: 11px; padding: 3px; position: relative; z-index: 2; }
.t-okres span { flex: 1; text-align: center; padding: 6px 0; border-radius: 9px; color: var(--szary); font-weight: 600; transition: background .3s, color .3s, box-shadow .3s; }
.t-okres span.on, .weekend .t-okres [data-k=weekend] { background: var(--biel); color: var(--atrament); box-shadow: 0 1px 3px rgba(17,26,51,.1); }
.weekend .t-okres span.on { background: none; color: var(--szary); box-shadow: none; }
.t-chipy { display: flex; gap: 6px; padding: 8px 14px 10px; overflow: hidden; white-space: nowrap; position: relative; z-index: 2; }
.t-chipy span { padding: 6px 11px; border-radius: 999px; border: 1px solid var(--linia); background: rgba(255,255,255,.7); font-weight: 600; transition: background .3s, color .3s, border-color .3s; }
.t-chipy span.on, .dzieci .t-chipy [data-k=dzieci] { background: var(--atrament); color: var(--biel); border-color: var(--atrament); }
.dzieci .t-chipy span.on { background: rgba(255,255,255,.7); color: var(--atrament); border-color: var(--linia); }

/* Tło: mapa tylko blado i miękko */
.t-tlo { position: absolute; inset: 0; background: url(../img/mapa.jpg) 50% 50% / 760px auto; filter: grayscale(1) blur(3px); opacity: .22; transform: scale(1.06); }

/* Duże karty przewijane w bok */
.t-pole { position: relative; flex: 1; overflow: hidden; }
.t-tor { position: absolute; left: 0; right: 0; top: 10px; bottom: 14px; display: flex; gap: 10px; padding-left: 8%;
  transform: translateX(calc(var(--i, 0) * -1 * (84% + 10px))) translateY(105%); opacity: 0;
  transition: transform .6s cubic-bezier(.2,.8,.2,1), opacity .4s; }
.karty .t-tor { transform: translateX(calc(var(--i, 0) * -1 * (84% + 10px))); opacity: 1; }
.t-karta { flex: 0 0 84%; display: flex; flex-direction: column; background: var(--biel); border-radius: 22px; overflow: hidden; box-shadow: 0 14px 34px rgba(17,26,51,.18); }
.t-obraz { position: relative; flex: 1; min-height: 0; display: flex; flex-direction: column; justify-content: flex-end; gap: 7px; padding: 16px; color: #fff;
  background-size: cover; background-position: 70% 40%; }
.t-obraz::before { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(17,26,51,0) 35%, rgba(17,26,51,.82)); }
.t-obraz > * { position: relative; }
.t-ety { font-size: 10.5px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--limonka); }
.t-obraz b { font: 800 21px/1.12 var(--sora); letter-spacing: -0.02em; text-wrap: balance; }
.t-szybkie { display: flex; flex-wrap: wrap; gap: 5px; }
.t-szybkie span { font-size: 11px; font-weight: 600; padding: 4px 9px; border-radius: 999px; background: rgba(255,255,255,.18); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.t-szybkie span.wolny { background: var(--limonka); color: var(--atrament); }
.t-dol-k { padding: 12px 14px 14px; }
.t-miejsce { font-size: 11px; color: var(--szary); }
.t-miejsce b { display: block; font-size: 13.5px; color: var(--atrament); margin-top: 1px; }
.t-hh { margin-top: 10px; background: var(--atrament); color: var(--biel); text-align: center; border-radius: 13px; padding: 12px; font: 800 16px/1 var(--sora); letter-spacing: -0.04em; transition: background .25s, color .25s; }
.t-hh i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--limonka); margin-left: 1px; }
.t-hh::before { content: ''; }
.hh .t-karta:first-child .t-hh { background: var(--limonka); color: var(--atrament); }
.hh .t-karta:first-child .t-hh i { background: var(--atrament); }
.hh .t-karta:first-child .t-hh::before { content: '✓ '; }

/* Dolny pasek i plan */
.t-dol { display: flex; justify-content: space-around; padding: 10px 0 16px; border-top: 1px solid var(--linia); color: var(--szary); font-size: 11px; font-weight: 600; background: var(--biel); position: relative; z-index: 4; }
.t-dol span { position: relative; transition: color .3s; }
.t-dol span:first-child { color: var(--atrament); }
.t-dol i { position: absolute; top: -9px; right: -14px; min-width: 16px; height: 16px; border-radius: 8px; background: var(--limonka); color: var(--atrament); font: 700 10px/16px var(--inter); text-align: center; font-style: normal; transform: scale(0); transition: transform .35s cubic-bezier(.3,1.6,.5,1); }
.hh .t-dol i { transform: scale(1); }
.moj .t-dol .d-mapa { color: var(--szary); } .moj .t-dol .d-hh { color: var(--atrament); }
.t-moj { position: absolute; left: 0; right: 0; top: 52px; bottom: 47px; background: var(--papier); padding: 22px 16px; opacity: 0; transform: translateX(16%); transition: opacity .35s, transform .45s cubic-bezier(.2,.8,.2,1); pointer-events: none; z-index: 3; }
.moj .t-moj { opacity: 1; transform: none; }
.t-moj-t { display: block; font: 800 22px/1 var(--sora); letter-spacing: -0.03em; margin: 92px 0 16px; }
.t-wiersz { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 16px; background: var(--biel); box-shadow: 0 2px 8px rgba(17,26,51,.06); }
.t-min { width: 58px; height: 58px; flex: none; border-radius: 12px; background-size: cover; background-position: 70% 40%; }
.t-wiersz b { display: block; font: 800 14.5px/1.2 var(--sora); letter-spacing: -0.02em; margin: 5px 0 3px; }
.t-wiersz .k-m { color: var(--szary); font-size: 11.5px; }
.k-k { display: inline-block; background: var(--atrament); color: var(--limonka); font-weight: 700; font-size: 10.5px; padding: 3px 8px; border-radius: 999px; }
.t-pow { position: absolute; z-index: 6; left: 14px; right: 14px; top: 24px; padding: 11px 13px; border-radius: 18px; background: rgba(250,251,253,.94); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  box-shadow: 0 10px 30px rgba(17,26,51,.2); font-size: 12px; transform: translateY(-140%); transition: transform .55s cubic-bezier(.2,.9,.25,1.05); }
.pow .t-pow { transform: none; }
.t-pow-g { display: flex; align-items: center; gap: 7px; color: var(--szary); font-size: 11px; margin-bottom: 4px; }
.t-pow-i { width: 20px; height: 20px; border-radius: 5px; background: var(--limonka); color: var(--atrament); font: 800 6px/7px var(--sora); display: grid; place-items: center; text-align: left; }
.t-pow-c { margin-left: auto; }
.t-pow b { display: block; font-size: 13px; }

/* Palec */
.t-palec { position: absolute; z-index: 9; width: 38px; height: 38px; margin: -19px; border-radius: 50%; background: rgba(17,26,51,.22); border: 2px solid rgba(255,255,255,.9);
  opacity: 0; transition: left .55s cubic-bezier(.4,0,.2,1), top .55s cubic-bezier(.4,0,.2,1), opacity .3s, transform .2s; pointer-events: none; }
.t-palec.jest { opacity: 1; }
.t-palec.tap { transform: scale(.75); background: rgba(17,26,51,.35); }
.t-palec.wolno { transition: left .7s cubic-bezier(.5,0,.3,1), top .7s, opacity .3s, transform .2s; }

/* Telefon partnera */
.t-tryb { font-size: 11px; font-weight: 700; padding: 4px 10px; border-radius: 999px; background: var(--atrament); color: var(--biel); }
.p-panel { flex: 1; padding: 18px 16px; display: flex; flex-direction: column; gap: 14px; }
.p-tyt { font: 800 22px/1.1 var(--sora); letter-spacing: -0.03em; }
.p-przyc, .p-opub { background: var(--atrament); color: var(--biel); text-align: center; border-radius: 13px; padding: 13px; font-weight: 700; font-size: 14px; }
.p-wiersz { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 16px; background: var(--biel); box-shadow: 0 2px 8px rgba(17,26,51,.06);
  opacity: 0; transform: translateY(10px); transition: opacity .4s, transform .5s cubic-bezier(.2,.8,.2,1); }
.staty .p-wiersz { opacity: 1; transform: none; }
.p-wiersz b { display: block; font: 800 14.5px/1.2 var(--sora); letter-spacing: -0.02em; margin-bottom: 6px; }
.p-liczby { display: flex; gap: 12px; color: var(--szary); font-size: 11.5px; }
.p-liczby b { display: inline; font: 700 13px var(--inter); color: var(--atrament); margin: 0; font-variant-numeric: tabular-nums; }
.p-hh { padding: 0 6px; border-radius: 999px; transition: background .3s; }
.hh .p-hh { background: var(--limonka); color: var(--atrament); animation: plus .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes plus { 0% { transform: scale(1); } 40% { transform: scale(1.18); } 100% { transform: scale(1); } }
.p-arkusz { position: absolute; z-index: 5; left: 0; right: 0; bottom: 0; top: 64px; background: var(--biel); border-radius: 22px 22px 0 0; box-shadow: 0 -10px 30px rgba(17,26,51,.12);
  padding: 20px 16px; display: flex; flex-direction: column; gap: 10px; transform: translateY(102%); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.form .p-arkusz { transform: none; }
.p-et { font-size: 12px; font-weight: 600; margin-top: 6px; }
.p-pole { min-height: 44px; display: flex; align-items: center; padding: 0 12px; border: 1.5px solid var(--linia); border-radius: 12px; font-size: 14px; font-weight: 500; transition: border-color .2s; }
.pisze .p-pole { border-color: var(--atrament); }
.p-kursor { width: 1.5px; height: 18px; background: var(--atrament); margin-left: 1px; opacity: 0; }
.pisze .p-kursor { opacity: 1; }
.p-grupa small { display: block; font-size: 11px; color: var(--szary); margin-bottom: 6px; }
.p-ikony { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
.p-ikony span { aspect-ratio: 1; border-radius: 12px; background: var(--papier); display: grid; place-items: center; border: 2px solid transparent; transition: border-color .25s, background .25s; }
.p-ikony img { width: 78%; }
.ob .p-ikony [data-ob=nuta] { border-color: var(--limonka-c); background: #f4fbdf; }
.p-opub { margin-top: auto; }
.p-gosc { position: absolute; inset: 0; z-index: 7; background: var(--papier); display: flex; flex-direction: column; opacity: 0; transform: scale(1.04); transition: opacity .45s, transform .5s cubic-bezier(.2,.8,.2,1); pointer-events: none; }
.gosc .p-gosc { opacity: 1; transform: none; }
.p-gosc .t-pole { margin-top: 6px; }
.p-gosc .t-tor { transform: none; opacity: 1; }
.p-nowa { opacity: 0; transform: translateY(24px) scale(.94); transition: opacity .5s, transform .6s cubic-bezier(.2,.9,.25,1.1), box-shadow .6s; }
.nowa .p-nowa { opacity: 1; transform: none; box-shadow: 0 14px 34px rgba(17,26,51,.18), 0 0 0 3px var(--limonka); }