/* EXE Berber: navy identity, lime accents. Presentation only. */
body.marka-berber[class]{--night:#172538;--text:#172538;--action:#172538;--vurgu:#172538;--signal:#c8f18a;--brand-soft:#edf0f4;--page-tint:#172538;--page-accent:#c8f18a}
body.marka-berber[class] .app-intro h1 span{color:#172538}
body.marka-berber[class] .btn{background:#172538;color:#fff;border-color:#172538}
body.marka-berber[class] .btn:hover{background:#293d55;color:#fff}
body.marka-berber[class] .btn-cizgi,body.marka-berber[class] .ust-kayit{background:transparent;color:#172538;border-color:#b6bfca}
body.marka-berber[class] .btn-cizgi:hover,body.marka-berber[class] .ust-kayit:hover{background:#172538;color:#fff}
body.marka-berber[class] .app-android,body.marka-berber[class] .menu a.secili{color:#172538}
body.marka-berber[class] .app-guven svg{background:#e0ebd3;color:#172538}
body.marka-berber[class] .serit,body.marka-berber[class] .cagri,body.marka-berber[class] .alt{background:#172538;color:#fff}
body.marka-berber[class] .serit strong{color:#c8f18a}
body.marka-berber[class] .serit span,body.marka-berber[class] .cagri p{color:#c7d0da}
body.marka-berber[class] .cagri h2{color:#fff}
body.marka-berber[class] .cagri .btn{background:#c8f18a;border-color:#c8f18a;color:#172538}
body.marka-berber[class] .cagri .btn-cizgi{background:transparent;border-color:#8a99aa;color:#fff}
body.marka-berber[class] .cagri .btn:hover{background:#b4df76;color:#172538}
body.marka-berber[class] .bolum-acik{background:#edf0f4;border-color:#dbe1e8}
body.marka-berber[class] .kart{background:#fff;border-color:#dbe1e8}
body.marka-berber[class] .kart .ikon,body.marka-berber[class] .iletisim-kutu .ikon{background:#172538;color:#c8f18a;border-radius:8px}
body.marka-berber[class] .kart .ikon svg{width:70%;height:70%}
body.marka-berber[class] .adimlar .no{color:#172538}
body.marka-berber[class] .fiyat.one-cikan{background:#172538;border-color:#172538;color:#fff}
body.marka-berber[class] .fiyat.one-cikan h3,body.marka-berber[class] .fiyat.one-cikan .tutar{color:#fff}
body.marka-berber[class] .fiyat.one-cikan .tutar span,body.marka-berber[class] .fiyat.one-cikan .birim,body.marka-berber[class] .fiyat.one-cikan .acik,body.marka-berber[class] .fiyat.one-cikan li{color:#d0d9e2}
body.marka-berber[class] .fiyat.one-cikan .btn{background:#c8f18a;color:#172538;border-color:#c8f18a}
body.marka-berber[class] .fiyat .etiket{background:#c8f18a;color:#172538}
body.marka-berber[class] .deneme-satiri{background:#e6efd9;border-color:#ccdcba;color:#172538}
body.marka-berber[class] .deneme-satiri a{color:#172538}
body.marka-berber.ic-ferah .sayfa-basi{background:#172538;color:#fff}
body.marka-berber.ic-ferah .sayfa-basi h1{color:#fff}
body.marka-berber.ic-ferah .sayfa-basi h1 span{color:#c8f18a}
body.marka-berber.ic-ferah .sayfa-basi p:not(.kirinti){color:#d0d9e2}
body.marka-berber.ic-ferah .sayfa-basi strong{color:#c8f18a}
body.marka-berber.ic-ferah .kirinti,body.marka-berber.ic-ferah .kirinti a{color:#d0d9e2;border-color:#ffffff26}
body.marka-berber.ic-ferah .sayfa-basi:before{border-color:#c8f18a0c}
body.marka-berber.ic-ferah .sayfa-basi:after{border-color:#c8f18a24}
body.marka-berber.ic-ferah .rol-ust{background:#172538;border-color:#314154}
body.marka-berber.ic-ferah .rol-ust h3{color:#fff}
body.marka-berber.ic-ferah .rol-ust p{color:#d0d9e2}
body.marka-berber.ic-ferah .rol-ust:before{color:#c8f18a}
body.marka-berber.ic-ferah .detay{background:#edf0f4;border-color:#dbe1e8}
body.marka-berber.ic-ferah .detay:nth-child(even){background:#e8eedf}
body.marka-berber.ic-ferah .detay-etiket{color:#172538}
body.marka-berber.ic-ferah .kayit-kart .btn-google{background:#fff;color:#172538;border-color:#b6bfca}
body.marka-berber.ic-ferah .kayit-kart .btn-google:hover{background:#edf0f4}
/* Footer'ın üstündeki çağrı alanı: parlak mavi (tüm sayfalarda) */
body.marka-berber[class] .cagri{background:#214ee8;color:#fff;border:0}
body.marka-berber[class] .cagri h2{color:#fff}
body.marka-berber[class] .cagri p{color:#dbe3ff}
body.marka-berber[class] .cagri .btn{background:#fff;border-color:#fff;color:#214ee8}
body.marka-berber[class] .cagri .btn:hover,body.marka-berber[class] .cagri .btn:focus-visible{background:#e8edff;border-color:#e8edff;color:#214ee8;transform:translateY(-1px)}
body.marka-berber[class] .cagri .btn-cizgi{background:transparent;border-color:#ffffff80;color:#fff}
body.marka-berber[class] .cagri .btn-cizgi:hover,body.marka-berber[class] .cagri .btn-cizgi:focus-visible{background:#ffffff1f;border-color:#fff;color:#fff}
/* Üst menüdeki "Kayıt Ol" ve "Uygulamaya geç": üzerine gelince parlak mavi */
body.marka-berber[class] .ust-kayit:hover,body.marka-berber[class] .ust-kayit:focus-visible,
body.marka-berber[class] .ust-giris:hover,body.marka-berber[class] .ust-giris:focus-visible,
body.marka-berber[class] .menu .menu-giris:hover,body.marka-berber[class] .menu .menu-kayit:hover{background:#214ee8;border-color:#214ee8;color:#fff}
/* Özellikler: rol kartları sitenin üç tonunda (lacivert · parlak mavi · açık mavi), yönetim ekranı kutuları sade beyaz */
body.marka-berber.ic-ferah .rol:nth-child(n) .rol-ust{background:#172538;border-color:#172538}
body.marka-berber.ic-ferah .rol:nth-child(2) .rol-ust{background:#214ee8;border-color:#214ee8}
body.marka-berber.ic-ferah .rol:nth-child(3) .rol-ust{background:#e8edff;border-color:#d6defa}
body.marka-berber.ic-ferah .rol:nth-child(-n+2) .rol-ust h3{color:#fff}
body.marka-berber.ic-ferah .rol:nth-child(1) .rol-ust p{color:#c7d0da}
body.marka-berber.ic-ferah .rol:nth-child(2) .rol-ust p{color:#dbe3ff}
body.marka-berber.ic-ferah .rol:nth-child(1) .rol-ust:before{color:#c8f18a}
body.marka-berber.ic-ferah .rol:nth-child(2) .rol-ust:before{color:#dbe3ff}
body.marka-berber.ic-ferah .rol:nth-child(3) .rol-ust h3{color:#172538}
body.marka-berber.ic-ferah .rol:nth-child(3) .rol-ust p,body.marka-berber.ic-ferah .rol:nth-child(3) .rol-ust:before{color:#214ee8}
body.marka-berber.ic-ferah .rol li::before{background:#214ee8}
body.marka-berber.ic-ferah .detay,body.marka-berber.ic-ferah .detay:nth-child(even){background:#fff;border:1px solid #dbe1e8}
body.marka-berber.ic-ferah .detay-etiket{color:#214ee8}
body.marka-berber.ic-ferah.sayfa-ozellikler .bolum-acik{background:#f3f5f9}

/* Sayfa basliklari: her sayfaya ayri pastel renk (Sugar Haze, Envato) */
body.marka-berber.ic-ferah{--baslik-gorsel:url(/gorseller/basliklar/renk-02.webp);--baslik-vurgu:#5b3fa0}
body.marka-berber.ic-ferah.sayfa-ozellikler{--baslik-gorsel:url(/gorseller/basliklar/renk-05.webp);--baslik-vurgu:#1d3fc4}
body.marka-berber.ic-ferah.sayfa-fiyatlandirma{--baslik-gorsel:url(/gorseller/basliklar/renk-03.webp);--baslik-vurgu:#1f6b3f}
body.marka-berber.ic-ferah.sayfa-hakkimizda{--baslik-gorsel:url(/gorseller/basliklar/renk-02.webp);--baslik-vurgu:#5b3fa0}
body.marka-berber.ic-ferah.sayfa-iletisim{--baslik-gorsel:url(/gorseller/basliklar/renk-04.webp);--baslik-vurgu:#a4480f}
body.marka-berber.ic-ferah.sayfa-destek{--baslik-gorsel:url(/gorseller/basliklar/renk-06.webp);--baslik-vurgu:#b3263f}
body.marka-berber.ic-ferah.sayfa-sss{--baslik-gorsel:url(/gorseller/basliklar/renk-09.webp);--baslik-vurgu:#4a46b8}
body.marka-berber.ic-ferah.sayfa-kayit{--baslik-gorsel:url(/gorseller/basliklar/renk-07.webp);--baslik-vurgu:#9a2a8a}
body.marka-berber.ic-ferah.sayfa-hesap{--baslik-gorsel:url(/gorseller/basliklar/renk-08.webp);--baslik-vurgu:#7a33a8}
body.marka-berber.ic-ferah:is(.sayfa-iphone,.sayfa-gizlilik,.sayfa-kvkk,.sayfa-cerez,.sayfa-mesafeli-satis){--baslik-gorsel:url(/gorseller/basliklar/renk-01.webp);--baslik-vurgu:#8e3d8a}
body.marka-berber.ic-ferah .sayfa-basi{--dalga-gorsel:var(--baslik-gorsel);--dalga-beyaz:.6;color:#172538;border-bottom:1px solid #17253814}
body.marka-berber.ic-ferah .sayfa-basi h1{color:#172538}
body.marka-berber.ic-ferah .sayfa-basi h1 span,body.marka-berber.ic-ferah .sayfa-basi strong{color:var(--baslik-vurgu)}
body.marka-berber.ic-ferah .sayfa-basi p:not(.kirinti){color:#34404f}
body.marka-berber.ic-ferah .sayfa-basi .kirinti,body.marka-berber.ic-ferah .sayfa-basi .kirinti a{color:#34404f;border-color:#1725381f}
body.marka-berber.ic-ferah .sayfa-basi:before{border-color:#ffffff59}
body.marka-berber.ic-ferah .sayfa-basi:after{border-color:#ffffff8c}

/* Dalgali zemin: CSS sabit zemin yedek, dalga.js uzerine WebGL tuvali koyar */
body.marka-berber.ic-ferah .sayfa-basi{position:relative;isolation:isolate;background:linear-gradient(90deg,rgb(255 255 255/var(--dalga-beyaz)),#fff0),var(--dalga-gorsel) center/cover no-repeat,#f3eef8}
.dalga-tuval{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none;opacity:0;transition:opacity .8s ease}
.dalga-tuval.hazir{opacity:1}

/* Ana sayfa renk: sinirli alanlarda pastel (Sugar Haze). Bolumlerin kendisi sade kalir. */
/* 1) Telefon vitrini: dalgali pastel kart; telefonlar alta ve yanlara saydam soner (beyaz ortu yok) */
body.marka-berber:not(.ic-ferah) .uclu{--dalga-gorsel:url(/gorseller/basliklar/renk-mavi.webp);--dalga-beyaz:.1;position:relative;isolation:isolate;overflow:hidden;border:0;border-radius:24px;background:var(--dalga-gorsel) center/cover no-repeat,#dfe6fb}
body.marka-berber:not(.ic-ferah) .uclu:before{display:none}
body.marka-berber:not(.ic-ferah) .uclu .uclu-sahne::after{display:none}
body.marka-berber:not(.ic-ferah) .uclu .uclu-sahne{-webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(#000 calc(100% - 110px),transparent);-webkit-mask-composite:source-in;mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(#000 calc(100% - 110px),transparent);mask-composite:intersect}
/* 2) Ozellik kartlari: ikon kutulari acik mavi, ikon mavi (uygulamadaki ikonlar) */
body.marka-berber[class]:not(.ic-ferah) .kart .ikon{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;color:#214ee8;background:#eaf0fd}
body.marka-berber[class]:not(.ic-ferah) .kart .ikon svg{width:52%;height:52%}
/* 3) Alt cagri: kenardan kenara serit yerine sade zemin ustunde dalgali pastel kart */
body.marka-berber[class]:not(.ic-ferah) .cagri{background:transparent;color:#172538;padding-top:0}
body.marka-berber:not(.ic-ferah) .cagri>.kap{--dalga-gorsel:url(/gorseller/basliklar/renk-mavi.webp);--dalga-beyaz:.25;position:relative;isolation:isolate;overflow:hidden;border-radius:28px;padding:72px 64px;background:linear-gradient(90deg,rgb(255 255 255/.4),#fff0),var(--dalga-gorsel) center/cover no-repeat,#dfe8fb}
body.marka-berber[class]:not(.ic-ferah) .cagri h2{color:#172538}
body.marka-berber[class]:not(.ic-ferah) .cagri p{color:#34404f}
body.marka-berber[class]:not(.ic-ferah) .cagri .btn{background:#172538;border-color:#172538;color:#fff}
body.marka-berber[class]:not(.ic-ferah) .cagri .btn:hover,body.marka-berber[class]:not(.ic-ferah) .cagri .btn:focus-visible{background:#22344d;border-color:#22344d;color:#fff}
body.marka-berber[class]:not(.ic-ferah) .cagri .btn-cizgi{background:#ffffff99;border-color:#172538;color:#172538}
body.marka-berber[class]:not(.ic-ferah) .cagri .btn-cizgi:hover,body.marka-berber[class]:not(.ic-ferah) .cagri .btn-cizgi:focus-visible{background:#fff;border-color:#172538;color:#172538}
@media(max-width:600px){body.marka-berber:not(.ic-ferah) .cagri>.kap{padding:44px 24px;border-radius:20px}body.marka-berber:not(.ic-ferah) .uclu{border-radius:18px}}
/* 4) Hero basligi: "ustalik" altinda pastel firca vurusu (Vector Ink Brush Strokes, Envato) */
.app-intro h1 .firca{position:relative;z-index:0;font-style:normal;white-space:nowrap}
.app-intro h1 .firca::before{content:"";position:absolute;z-index:-1;left:-12%;right:-4%;top:46%;bottom:-6%;background:linear-gradient(100deg,#a9bfff 0%,#7f9ef7 45%,#9db8ff 100%);-webkit-mask:url(/gorseller/firca-vurgu.webp) center/100% 100% no-repeat;mask:url(/gorseller/firca-vurgu.webp) center/100% 100% no-repeat;transform:rotate(-1.5deg);animation:firca-ciz .9s cubic-bezier(.2,.8,.2,1) .35s both}
@keyframes firca-ciz{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){.app-intro h1 .firca::before{animation:none}}

/* Tek vurgu rengi: logo mavisi. Eski yesil/lime temadan kalanlar maviye ve notr griye cekildi. */
body.marka-berber[class]{--y-273c28:#303133;--y-283420:#292a2b;--y-3b4822:#333437;--y-44504a:#494a4b;--y-4d5c47:#505153;--y-4f6640:#515255;--y-546053:#59595a;--y-54614c:#555658;--y-56634e:#57585a;--y-587048:#5a5b5e;--y-5b6854:#5d5e5f;--y-5c7060:#656667;--y-5f6a60:#646465;--y-637058:#636465;--y-657063:#69696a;--y-66755c:#67686a;--y-687561:#6a6b6c;--y-7a8476:#7c7d7e;--y-84927a:#858687;--y-abb5a8:#aeaeaf;--y-aeb7aa:#b0b0b1;--y-b7c2ae:#b7b8b9;--y-b8c0bc:#bcbcbc;--y-b9c3af:#b8b9ba;--y-bcc5b4:#bbbcbe;--y-bec5bc:#c0c0c1;--y-bfc8b8:#bfc0c1;--y-c8d0c2:#c8c9ca;--y-c8d5b8:#c5c6c8;--y-c9cfc6:#cacacb;--y-cad2c2:#c9cacb;--y-cbd2c4:#cacbcc;--y-cbd3c3:#cacbcc;--y-ccd3c4:#cbcbcc;--y-ccd4c2:#cacbcc;--y-e0e7d8:#dfdfe0;--y-e3e9d9:#e0e1e2;--y-e6ebde:#e4e4e5;--y-e6ebdf:#e4e5e6;--y-e8ece3:#e7e7e8;--y-e9ece4:#e8e8e8;--y-edf0e8:#ececec;--y-f5f5ef:#f2f2f2;--signal:#8fb0ff;--yesil-bolum:#edf1f8;--kart-hover:#f1f4fa;--mavi:#214ee8;--mavi-soluk:#e8eeff;--mavi-cizgi:#cdd9fb}
body.marka-berber[class] .serit strong{color:#8fb0ff}
body.marka-berber[class] .alt-baslik{color:#8fb0ff}
body.marka-berber[class] .fiyat .etiket{background:var(--mavi);color:#fff}
body.marka-berber[class] .fiyat.one-cikan .btn{background:#fff;border-color:#fff;color:#172538}
body.marka-berber[class] .app-guven svg{background:var(--mavi-soluk);color:var(--mavi)}
body.marka-berber[class] :is(.deneme-satiri){background:var(--mavi-soluk);border-color:var(--mavi-cizgi);color:#172538}
body.marka-berber[class] .deneme-satiri i{background:var(--mavi)}
body.marka-berber[class] .deneme-satiri a{color:var(--mavi)}
body.marka-berber[class] .bolum-koyu{background:#edf1f8}
body.marka-berber[class] .vitrin-ad-ok{border-color:#c5cad3}
body.marka-berber[class] .ferah-fiyat :is(.fiyat h3,.tutar){color:#172538}
body.marka-berber[class] .ferah-fiyat .fiyat:not(.one-cikan){border-color:#dfe3ea}
body.marka-berber[class] .paket-ozet{border-color:#e3e7ee}
body.marka-berber[class] .paket-ozet li::marker,body.marka-berber[class] .paket-ozet li::before{color:var(--mavi)}
body.marka-berber.ic-ferah .form{border-top-color:var(--mavi)}
body.marka-berber.ic-ferah .kart:nth-child(3n+2) .ikon{background:var(--mavi-soluk);color:var(--mavi)}
body.marka-berber.ic-ferah .kayit-kim--patron{background:var(--mavi-soluk);border-color:var(--mavi-cizgi)}
body.marka-berber[class] .kart .ikon,body.marka-berber[class] .iletisim-kutu .ikon{color:#8fb0ff}
body.marka-berber.ic-ferah{color:#172538;--muted:#5d6675}
body.marka-berber.ic-ferah :is(h2,h3,.tutar){color:#172538}
body.marka-berber[class] .fiyat:not(.one-cikan) :is(.birim,.birim span,.acik,.paket-ozet li){color:#5d6675}
body.marka-berber.ic-ferah .bolum :is(p,li,strong):not(.one-cikan *):not(.kirinti){color:#4f5866}
body.marka-berber.ic-ferah .fiyat:not(.one-cikan){border-color:#dfe3ea}
body.marka-berber[class] :is(.alan input,.alan select,.alan textarea,input,select,textarea,.kayit-kod){border-color:#dce1e8}
body.marka-berber[class] .form.kayit-kart{border-bottom-color:#dfe3ea}
body.marka-berber[class] .fiyat:not(.one-cikan) .tutar span{color:#5d6675}
/* Paket listesi tikleri: yazi karakteri yerine duz SVG tik, yuvarlak acik mavi zemin icinde */
body.marka-berber[class] .paket-ozet li{display:flex;align-items:center;gap:10px}
body.marka-berber[class] .paket-ozet li::before{content:"";flex:none;width:18px;height:18px;margin:0;border-radius:50%;background:var(--mavi-soluk) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-5' fill='none' stroke='%23214ee8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
body.marka-berber[class] .fiyat.one-cikan .paket-ozet li::before{background:rgb(255 255 255/.12) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-5' fill='none' stroke='%238fb0ff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
/* One cikan paket (6 aylik) digerleriyle ayni gorunur; farki sadece sag ustteki "En cok tercih edilen" etiketi */
body.marka-berber[class] .fiyat.one-cikan{background:#fff;color:#172538;border:1px solid #dfe3ea;border-top-width:5px;box-shadow:0 5px 12px #28352603;transform:none}
body.marka-berber[class] .fiyat.one-cikan :is(h3,.tutar,.fiyat-git){color:#172538}
body.marka-berber[class] .fiyat.one-cikan :is(.birim,.acik,.tutar span,.paket-ozet li){color:#5d6675}
body.marka-berber[class] .fiyat.one-cikan .paket-ozet{border-color:#e3e7ee}
body.marka-berber[class] .fiyat.one-cikan .paket-ozet li::before{background:var(--mavi-soluk) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.3 4.7-5' fill='none' stroke='%23214ee8' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat}
body.marka-berber[class] .fiyat.one-cikan :is(.btn,.hesap-sec,.paket-basla){background:#172538;border-color:#172538;color:#fff}
/* Altbilgi: link ve kart logolari hover'da lime yerine acik mavi */
body.marka-berber[class] .alt a:not(.marka):hover,body.marka-berber[class] .alt a:not(.marka):focus-visible{color:#8fb0ff!important}
body.marka-berber[class] .kart-logo:hover{background:#8fb0ff}
/* Kalan sabit lime kullanimlari: iPhone adim numaralari ve Hesabim paneli */
body.marka-berber[class] .ip-no{color:#8fb0ff}
body.marka-berber[class] .hesap-avatar{color:#8fb0ff}
body.marka-berber[class] .hesap-nav button.secili svg{color:#8fb0ff}
body.marka-berber[class] :is(.hesap-kart-rozet,.hesap-rozet--aktif){background:var(--mavi-soluk);color:var(--mavi)}

/* Ana sayfa fotograf seridi: tek gercek berber fotografi, mavi cift ton */
.berber-foto{padding:0 0 96px}
.berber-foto-kart{position:relative;margin:0;border-radius:24px;overflow:hidden;background:#172538;isolation:isolate}
.berber-foto-kart img{display:block;width:100%;height:clamp(380px,40vw,560px);object-fit:cover;object-position:62% 18%}
.berber-foto-kart::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgb(14 24 46/.88) 0%,rgb(14 24 46/.62) 34%,rgb(14 24 46/0) 66%);pointer-events:none}
.berber-foto-kart figcaption{position:absolute;z-index:1;left:0;bottom:0;max-width:560px;padding:56px;color:#fff}
.berber-foto-ust{margin:0 0 16px;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8fb0ff}
.berber-foto-kart h2{margin:0 0 18px;font-size:clamp(36px,4.2vw,60px);line-height:1.04;font-weight:500;letter-spacing:-.05em;color:#fff}
.berber-foto-alt{margin:0;font-size:17px;line-height:1.6;color:#d3dbea;max-width:40ch}
@media(max-width:700px){
  .berber-foto{padding-bottom:64px}
  .berber-foto-kart{border-radius:18px}
  .berber-foto-kart img{height:460px;object-position:74% 30%}
  .berber-foto-kart::after{background:linear-gradient(0deg,rgb(14 24 46/.92) 0%,rgb(14 24 46/.6) 45%,rgb(14 24 46/0) 75%)}
  .berber-foto-kart figcaption{padding:28px 24px}
  .berber-foto-alt{font-size:15px}
}

/* Fotograf seridi: fotograflar ust uste, sirayla yumusak gecis */
.berber-foto-kart{height:clamp(380px,40vw,560px)}
.berber-foto-kart img{position:absolute;inset:0;width:100%;height:100%;opacity:0;transform:scale(1.04);transition:opacity 1.2s ease,transform 6s ease}
.berber-foto-kart img.aktif{opacity:1;transform:scale(1)}
@media(max-width:700px){.berber-foto-kart{height:460px}.berber-foto-kart img{height:100%}}
@media(prefers-reduced-motion:reduce){.berber-foto-kart img{transition:none;transform:none}}

/* Bir ustanin gunu: saat saat akis */
.usta-gunu{padding-top:96px}
.gun-akisi{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.gun-akisi::before{content:"";position:absolute;left:0;right:0;top:44px;height:1px;background:#d6dce7}
.gun-akisi li{position:relative;padding:0 28px 0 0}
.gun-akisi time{display:block;font-size:clamp(28px,2.6vw,38px);font-weight:500;letter-spacing:-.04em;color:#172538;line-height:1;margin:0 0 22px}
.gun-akisi li::before{content:"";position:absolute;left:0;top:38px;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--mavi,#214ee8);box-sizing:border-box}
.gun-akisi h3{margin:26px 0 8px;font-size:19px;font-weight:600;color:#172538}
.gun-akisi p{margin:0;font-size:15px;line-height:1.65;color:#5d6675;max-width:30ch}
@media(max-width:800px){
  .usta-gunu{padding-top:64px}
  .gun-akisi{grid-template-columns:1fr;gap:28px;margin-top:32px;padding-left:28px}
  .gun-akisi::before{left:6px;right:auto;top:6px;bottom:6px;width:1px;height:auto}
  .gun-akisi li{padding:0}
  .gun-akisi li::before{left:-28px;top:6px}
  .gun-akisi time{font-size:26px;margin-bottom:6px}
  .gun-akisi h3{margin-top:4px}
}
body.marka-berber .usta-gunu .gun-akisi time{margin:0 0 44px}
body.marka-berber .usta-gunu .gun-akisi h3{margin:0 0 8px}
body.marka-berber .usta-gunu .gun-akisi::before{top:57px}
body.marka-berber .usta-gunu .gun-akisi li::before{top:51px}
@media(max-width:800px){body.marka-berber .usta-gunu .gun-akisi time{margin:0 0 6px}body.marka-berber .usta-gunu .gun-akisi::before{top:6px}body.marka-berber .usta-gunu .gun-akisi li::before{top:12px}}

/* Form basari mesaji: solda tik animasyonu */
.basari-kutu{display:flex;align-items:center;gap:14px}
.basari-anim{flex:none;width:52px;height:52px;margin:-8px -4px -8px -10px}
.berber-foto-kart video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:60% 40%;opacity:0;transition:opacity 1.2s ease}
.berber-foto-kart video.aktif{opacity:1}

/* QR afisi bolumu */
.qr-ic{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:64px;align-items:center}
.qr-metin h2{margin:0 0 18px}
.qr-metin .bolum-alt{max-width:46ch}
.qr-gorsel{margin:0;border-radius:24px;overflow:hidden;background:#172538}
.qr-gorsel img{display:block;width:100%;height:auto}
@media(max-width:900px){.qr-ic{grid-template-columns:1fr;gap:32px}}
@media(max-width:600px){.qr-gorsel{border-radius:18px}}

/* Özellikler: üç rol kartı tek dilde — üç ayrı renk (lacivert, mavi, açık mavi + yeşil numara) karmaşık duruyordu.
   Hepsi beyaz kart, açık mavi-gri başlık, mavi numara, lacivert başlık. */
body.marka-berber.ic-ferah .rol{background:#fff;border:1px solid #e3e5e9;border-radius:16px;overflow:hidden}
body.marka-berber.ic-ferah .rol:nth-child(n) .rol-ust{background:#f2f5fd;border-color:#e3e5e9;border-bottom:1px solid #e3e5e9}
body.marka-berber.ic-ferah .rol:nth-child(n) .rol-ust h3{color:#172538}
body.marka-berber.ic-ferah .rol:nth-child(n) .rol-ust p{color:#5d6675}
body.marka-berber.ic-ferah .rol:nth-child(n) .rol-ust:before{color:#214ee8;font-weight:700}
body.marka-berber.ic-ferah .rol li::before{background:#214ee8}
/* Ana sayfa "Uygulamayı aç" ve "Ana ekrana ekle": üst menüdeki "Uygulamaya geç" ve "Kayıt Ol" ile aynı renkler */
body.marka-berber[class] .app-actions .btn:not(.btn-cizgi){background:#172538;border-color:#172538;color:#fff}
body.marka-berber[class] .app-actions .btn-cizgi{background:transparent;border-color:#b6bfca;color:#172538}
body.marka-berber[class] .app-actions .btn:hover,body.marka-berber[class] .app-actions .btn:focus-visible{background:#214ee8;border-color:#214ee8;color:#fff}
/* Kayan menü: görseller artık telefon çerçevesinin içinde (PNG değil çerçeveli webp); eski çizgi çerçeve kalksın */
body.marka-berber[class] .uclu-slot img{border:0;border-radius:0;background:transparent;box-shadow:none;filter:drop-shadow(0 18px 26px rgba(23,37,56,.22))}

/* kart-derinlik başı: ana sayfa özellik kartları, bağlantılı derinlik + dikey berber direği (kart-derinlik.js).
   animation-fill-mode:backwards: açılıştaki reveal animasyonu bitince transform'u kilitlemesin, eğim çalışsın. */
body.marka-berber[class] .kartlar[data-derinlik]{perspective:1100px}
body.marka-berber[class] .kartlar[data-derinlik] .kart,body.marka-berber[class] .kartlar[data-derinlik] .kart:hover{position:relative;isolation:isolate;overflow:hidden;will-change:transform;transform:rotateX(var(--kd-rx,0deg)) rotateY(var(--kd-ry,0deg));animation-fill-mode:backwards;transition:border-color .3s;border:0;border-radius:10px;box-shadow:none;background:#fff;--kesik:96px;-webkit-mask:radial-gradient(circle 11px at 0 var(--kesik),#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% var(--kesik),#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 11px at 0 var(--kesik),#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 11px at 100% var(--kesik),#0000 98%,#000) right/51% 100% no-repeat}
/* Sıra fişi: iki yanda yarım ay kesik, ikonla başlık arasında delikli çizgi; gölge ızgaraya verilir ki kesiklerle birlikte düşsün */
body.marka-berber[class] .kartlar[data-derinlik]{filter:drop-shadow(0 0 .6px #b7beb2) drop-shadow(0 8px 12px #28352608)}
body.marka-berber[class] .kartlar[data-derinlik] .kart::after{content:"";position:absolute;left:18px;right:18px;top:calc(var(--kesik) - 1px);border-top:2px dashed #d6dbd2;pointer-events:none}
body.marka-berber[class] .kartlar[data-derinlik] .kart .ikon{margin-bottom:40px}
@media (max-width:600px){body.marka-berber[class] .kartlar[data-derinlik] .kart{--kesik:90px}}
body.marka-berber[class] .kartlar[data-derinlik] .kart .ikon,body.marka-berber[class] .kartlar[data-derinlik] .kart:hover .ikon{transform:translate(calc(var(--kd-px,0) * 5px),calc(var(--kd-py,0) * 5px));transition:background-color .3s,color .3s}
body.marka-berber[class] .kartlar[data-derinlik] .kart.kd-icinde .ikon{background:#214ee8;color:#fff}
.kd-isik{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(360px circle at var(--kd-mx,50%) var(--kd-my,50%),#eef2fc 0%,transparent 60%);opacity:calc(var(--kd-etki,0) * .45)}
.kd-direk{position:absolute;top:0;bottom:0;left:0;width:7px;z-index:1;pointer-events:none;background:repeating-linear-gradient(-45deg,#214ee8 0 10px,#fff 10px 20px,#c8323c 20px 30px,#fff 30px 40px);background-size:100% 56.57px;transform:scaleY(0);transform-origin:var(--kd-koken,top);transition:transform .4s cubic-bezier(.2,.8,.2,1);animation:kd-direk-don 1.4s linear infinite;animation-play-state:paused}
.kd-icinde .kd-direk{transform:scaleY(1);transition-duration:.5s;animation-play-state:running}
@keyframes kd-direk-don{to{background-position:0 56.57px}}
@media (prefers-reduced-motion:reduce){body.marka-berber[class] .kartlar[data-derinlik] .kart{transform:none}.kd-direk{animation:none;transition:none}}
/* kart-derinlik sonu */

/* Paket kartları (parcalar/paket-kartlari.php): koltuk sayısına göre 3 paket, aylık/yıllık.
   Fark sadece koltuk: kartın ortasında koltuk simgeleri, ortak olanlar altta bir kez. Önerilen kart koyu. */
.paket-secim{display:grid;gap:22px}
.donem-sec{justify-self:start;position:relative;isolation:isolate;display:inline-flex;gap:4px;padding:4px;background:#fff;border:1px solid #dfe4dc;border-radius:999px}
.donem-sec::before{content:"";position:absolute;z-index:-1;top:4px;bottom:4px;left:0;width:var(--hw,0);transform:translateX(var(--hx,0));background:#172538;border-radius:999px;opacity:0}
.donem-sec.hazir::before{opacity:1;transition:transform .45s cubic-bezier(.3,1.3,.5,1),width .45s cubic-bezier(.3,1.3,.5,1)}
.donem-sec.hazir button[aria-pressed=true]{background:none}
.donem-sec button{transition:color .3s}
.pk-tutar span{display:inline-block;min-width:2ch}
.pk-tutar span[hidden],.pk-fatura span[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.donem-sec.hazir::before{transition:none}}
.donem-sec button{font:600 14px Manrope,system-ui,sans-serif;color:#5d6675;background:none;border:0;border-radius:999px;padding:9px 18px;cursor:pointer;display:inline-flex;align-items:center;gap:8px}
.donem-sec button[aria-pressed=true]{background:#172538;color:#fff}
.donem-sec button span{font-size:11px;font-weight:700;color:#214ee8;background:#eaf0fd;border-radius:999px;padding:2px 8px}
.donem-sec button:focus-visible{outline:2px solid #214ee8;outline-offset:2px}
.pk-izgara{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.pk-kart{display:flex;flex-direction:column;min-width:0;overflow:hidden;padding:30px;border:1px solid #dfe4dc;border-radius:16px;background:#fff;color:#172538}
.pk-ust{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pk-kart h3{margin:0;font:600 24px/1.1 Manrope,system-ui,sans-serif;letter-spacing:-.03em;color:inherit}
.pk-etiket{font:700 12px Manrope,system-ui,sans-serif;color:#172538;background:#c8d6ff;border-radius:999px;padding:4px 10px}
.pk-kim{margin:8px 0 0;font-size:15px;line-height:1.6;color:#5d6675;min-height:3.2em}
.pk-koltuk{margin:18px 0 0}
.pk-koltuk strong{display:inline-block;padding:6px 12px;border-radius:999px;background:#eaf0fd;color:#214ee8}
.pk-one .pk-koltuk strong{background:#ffffff1a;color:#c8d6ff}
.pk-koltuklar{display:flex;align-items:center;gap:4px;color:#214ee8;min-height:22px}
.pk-koltuklar svg{flex:none}
.pk-koltuklar b{font:700 18px/1 Manrope,system-ui,sans-serif;margin-left:4px}
.pk-koltuk strong{font:700 15px Manrope,system-ui,sans-serif}
.pk-fiyat{margin:22px 0 24px}
.pk-tutar{margin:0;font:600 52px/1 Manrope,system-ui,sans-serif;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.pk-tutar small{font-size:16px;font-weight:600;letter-spacing:0;color:#5d6675;margin-left:4px}
.pk-fatura{margin:10px 0 0;font-size:13px;line-height:1.5;color:#5d6675;min-height:2.4em}
.pk-fatura s{opacity:.7}
.pk-dugme{margin-top:auto;display:block;text-align:center;font:700 15px Manrope,system-ui,sans-serif;padding:14px 18px;border-radius:10px;border:1px solid #172538;color:#172538;text-decoration:none;transition:background-color .2s,color .2s}
.pk-dugme:hover,.pk-dugme:focus-visible{background:#172538;color:#fff;outline:none}
.pk-satin{margin-top:12px;text-align:center;font-size:13px;font-weight:600;color:#5d6675;text-decoration:underline;text-underline-offset:3px}
.pk-one{background:#172538;border-color:#172538;color:#fff}
.pk-one .pk-kim,.pk-one .pk-fatura,.pk-one .pk-tutar small,.pk-one .pk-satin{color:#b9c3d6}
.pk-one .pk-koltuklar{color:#8fb0ff}
.pk-one .pk-dugme{background:#fff;border-color:#fff;color:#172538}
.pk-one .pk-dugme:hover,.pk-one .pk-dugme:focus-visible{background:#c8d6ff;border-color:#c8d6ff;color:#172538}
.pk-hepsi{display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;padding:0;list-style:none;font-size:14px;color:#5d6675}
.pk-hepsi li:not(:first-child)::before{content:"✓";color:#214ee8;font-weight:700;margin-right:6px}
.pk-hepsi strong{color:#172538}
.pk-hepsi + * {margin-top:0}
@media (max-width:900px){.pk-izgara{grid-template-columns:1fr}.pk-kim,.pk-fatura{min-height:0}}

/* Paket kartları, banknot / üyelik kartı işçiliği: gravür deseni + kabartma rakam + varak parıltısı.
   Mahalle: çelik mavisi kâğıt. Dükkân: lacivert + pirinç. Salon: siyah + hologram. */
.pk-kart{position:relative;isolation:isolate;border:0;border-radius:18px;background-repeat:no-repeat;background-size:cover;background-position:center;box-shadow:0 1px 0 #ffffff inset,0 18px 40px -24px #17253859}
.pk-kart>*{position:relative;z-index:1}
.pk-kart::after{content:"";position:absolute;inset:7px;border-radius:13px;pointer-events:none;z-index:0}

.pk-mahalle{background-color:#e7edf8;color:#172538}
.pk-mahalle::after{border:1px solid #b9c8e6}
.pk-mahalle .pk-kim,.pk-mahalle .pk-fatura,.pk-mahalle .pk-tutar small,.pk-mahalle .pk-satin{color:#4b5a74}
.pk-mahalle .pk-koltuk strong{background:#ffffffb3;color:#214ee8}

.pk-dukkan{background-color:#172538;color:#fff}
.pk-dukkan::after{border:1px solid #b8964f73}
.pk-dukkan .pk-etiket{background:linear-gradient(135deg,#f3dfa7,#c9a45c);color:#172538}
.pk-dukkan .pk-koltuk strong{background:#c9a45c26;color:#f3dfa7}
.pk-dukkan .pk-dugme{background:linear-gradient(135deg,#f3dfa7,#c9a45c);border-color:#c9a45c;color:#172538}
.pk-dukkan .pk-dugme:hover,.pk-dukkan .pk-dugme:focus-visible{background:#f3dfa7;border-color:#f3dfa7;color:#172538}

.pk-salon{background-color:#0d131e;color:#fff}
.pk-salon::after{border:1px solid #ffffff1f}
.pk-salon .pk-kim,.pk-salon .pk-fatura,.pk-salon .pk-tutar small,.pk-salon .pk-satin{color:#aab4c6}
.pk-salon .pk-koltuk strong{background:#ffffff14;color:#d9e2ff}
.pk-salon .pk-dugme{border-color:#ffffff59;color:#fff}
.pk-salon .pk-dugme:hover,.pk-salon .pk-dugme:focus-visible{background:#fff;color:#0d131e}
.pk-one{background-color:#172538}
/* İç sayfaların (ic-ferah) genel yazı renkleri paket kartlarını ezmesin */
html body.marka-berber[class] .paket-secim .pk-izgara .pk-mahalle :is(h3,.pk-tutar){color:#172538}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-mahalle :is(.pk-kim,.pk-fatura,.pk-satin){color:#4b5a74}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-mahalle .pk-koltuk strong{color:#214ee8}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) :is(h3,.pk-tutar){color:#fff}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-dukkan :is(.pk-kim,.pk-fatura,.pk-satin){color:#b9c3d6}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-dukkan .pk-koltuk strong{color:#f3dfa7}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-salon :is(.pk-kim,.pk-fatura,.pk-satin){color:#aab4c6}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-salon .pk-koltuk strong{color:#d9e2ff}
.pk-koltuk{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
/* Paket kartı özellik listesi: işaret rengi paketin rengi; üst paketteki ilk satır "…deki her şey" kalın */
.pk-ozellik{list-style:none;margin:0 0 26px;padding:0;display:grid;font-size:14.5px;line-height:1.45}
.pk-ozellik li{display:flex;gap:10px;padding:10px 0;border-top:1px solid #17253814}
.pk-ozellik li:first-child{border-top:0;padding-top:0}
.pk-ozellik li::before{content:"";flex:none;width:16px;height:16px;margin-top:1px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat}
.pk-ozellik .pk-ozellik-ust{font-weight:700}
.pk-mahalle .pk-ozellik li::before{color:#214ee8}
.pk-dukkan .pk-ozellik li{border-top-color:#ffffff14}
.pk-dukkan .pk-ozellik li::before{color:#c9a45c}
.pk-salon .pk-ozellik li{border-top-color:#ffffff14}
.pk-salon .pk-ozellik li::before{color:#b59cff}
html body.marka-berber[class] .paket-secim .pk-izgara .pk-mahalle .pk-ozellik li{color:#172538}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-ozellik li{color:#e6ebf5}
.pk-kart .pk-fiyat{margin-bottom:22px}
/* Paket kartı arka ışığı: eski dalga çizgilerinin renkleri, kartın alt kısmında çok bulanık iki katman.
   Lekeler yayvan ve iç içe (daire gibi durmasın); iki katman farklı hız ve yönde gezer, birleşince doğal akar.
   Radyal geçişlerle (filtre yok), sadece transform hareket eder. */
.pk-kart{overflow:hidden}
.pk-kart::before,.pk-kart .pk-isik{content:"";position:absolute;z-index:0;left:-40%;right:-40%;bottom:-25%;height:125%;pointer-events:none;will-change:transform}
.pk-kart::before{animation:pk-isik-a 11s cubic-bezier(.45,.05,.55,.95) infinite}
.pk-kart .pk-isik{animation:pk-isik-b 17s cubic-bezier(.45,.05,.55,.95) infinite}
.pk-mahalle::before{background:radial-gradient(60% 34% at 30% 68%,#9fb3d9a6,#9fb3d900 75%),radial-gradient(45% 30% at 70% 40%,#b9c8e6b3,#b9c8e600 75%)}
.pk-mahalle .pk-isik{background:radial-gradient(55% 30% at 55% 75%,#a9bfff8c,#a9bfff00 75%),radial-gradient(40% 28% at 20% 30%,#c8d6ff99,#c8d6ff00 75%)}
.pk-dukkan::before{background:radial-gradient(60% 34% at 30% 68%,#b8964f66,#b8964f00 75%),radial-gradient(45% 30% at 70% 40%,#8a734273,#8a734200 75%)}
.pk-dukkan .pk-isik{background:radial-gradient(55% 30% at 55% 75%,#f3dfa733,#f3dfa700 75%),radial-gradient(40% 28% at 20% 30%,#c9a45c4d,#c9a45c00 75%)}
.pk-salon::before{background:radial-gradient(55% 32% at 28% 68%,#7fd3ff4d,#7fd3ff00 75%),radial-gradient(45% 30% at 68% 40%,#ff9ad540,#ff9ad500 75%)}
.pk-salon .pk-isik{background:radial-gradient(55% 30% at 50% 75%,#b59cff59,#b59cff00 75%),radial-gradient(40% 28% at 82% 30%,#ffe08a38,#ffe08a00 75%)}
@keyframes pk-isik-a{0%,100%{transform:translate(-14%,4%) scaleX(1)}25%{transform:translate(2%,-6%) scaleX(1.15)}50%{transform:translate(16%,2%) scaleX(.95)}75%{transform:translate(-2%,-3%) scaleX(1.1)}}
@keyframes pk-isik-b{0%,100%{transform:translate(12%,-2%) scaleX(1.1)}33%{transform:translate(-10%,5%) scaleX(.9)}66%{transform:translate(4%,-7%) scaleX(1.2)}}
.pk-dukkan::before{animation-delay:-4s}.pk-dukkan .pk-isik{animation-delay:-9s}
.pk-salon::before{animation-delay:-7s}.pk-salon .pk-isik{animation-delay:-3s}
@media (prefers-reduced-motion:reduce){.pk-kart::before,.pk-kart .pk-isik{animation:none}}
/* Paket kartı düğmeleri: normalde şeffaf, üstüne gelince kartın koltuk yazısının rengi */
html body.marka-berber .paket-secim .pk-kart .pk-dugme{transition:background .25s,border-color .25s,color .25s,box-shadow .25s}
/* Normal halde üçü de Salon'daki gibi şeffaf ve silik çerçeveli */
html body.marka-berber .paket-secim .pk-kart .pk-dugme{background:transparent;border-color:#ffffff59;color:#fff;box-shadow:none}
html body.marka-berber .paket-secim .pk-mahalle .pk-dugme{border-color:#17253840;color:#172538}
html body.marka-berber .paket-secim .pk-kart .pk-dugme:is(:hover,:focus-visible){outline:none;box-shadow:0 8px 20px -12px #17253859}
/* Üstüne gelince her düğme kendi kartındaki koltuk yazısının rengini alır */
html body.marka-berber .paket-secim .pk-mahalle .pk-dugme:is(:hover,:focus-visible){background:#214ee8;border-color:#214ee8;color:#fff}
html body.marka-berber .paket-secim .pk-dukkan .pk-dugme:is(:hover,:focus-visible){background:#f3dfa7;border-color:#f3dfa7;color:#172538}
html body.marka-berber .paket-secim .pk-salon .pk-dugme:is(:hover,:focus-visible){background:#d9e2ff;border-color:#d9e2ff;color:#0d131e}
/* Tek tip deneme: Dükkân ve Salon da Mahalle gibi (açık çelik mavisi). Geri almak için bu bloğu sil. */
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon){background-color:#e7edf8;color:#172538}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon)::after{border-color:#b9c8e6}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) :is(h3,.pk-tutar){color:#172538}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) :is(.pk-kim,.pk-fatura,.pk-satin,.pk-tutar small){color:#4b5a74}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-koltuk strong{background:#ffffffb3;color:#214ee8}
html body.marka-berber .paket-secim .pk-izgara .pk-dukkan .pk-etiket{background:#214ee8;color:#fff}
html body.marka-berber[class] .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-ozellik li{color:#172538;border-top-color:#17253814}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-ozellik li::before{color:#214ee8}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-dugme{border-color:#17253840;color:#172538}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-dugme:is(:hover,:focus-visible){background:#214ee8;border-color:#214ee8;color:#fff}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon)::before{background:radial-gradient(60% 34% at 30% 68%,#9fb3d9a6,#9fb3d900 75%),radial-gradient(45% 30% at 70% 40%,#b9c8e6b3,#b9c8e600 75%)}
html body.marka-berber .paket-secim .pk-izgara :is(.pk-dukkan,.pk-salon) .pk-isik{background:radial-gradient(55% 30% at 55% 75%,#a9bfff8c,#a9bfff00 75%),radial-gradient(40% 28% at 20% 30%,#c8d6ff99,#c8d6ff00 75%)}
.pk-tutar .pk-kurus{font-size:.5em;letter-spacing:-.02em;margin-left:1px;vertical-align:.62em;color:inherit}
.pk-fatura .pk-indirim{display:inline-block;margin-right:6px;padding:1px 8px;border-radius:999px;background:#214ee8;color:#fff;font-size:11px;font-weight:700;letter-spacing:.02em;vertical-align:1px}
/* İç sayfalardaki (Fiyatlandırma, Özellikler) özellik kartları da ana sayfadakiyle aynı: sıra fişi, açık mavi ikon kutusu */
body.marka-berber[class] .kartlar[data-derinlik] .kart::after{display:block}
body.marka-berber[class] .kartlar[data-derinlik] .kart .ikon{width:48px;height:48px;display:grid;place-items:center;border-radius:12px;color:#214ee8;background:#eaf0fd;margin-bottom:40px}
body.marka-berber[class] .kartlar[data-derinlik] .kart .ikon svg{width:25px;height:25px}
body.marka-berber[class] .kartlar[data-derinlik] .kart.kd-icinde .ikon{background:#214ee8;color:#fff}
/* Özellikler sayfası: ana sayfadaki iPhone çerçeveli ekran görüntüleri; CSS çerçevesi kapalı */
body.marka-berber[class] .detay-gorsel img.cerceveli{border:0;border-radius:0;box-shadow:none;height:auto;width:230px;max-width:100%;filter:drop-shadow(0 18px 24px #1725381f)}
/* SSS: sakin açılıp kapanma (sss-akis.js). Artı işareti dönerek çarpıya döner, eski ani içerik animasyonu kapalı. */
body.marka-berber .sss details{box-sizing:border-box}
body.marka-berber .sss details p{animation:none}
body.marka-berber .sss summary{cursor:pointer}
body.marka-berber .sss summary::after{content:"+";transform:none;transition:transform .46s cubic-bezier(.22,.8,.24,1),color .3s}
body.marka-berber .sss details[open]:not(.kapaniyor) summary::after{content:"+";transform:rotate(45deg);color:#214ee8}
/* Hakkımızda: 4 kart, 3 sütunda biri tek kalmasın diye 2x2 */
body.marka-berber.sayfa-hakkimizda .kartlar[data-derinlik]{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:700px){body.marka-berber.sayfa-hakkimizda .kartlar[data-derinlik]{grid-template-columns:1fr}}
/* Fiyat slot sayacı: her rakam kendi penceresinde dikey şeritte kayar; pencerenin alt-üst kenarı hafifçe solar */
.pk-sayac{display:inline-flex;align-items:baseline}
.pk-sayac .sl{display:inline-block;height:1em;line-height:1em;overflow:hidden;vertical-align:top;-webkit-mask:linear-gradient(#0000,#000 14%,#000 86%,#0000);mask:linear-gradient(#0000,#000 14%,#000 86%,#0000)}
.pk-sayac .sl-serit{display:flex;flex-direction:column;will-change:transform}
.pk-sayac .sl-serit span{display:block;height:1em;line-height:1em;text-align:center}
.pk-sayac .pk-kurus{display:inline-flex;align-items:baseline}
.pk-tutar{line-height:1}
.pk-tutar .pk-sayac span{min-width:0}
.pk-tutar .pk-sayac{white-space:nowrap}
/* Özellikler, "Üç rol": solda rol sekmeleri, sağda seçili rolün telefon ekranı ve yapabildikleri */
.rol-secici{display:grid;grid-template-columns:minmax(0,320px) minmax(0,1fr);gap:28px;align-items:stretch}
.rs-sekmeler{display:grid;gap:10px;align-content:start}
.rs-sekme{display:grid;gap:4px;text-align:left;padding:20px 22px;border:1px solid #dfe5ed;border-radius:14px;background:#fff;color:#172538;font:inherit;cursor:pointer;transition:background-color .3s,border-color .3s,color .3s,transform .3s}
.rs-sekme strong{font-size:19px;font-weight:600;letter-spacing:-.02em}
.rs-sekme span{font-size:14px;color:#5d6675;transition:color .3s}
.rs-sekme:hover{border-color:#b9c8e6;transform:translateX(3px)}
.rs-sekme[aria-selected=true]{background:#172538;border-color:#172538;color:#fff;transform:none}
.rs-sekme[aria-selected=true] span{color:#b9c3d6}
.rs-sekme:focus-visible{outline:2px solid #214ee8;outline-offset:2px}
.rs-sahne{position:relative;border-radius:20px;background:#edf1f9;padding:34px 38px;min-height:520px;overflow:hidden}
.rs-sahne::before{content:"";position:absolute;inset:auto -10% -45% 30%;height:80%;background:radial-gradient(50% 50% at 50% 50%,#c8d6ff,#c8d6ff00 70%);pointer-events:none}
.rs-panel{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:40px;align-items:center}
.rs-panel[hidden]{display:none}
.rs-telefon{width:220px;max-width:100%;height:auto;filter:drop-shadow(0 22px 28px #17253826)}
.rs-liste h3{margin:0 0 16px;font-size:22px;font-weight:600;letter-spacing:-.03em;color:#172538}
.rs-liste ul{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.rs-liste li{display:flex;gap:10px;padding:8px 0;font-size:15px;line-height:1.45;color:#22302a;border-bottom:1px solid #17253810}
.rs-liste li::before{content:"";flex:none;width:16px;height:16px;margin-top:2px;background:#214ee8;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7'/%3E%3C/svg%3E") center/contain no-repeat}
@media (max-width:900px){
  .rol-secici{grid-template-columns:1fr}
  .rs-sekmeler{grid-auto-flow:column;grid-auto-columns:minmax(150px,1fr);overflow-x:auto;padding-bottom:4px}
  .rs-sekme span{display:none}
  .rs-sahne{padding:24px 20px;min-height:0}
  .rs-panel{grid-template-columns:1fr;justify-items:center;gap:24px}
  .rs-telefon{width:190px}
  .rs-liste{width:100%}
}
@media (prefers-reduced-motion:reduce){.rs-sekme{transition:none}}
/* İç sayfa yazı renkleri rol sekmelerini ezmesin */
html body.marka-berber[class] .rol-secici .rs-sekme strong{color:#172538}
html body.marka-berber[class] .rol-secici .rs-sekme span{color:#5d6675}
html body.marka-berber[class] .rol-secici .rs-sekme[aria-selected=true] strong{color:#fff}
html body.marka-berber[class] .rol-secici .rs-sekme[aria-selected=true] span{color:#b9c3d6}
html body.marka-berber[class] .rol-secici .rs-liste li{color:#22302a}
@media (max-width:900px){.rs-sekmeler{grid-auto-columns:minmax(0,1fr);overflow:visible}.rs-sekme{padding:14px 10px;text-align:center}.rs-sekme strong{font-size:15px}}
/* Giriş ekranı yenilemesi (Timurial karşılaştırmasından): başlıkta mavi ikinci satır, ana düğme ücretsiz deneme,
   havada duran hap menü (geniş ekranda), sabit WhatsApp düğmesi */
body.marka-berber[class] .app-intro h1 .h1-vurgu{color:#214ee8}
body.marka-berber .app-actions .btn-ana{background:#214ee8;border-color:#214ee8;color:#fff;box-shadow:0 12px 26px -12px #214ee8a6}
body.marka-berber .app-actions .btn-ana:hover{background:#1b41c4;border-color:#1b41c4}
body.marka-berber .app-indir{display:flex;flex-wrap:wrap;gap:6px 22px}
@media (min-width:901px){
  /* Üst menü: düz bağlantılar, efektsiz. Aşağı inince menü tam genişlikte buzlu bir şeride döner (nav-hareket.js) */
  body.marka-berber .ust{position:sticky;top:0;z-index:50;background:#f7f7f300;border:0;border-bottom:1px solid #17253800;backdrop-filter:none;-webkit-backdrop-filter:none;transition:background-color .35s,border-color .35s}
  body.marka-berber .ust.ust-yuzer{background:#f7f7f3a6;border-bottom-color:#17253814;backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5)}
  body.marka-berber .ust .ust-ic{height:80px}
  body.marka-berber .ust .menu{margin-inline:auto;gap:30px}
  body.marka-berber .ust .menu > a:not(.btn){padding:8px 0;color:#5d6675;font-weight:500}
  html body.marka-berber[class] .ust .menu > a:not(.btn):is(:hover,:focus-visible,.secili){color:#172538}
  body.marka-berber .ust :is(.ust-kayit,.ust-giris){white-space:nowrap}
  body.marka-berber .ust .ust-kayit{order:3;background:#172538;border-color:#172538;color:#fff;border-radius:999px;padding:11px 20px;box-shadow:0 10px 20px -10px #17253899}
  body.marka-berber .ust .ust-giris{order:2;background:transparent;border-color:transparent;color:#172538;border-radius:999px}
  body.marka-berber .ust .ust-giris:hover{background:#17253810}
}
.wa-dugme{position:fixed;z-index:60;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 14px 28px -10px #128c7e99;transition:transform .25s}
.wa-dugme svg{width:30px;height:30px}
.wa-dugme:hover{transform:scale(1.06)}
@media (max-width:600px){.wa-dugme{width:52px;height:52px}.wa-dugme svg{width:27px;height:27px}}
html body.marka-berber[class] .app-actions .btn.btn-ana{background:#214ee8;border-color:#214ee8;color:#fff;box-shadow:0 12px 26px -12px #214ee8a6}
html body.marka-berber[class] .app-actions .btn.btn-ana:hover{background:#1b41c4;border-color:#1b41c4}
@media (max-width:600px){html body.marka-berber[class] .app-actions{display:grid;grid-template-columns:1fr;gap:10px}html body.marka-berber[class] .app-actions .btn{justify-content:center;width:100%}}
/* Hap menüde "Uygulamaya geç": hover'da yazı beyaza dönüp kaybolmasın */
@media (min-width:901px){html body.marka-berber[class] .ust .ust-giris:is(:hover,:focus-visible){background:#1725380f;border-color:transparent;color:#172538;box-shadow:none}}
/* Düğme çerçeveleri: bütün düğmeler 4px, neredeyse keskin köşeli; ikincil düğmede gri çizgi yerine
   beyaz dolgu, çok ince kenar ve yumuşak gölge. */
html body.marka-berber[class] :is(.btn,.btn-kucuk,.ust-kayit,.ust-giris,.pk-dugme){border-radius:4px}
html body.marka-berber[class] .app-actions .btn{padding-inline:28px}
html body.marka-berber[class] .app-actions .btn.btn-cizgi{background:#fff;border-color:#1725380f;color:#172538;box-shadow:0 1px 2px #1725380d,0 8px 20px -12px #17253840}
html body.marka-berber[class] .app-actions .btn.btn-cizgi:is(:hover,:focus-visible){background:#fff;border-color:#17253824;color:#172538;box-shadow:0 1px 2px #1725380d,0 12px 24px -12px #17253859}
html body.marka-berber[class] .app-actions .btn.btn-ana{border-color:transparent;box-shadow:inset 0 1px 0 #ffffff33,0 12px 26px -12px #214ee8a6}
@media (prefers-reduced-motion:reduce){body.marka-berber .ust{transition:none}}
/* Tabela düğmeler (sitenin tüm düğmeleri): kalın lacivert kenar, arkasında sert gölge.
   Üstüne gelince kalkar, basınca gölgenin içine oturur. Dolu düğme mavi, çizgili olan beyaz. Menüdeki "Uygulamaya geç" yazı bağlantısı olarak kalır. */
html body.marka-berber[class] :is(.btn.btn.btn:not(.ust-giris),.paket-secim .pk-kart .pk-dugme){border:1.5px solid #172538;border-radius:6px;box-shadow:3px 3px 0 #172538;transform:none;transition:transform .15s,box-shadow .15s,background-color .2s,color .2s}
html body.marka-berber[class] :is(.btn.btn.btn:not(.ust-giris),.paket-secim .pk-kart .pk-dugme):is(:hover,:focus-visible){transform:translate(-1.5px,-1.5px);box-shadow:4.5px 4.5px 0 #172538}
html body.marka-berber[class] :is(.btn.btn.btn:not(.ust-giris),.paket-secim .pk-kart .pk-dugme):active{transform:translate(3px,3px);box-shadow:0 0 0 #172538;transition-duration:.06s}
html body.marka-berber[class] .btn.btn.btn:not(.ust-giris,.btn-cizgi,.btn-google),html body.marka-berber[class] .btn.btn.btn:not(.ust-giris,.btn-cizgi,.btn-google):is(:hover,:focus-visible,:active){background:#214ee8;color:#fff}
html body.marka-berber[class] :is(.btn.btn.btn:is(.btn-cizgi,.btn-google),.paket-secim .pk-kart .pk-dugme),html body.marka-berber[class] :is(.btn.btn.btn:is(.btn-cizgi,.btn-google),.paket-secim .pk-kart .pk-dugme):is(:hover,:focus-visible,:active){background:#fff;color:#172538}
/* Mavi çağrı kutusunda (iç sayfalar) dolu düğme beyaz olsun, maviye karışmasın */
html body.marka-berber.ic-ferah[class] .cagri .btn.btn.btn:not(.btn-cizgi),html body.marka-berber.ic-ferah[class] .cagri .btn.btn.btn:not(.btn-cizgi):is(:hover,:focus-visible,:active){background:#fff;color:#172538}
html body.marka-berber[class] .btn.btn.btn-kucuk:not(.ust-giris){box-shadow:2px 2px 0 #172538}
html body.marka-berber[class] .btn.btn.btn-kucuk:not(.ust-giris):is(:hover,:focus-visible){box-shadow:3.5px 3.5px 0 #172538}
html body.marka-berber[class] .btn.btn.btn-kucuk:not(.ust-giris):active{box-shadow:0 0 0 #172538}
@media (prefers-reduced-motion:reduce){html body.marka-berber[class] :is(.btn.btn.btn:not(.ust-giris),.paket-secim .pk-kart .pk-dugme){transition:none}}
/* Deneme: hero'da gerçek dükkân fotoğrafları, önünde tek telefon ve bir bildirim. Senaryolar sırayla döner (hero-foto.js);
   geçişler yalnızca opacity ve transform. */
.hero-foto{position:relative;margin:40px 0 64px;height:600px}
.hf-sahne{position:absolute;inset:0;pointer-events:none}
.hf-sahne.acik{pointer-events:auto}
.hero-foto .hf-zemin{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:38% 50%;border-radius:22px;display:block;opacity:0;transition:opacity .9s ease}
.hero-foto .hf-tel{position:absolute;right:5%;bottom:-40px;width:250px;height:auto;filter:drop-shadow(0 30px 40px #0b142680);opacity:0;transform:translateY(24px);transition:opacity .6s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.hero-foto .hf-bildirim{position:absolute;left:-28px;top:16%;display:flex;gap:12px;align-items:flex-start;padding:14px 18px 14px 14px;background:#fff;border-radius:12px;box-shadow:0 18px 40px -16px #17253866,0 0 0 1px #1725380f;font:500 13px/1.35 Manrope,system-ui,sans-serif;color:#5d6675;opacity:0;transform:translateY(10px) scale(.96);transform-origin:left center;transition:opacity .4s ease,transform .5s cubic-bezier(.2,.8,.2,1)}
.hf-sahne.acik .hf-zemin{opacity:1}
.hf-sahne.acik .hf-tel{opacity:1;transform:none;transition-delay:.15s}
.hf-sahne.acik .hf-bildirim{opacity:1;transform:none;transition-delay:.55s}
.hero-foto .hf-bildirim i{flex:none;width:34px;height:34px;border-radius:9px;background:#214ee8 center/18px no-repeat}
.hf-ikon-takvim{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='15' rx='2'/%3E%3Cpath d='M8 3v4M16 3v4M4 10h16'/%3E%3C/svg%3E")!important}
.hf-ikon-kisi{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='10' cy='8' r='4'/%3E%3Cpath d='M3 20c0-4 3-6 7-6s7 2 7 6M16 11l2 2 4-4'/%3E%3C/svg%3E")!important}
.hf-ikon-saat{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8.5'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E")!important}
.hf-ikon-kasa{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='6' width='18' height='13' rx='2'/%3E%3Cpath d='M3 10h18M7 15h3'/%3E%3C/svg%3E")!important}
.hero-foto .hf-bildirim div{display:grid}
.hero-foto .hf-bildirim b{color:#172538;font-weight:700;font-size:14px}
.hero-foto .hf-bildirim span{color:#172538}
.hf-cizgiler{position:absolute;left:24px;bottom:22px;display:flex;gap:6px;z-index:2}
.hf-cizgiler button{width:34px;height:20px;padding:0;border:0;background:none;cursor:pointer;display:grid;align-items:center}
.hf-cizgiler span{display:block;height:3px;border-radius:2px;background:#ffffff59;overflow:hidden;position:relative}
.hf-cizgiler span::after{content:"";position:absolute;inset:0;background:#fff;transform:scaleX(0);transform-origin:left}
.hf-cizgiler button.gecti span::after{transform:scaleX(1)}
.hf-cizgiler button[aria-current] span::after{animation:hf-dolum var(--hf-sure,6s) linear forwards}
.hero-foto.durdu .hf-cizgiler button[aria-current] span::after{animation-play-state:paused}
@keyframes hf-dolum{to{transform:scaleX(1)}}
@media (max-width:900px){.hero-foto{order:-1;height:380px;margin:16px 0 40px}.hero-foto .hf-tel{width:150px;bottom:-24px}.hero-foto .hf-bildirim{left:12px;top:12px;padding:10px 14px 10px 10px}.hf-cizgiler{left:14px;bottom:14px}}
@media (prefers-reduced-motion:reduce){.hero-foto *{transition:none!important}.hf-cizgiler button[aria-current] span::after{animation:none;transform:scaleX(1)}}
/* Ana sayfa "üç adım": sıra fişi makinesi. Fişler makinenin ağzından aşağı basılır ve hafif eğik sarkar (sira-fis.js).
   Hareket yalnızca transform ve opacity. */
.fis{margin-top:44px}
.fis-makine{position:relative;z-index:2;display:flex;align-items:center;gap:18px;padding:16px 18px 16px 24px;background:#172538;border-radius:16px 16px 8px 8px;box-shadow:0 18px 30px -22px #172538}
.fis-makine::after{content:"";position:absolute;left:16px;right:16px;bottom:-5px;height:10px;border-radius:6px;background:#0b121c;box-shadow:inset 0 3px 4px #000a}
.fis-marka{font:500 15px Manrope,system-ui,sans-serif;color:#b9c3d6;letter-spacing:.02em}
.fis-marka b{color:#fff;font-weight:800}
.fis-ekran{margin-left:auto;display:flex;align-items:baseline;gap:10px;padding:8px 16px;border-radius:8px;background:#0b121c;box-shadow:inset 0 0 0 1px #ffffff14}
.fis-ekran small{font:700 10px Manrope,system-ui,sans-serif;letter-spacing:.16em;color:#ff6b6b99}
.fis-ekran b{font:800 26px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.08em;color:#ff5a5a;text-shadow:0 0 12px #ff3b3b99;min-width:2ch;text-align:right}
.fis-ekran.yandi b{animation:fis-yan .5s ease}
@keyframes fis-yan{0%,40%{opacity:.25}100%{opacity:1}}
html body.marka-berber[class] .fis-al{font:700 14px Manrope,system-ui,sans-serif;color:#fff;background:#d23b3b;border:0;border-radius:999px;width:58px;height:58px;cursor:pointer;box-shadow:inset 0 -4px 0 #0003,0 6px 14px -6px #d23b3bcc;transition:transform .12s}
html body.marka-berber[class] .fis-al:hover{transform:translateY(-1px)}
html body.marka-berber[class] .fis-al:active{transform:translateY(2px);box-shadow:inset 0 -1px 0 #0003}
.fis-dizi{list-style:none;margin:0;padding:0 34px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;clip-path:inset(0 -60px -90px -60px)}
.fis-dizi > li{transform:rotate(var(--r));transform-origin:50% 0;filter:drop-shadow(0 14px 14px #17253824);transition:transform 1s cubic-bezier(.3,.75,.2,1)}
.fis-dizi > li:hover{transform:rotate(calc(var(--r) * -1))}
.fis-kagit{display:flex;flex-direction:column;gap:6px;padding:22px 20px 30px;background:#fffefa;color:#172538;-webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 8px repeat-x;mask:linear-gradient(#000 0 0) top/100% calc(100% - 8px) no-repeat,conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/14px 8px repeat-x}
.fis-ust{font:700 10.5px Manrope,system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#8a94a3;padding-bottom:12px;border-bottom:1.5px dashed #17253829}
.fis-no{margin-top:10px;font:800 40px/1 Manrope,system-ui,sans-serif;letter-spacing:-.03em;color:#172538}
html body.marka-berber[class] .fis-kagit h3{margin:6px 0 0;font-size:18px;font-weight:700;letter-spacing:-.02em;color:#172538}
html body.marka-berber[class] .fis-kagit p{margin:0;font-size:14px;line-height:1.55;color:#5d6675}
.fis-alt{margin-top:auto;padding-top:14px;border-top:1.5px dashed #17253829;font:600 12px Manrope,system-ui,sans-serif;color:#8a94a3}
.fis-son .fis-kagit{background:#214ee8}
html body.marka-berber[class] .fis-son :is(.fis-no,h3){color:#fff}
.fis-son .fis-no{font-size:34px}
html body.marka-berber[class] .fis-son p{color:#dbe4ff}
.fis-son :is(.fis-ust,.fis-alt){color:#c5d3ff;border-color:#ffffff40}
/* Basılma: JS "bekliyor" ekler, her fiş sırası gelince "basildi" olur */
.fis.bekliyor .fis-dizi > li:not(.basildi){transform:translateY(-112%);transition-duration:.35s}
@media (max-width:900px){
  .fis-dizi{grid-template-columns:repeat(2,minmax(0,1fr));padding:0 14px;gap:18px}
  .fis.bekliyor .fis-dizi > li:not(.basildi){transform:translateY(-24px);opacity:0}
  .fis-dizi > li{transition:transform .7s cubic-bezier(.3,.75,.2,1),opacity .4s ease}
  .fis-makine{padding:12px 12px 12px 18px;gap:12px}.fis-ekran b{font-size:22px}
  html body.marka-berber[class] .fis-al{width:50px;height:50px;font-size:12.5px}
}
@media (max-width:520px){.fis-dizi{grid-template-columns:1fr;padding:0 10px}.fis-dizi > li{max-width:340px}}
@media (prefers-reduced-motion:reduce){.fis-dizi > li{transition:none}}
/* Telefonda uzun bölümler yana kaydırılır: özellik kartları, sıra fişleri, paket kartları.
   Kartlar ekran kenarına kadar taşar, sıradakinin kenarı görünür. Bilgisayar görünümü aynı. */
@media (max-width:760px){
  html body.marka-berber[class] :is(.kartlar,.fis-dizi,.pk-izgara){display:flex;gap:14px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;margin-inline:calc(50% - 50vw);padding-inline:18px;scroll-padding-inline:18px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  html body.marka-berber[class] :is(.kartlar,.fis-dizi,.pk-izgara)::-webkit-scrollbar{display:none}
  html body.marka-berber[class] :is(.kartlar,.fis-dizi,.pk-izgara) > *{flex:0 0 82%;scroll-snap-align:start}
  html body.marka-berber[class] .kartlar{border:0;border-radius:0;overflow-y:hidden;padding-bottom:6px}
  html body.marka-berber[class] .kartlar > .kart{border:1px solid #dce3d5;border-radius:14px;margin:0}
  html body.marka-berber[class] .fis-dizi{clip-path:none;padding-top:4px;padding-bottom:34px;position:relative}
  html body.marka-berber[class] .fis-dizi > li{max-width:none;flex-basis:78%}
  html body.marka-berber[class] .fis .fis-dizi > li{opacity:1;transform:rotate(var(--r))}
  html body.marka-berber[class] .pk-izgara{position:relative;align-items:stretch;padding-top:14px;padding-bottom:10px}
  html body.marka-berber[class] .pk-izgara > *{flex-basis:84%;scroll-snap-align:center}
}