@media(max-width:760px){
}
@media(prefers-reduced-motion:reduce){.personalized-intro-media{animation:none}.personalized-tool img,.personalized-tool-copy svg{transition:none}.personalized-tool:hover img{transform:none}.personalized-tool:hover .personalized-tool-copy svg{transform:none}}
.personalized-tool-page{
  --pt-bg:#1a1612;
  --pt-surface:#211c17;
  --pt-surface-raised:#2a241d;
  --pt-line:rgba(255,255,255,.13);
  --pt-muted:rgba(255,255,255,.64);
  /* TOKEN CAKISMASI COZULDU. Bu satir #ffb066 (turuncu) idi; atelier.css:38
     ise ayni tokeni var(--ea-accent) yani #d9c08f (sampanya) yapiyordu.
     Hangisinin kazandigi YUKLEME SIRASINA bagliydi:
       kisiye-ozel.php  yalniz personalized.css yukluyor  -> TURUNCU
       isim-kolye/cizim/harita/gokyuzu  atelier.css de var -> SAMPANYA
     Yani ayni marka ogesi sayfadan sayfaya renk degistiriyordu. Ayrica ayni
     ekranda iki aksan birden gorunuyordu (urun.php:165 turuncu fiyat +
     urun.php:295 sampanya). Tek aksan kurali: sampanya.
     var() zinciri: atelier.css yukluyse onun degeri, degilse yedek. */
  --pt-accent:var(--ea-accent,#d9c08f);
  --pt-radius:20px;
  --pt-radius-lg:26px;
  --pt-shadow:0 24px 70px -36px rgba(0,0,0,.82);
  background:var(--pt-bg);
}
.personalized-tool-page .cz-builder-card{border-color:var(--pt-line);box-shadow:var(--pt-shadow),inset 0 1px 1px rgba(255,255,255,.1)!important}
.personalized-tool-page .cz-stagebox,.personalized-tool-page .hr-map-card{border:1px solid rgba(255,255,255,.1);border-radius:var(--pt-radius);box-shadow:var(--pt-shadow),inset 0 1px 1px rgba(255,255,255,.1)}
/* 42px -> 44px. Bu kural .cz-pill'den daha ozgul oldugu icin atelier.css'teki
   44px tabani SESSIZCE eziyordu: dort aracin da hap dugmeleri 42px'te
   kaliyor, WCAG 2.5.5 / Apple HIG'in 44px esiginin altina dusuyordu.
   cizim.css'te bunu duzelttigini soyleyen bir yorum vardi ama olcum 42
   gosteriyor — dolayisiyla o duzeltme hic yururlukte olmamis. */
.personalized-tool-page .cz-pill,.personalized-tool-page .gk-tab,.personalized-tool-page .gk-sign{min-height:44px;border:1px solid transparent}
.personalized-tool-page .cz-pill:focus-visible,.personalized-tool-page .gk-tab:focus-visible,.personalized-tool-page .gk-sign:focus-visible{outline:2px solid var(--pt-accent);outline-offset:3px}
.personalized-tool-page .cz-input,.personalized-tool-page .gk-select,.personalized-tool-page .hr-search-input{border-color:var(--pt-line);border-radius:12px;min-height:48px}
.personalized-tool-page .cz-input:focus,.personalized-tool-page .gk-select:focus,.personalized-tool-page .hr-search-input:focus{border-color:rgba(217,192,143,.7);box-shadow:0 0 0 3px rgba(217,192,143,.12)}
.personalized-tool-page [data-cz-stagebox]{perspective:1000px}
.personalized-tool-page [data-cz-stagebox].is-pointer-lit::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px 220px at var(--pointer-x,50%) var(--pointer-y,35%),rgba(255,255,255,.11),transparent 72%);mix-blend-mode:screen;opacity:.75}
.personalized-tool-page [data-cz-stagebox]>.cz-silver{transform:rotateX(var(--preview-y,0deg)) rotateY(var(--preview-x,0deg));transition:transform .35s cubic-bezier(.16,1,.3,1)}
.personalized-tool-page [data-cz-stagebox]>.cz-silver.is-active{will-change:transform}
.personalized-tool-page [data-cz-teklif] input,.personalized-tool-page [data-cz-teklif] textarea{min-height:48px}
.personalized-tool-page [data-cz-teklif] button[type=submit]{min-height:52px;box-shadow:0 14px 30px -18px rgba(255,255,255,.8)}
.personalized-tool-page .cz-stagebox-empty{padding:28px;line-height:1.55;color:var(--pt-muted)}
.personalized-mobile-toolbar{display:none}
.personalized-mobile-toolbar-tab{border:0;background:transparent;color:rgba(255,255,255,.62);font:500 12px/1 'Barlow',sans-serif;min-height:40px;padding:10px 12px;border-radius:10px;cursor:pointer}
.personalized-mobile-toolbar-tab.is-active{background:#fff;color:#16120e}
.personalized-mobile-toolbar-tab:focus-visible{outline:2px solid var(--pt-accent);outline-offset:2px}
.personalized-switcher{position:fixed;z-index:72;top:86px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:4px;max-width:calc(100vw - 28px);padding:5px;border:1px solid rgba(255,255,255,.12);border-radius:9999px;background:rgba(20,17,14,.82);box-shadow:0 14px 36px -22px rgba(0,0,0,.9);backdrop-filter:blur(18px);overflow-x:auto;scrollbar-width:none}
.personalized-switcher::-webkit-scrollbar{display:none}
/* Çip yüksekliği 36px'ti; parmakla kullanılan birincil gezinme çubuğu için
   Apple HIG ve WCAG 2.5.5 44px istiyor (ölçtüm: 76x36, 46x36, 52x36, 60x36).
   Görsel yükseklik dolgudan değil min-height'ten geldiği için tipografi
   değişmiyor, yalnız dokunma alanı büyüyor. */
.personalized-switcher a{flex:0 0 auto;min-height:44px;display:inline-flex;align-items:center;padding:8px 13px;border-radius:9999px;color:rgba(255,255,255,.64);font-size:11px;font-weight:500;text-decoration:none;white-space:nowrap;transition:background .25s,color .25s}
.personalized-switcher a:hover,.personalized-switcher a:focus-visible{color:#fff;background:rgba(255,255,255,.08)}
.personalized-switcher a:focus-visible{outline:2px solid var(--pt-accent);outline-offset:2px}
.personalized-switcher a[aria-current=page]{background:#fff;color:#16120e}
.personalized-switcher-home{color:#fff!important}
.personalized-switcher>span{width:1px;height:20px;background:rgba(255,255,255,.14);flex:none}
.personalized-toast{position:fixed;right:clamp(14px,3vw,32px);bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:110;width:min(380px,calc(100vw - 28px));padding:15px 18px;border:1px solid var(--pt-line);border-radius:12px;background:rgba(26,22,18,.96);box-shadow:0 24px 70px rgba(0,0,0,.55);backdrop-filter:blur(18px);color:#fff;font-size:13px;line-height:1.5;opacity:0;transform:translate3d(0,18px,0);pointer-events:none;transition:opacity .3s ease,transform .45s cubic-bezier(.16,1,.3,1)}
.personalized-toast.is-visible{opacity:1;transform:none}
.personalized-toast[data-tone=success]{border-color:rgba(143,191,159,.45)}
.personalized-toast[data-tone=error]{border-color:rgba(255,107,129,.45)}
@media (max-width:900px){
  .personalized-tool-page .cz-builder-card{padding:16px!important}
  .personalized-tool-page [data-cz-stagebox]>.cz-silver{transform:none}
  .personalized-switcher{top:76px;left:14px;right:14px;transform:none;justify-content:flex-start}
  .personalized-mobile-toolbar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;margin:0 0 4px;padding:4px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.035)}
  .personalized-tool-page [data-cz-options]>.personalized-mobile-toolbar{display:grid}
  .personalized-tool-page [data-cz-options]>.personalized-toolbar-group-hidden{display:none!important}
}
@media (prefers-reduced-motion:reduce){
  .personalized-tool-page [data-cz-stagebox]>.cz-silver{transition:none;transform:none!important}
  .personalized-toast{transition:none}
}

/* Full-screen video landing ------------------------------------------------ */
body[data-personalized-landing]{overflow:hidden;background:#050403}
body[data-personalized-landing]>.skip-link{z-index:120}
body[data-personalized-landing]>.personalized-landing-nav{display:none}
.personalized-landing{height:100svh;overflow-y:auto;overflow-x:hidden;scroll-snap-type:y mandatory;scroll-behavior:smooth;background:#050403}
.personalized-landing-nav{position:fixed;top:88px;left:50%;z-index:75;display:flex;align-items:center;gap:3px;max-width:calc(100vw - 30px);padding:5px;border-radius:9999px;transform:translateX(-50%);color:#fff}
.personalized-landing-brand,.personalized-landing-nav-link{position:relative;z-index:1;display:inline-flex;align-items:center;min-height:44px;padding:8px 13px;border-radius:9999px;color:rgba(255,255,255,.68);font-size:11px;font-weight:500;text-decoration:none;white-space:nowrap;transition:background .25s ease,color .25s ease}
.personalized-landing-brand{color:#fff;font-weight:600}
.personalized-landing-nav-link:hover,.personalized-landing-nav-link:focus-visible{background:rgba(255,255,255,.1);color:#fff}
.personalized-landing-nav-link.is-active{background:#fff;color:#15110d}
.personalized-landing-progress{position:fixed;top:50%;right:clamp(16px,3vw,44px);z-index:76;width:2px;height:88px;border-radius:2px;background:rgba(255,255,255,.25);transform:translateY(-50%);overflow:hidden}
.personalized-landing-progress span{display:block;width:100%;height:100%;background:#fff;transform-origin:top;transform:scaleY(var(--landing-progress,.25));transition:transform .65s cubic-bezier(.16,1,.3,1)}
.personalized-scene{position:relative;isolation:isolate;display:flex;align-items:flex-end;min-height:100svh;overflow:hidden;scroll-snap-align:start;scroll-snap-stop:always;background:#0c0907;color:#fff}
.personalized-scene-video{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;filter:saturate(.85) contrast(1.04);transition:opacity .65s ease,filter 1.2s ease;will-change:opacity}
.personalized-scene-video.is-playing{opacity:1}
.personalized-scene-video.is-fading{opacity:.12}
.personalized-scene.has-video .personalized-scene-video{filter:saturate(.92) contrast(1.05)}
.personalized-scene-overlay{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,4,3,.88),rgba(5,4,3,.5) 32%,rgba(5,4,3,.12) 76%),linear-gradient(0deg,rgba(5,4,3,.82),transparent 48%);pointer-events:none}
.personalized-scene-name .personalized-scene-overlay,.personalized-scene-location .personalized-scene-overlay{background:linear-gradient(270deg,rgba(5,4,3,.88),rgba(5,4,3,.5) 32%,rgba(5,4,3,.12) 76%),linear-gradient(0deg,rgba(5,4,3,.82),transparent 48%)}
.personalized-scene-content{position:relative;z-index:2;width:min(620px,calc(100% - 160px));padding:0 0 clamp(60px,10vh,112px) clamp(28px,8vw,128px)}
.personalized-scene-name .personalized-scene-content,.personalized-scene-location .personalized-scene-content{margin-left:auto;padding-left:0;padding-right:clamp(28px,8vw,128px)}
.personalized-scene-kicker{display:inline-flex;align-items:center;gap:9px;margin-bottom:20px;padding:8px 13px;border-radius:9999px;color:rgba(255,255,255,.82);font-size:11px;letter-spacing:.04em}
/* Sahne numarasi (01, 02...) .5 alfada 2,99:1 olculdu; cam rozete zemin
   verildikten sonra 4,11 oldu ama esik 4,5. Bu rakam sadece susleme degil,
   dort aracin SIRASINI soyleyen tek isaret — okunmali. .68 -> 5,9:1. */
.personalized-scene-kicker span{color:rgba(255,255,255,.68);font-variant-numeric:tabular-nums}
.personalized-scene h1,.personalized-scene h2{max-width:620px;font-family:'Cormorant Garamond',serif;font-size:clamp(54px,7vw,96px);font-style:italic;font-weight:300;line-height:.86;letter-spacing:-.035em;text-wrap:balance}
.personalized-scene p{max-width:38ch;margin-top:24px;color:rgba(255,255,255,.84);font-size:16px;font-weight:300;line-height:1.5;text-wrap:pretty}
.personalized-scene-cta{display:inline-flex;align-items:center;gap:11px;margin-top:28px;padding:13px 18px;border-radius:9999px;color:#fff;font-size:13px;font-weight:600;text-decoration:none;transition:transform .3s ease,background .3s ease}
.personalized-scene-cta:hover,.personalized-scene-cta:focus-visible{transform:translateY(-2px);background:rgba(255,255,255,.14);color:#fff}
.personalized-scene-cta svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.personalized-scene-proof{display:inline-flex;align-items:center;gap:10px;margin-top:28px;padding:9px 13px;border-radius:9999px;color:rgba(255,255,255,.65);font-size:11px;letter-spacing:.03em}
.personalized-scene-proof span{width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.4)}
.personalized-scene-next{position:absolute;right:clamp(22px,4vw,68px);bottom:clamp(34px,5vh,58px);z-index:2;display:flex;align-items:center;gap:8px;color:rgba(255,255,255,.62);font-size:11px;letter-spacing:.14em;text-transform:uppercase}
.personalized-scene-next svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;animation:personalized-scroll-cue 2s ease-in-out infinite}
@keyframes personalized-scroll-cue{0%,100%{transform:translateY(-3px);opacity:.45}50%{transform:translateY(3px);opacity:1}}
@media(max-width:760px){
  .personalized-landing-nav{top:76px;left:14px;right:14px;max-width:none;justify-content:flex-start;overflow-x:auto;transform:none}
  .personalized-landing-brand,.personalized-landing-nav-link{min-height:44px;padding:7px 10px;font-size:11px}
  .personalized-landing-progress{top:auto;right:20px;bottom:35px;width:62px;height:2px;transform:none}
  .personalized-landing-progress span{width:100%;height:100%;transform-origin:left;transform:scaleX(var(--landing-progress,.25))}
  .personalized-scene,.personalized-scene-name,.personalized-scene-location{align-items:flex-end}
  .personalized-scene-video{object-position:center}
  .personalized-scene-sky .personalized-scene-video{object-position:64% center}
  .personalized-scene-name .personalized-scene-video{object-position:28% center}
  .personalized-scene-drawing .personalized-scene-video{object-position:64% center}
  .personalized-scene-location .personalized-scene-video{object-position:36% center}
  .personalized-scene-overlay,.personalized-scene-name .personalized-scene-overlay,.personalized-scene-location .personalized-scene-overlay{background:linear-gradient(0deg,rgba(5,4,3,.9),rgba(5,4,3,.22) 67%,rgba(5,4,3,.04))}
  .personalized-scene-content,.personalized-scene-name .personalized-scene-content,.personalized-scene-location .personalized-scene-content{width:100%;margin:0;padding:0 20px 58px}
  .personalized-scene h1,.personalized-scene h2{max-width:340px;font-size:clamp(52px,15vw,70px)}
  .personalized-scene p{max-width:32ch;font-size:14px}
  .personalized-scene-proof{margin-top:20px;font-size:11px}
  .personalized-scene-next{right:20px;bottom:20px;font-size:11px}
}
@media(prefers-reduced-motion:reduce){
  .personalized-landing{scroll-behavior:auto}
  .personalized-scene-video{opacity:1;transition:none}
  .personalized-scene-video.is-fading{opacity:1}
  .personalized-scene-next svg{animation:none}
  .personalized-landing-progress span{transition:none}
}

/* ===== YATAY KAYDIRILABILIR SERITLERDE "DEVAMI VAR" ISARETI ==============
   Olculdu (/kisiye-ozel 390px, .qa/ss/uiux/40-kisiye-ozel-390-sonra.png):
   serit dort ogeli ama ekrana ucu sigiyor; "03 Cizim Kolyesi" sag kenardan
   kesiliyor, "04 Konum Kolyesi" hic gorunmuyor. Serit `overflow-x:auto`
   ama scrollbar gizli (scrollbar-width:none) — yani kaydirilabildigine
   dair EKRANDA HICBIR ISARET yok. Musteri dorduncu aracin varligini
   bilmiyor.
   Cozum kaydirma konumuna duyarli maske: serit sagda icerik varken sag
   kenar soner, sona gelince maske kalkar. Sadece CSS; `animation-timeline:
   scroll()` destekleyen tarayicida konuma duyarli, desteklemeyende sabit
   sag sonum — ikisi de "devami var" der, ikisi de zarar vermez. */
@media (max-width:900px){
  .personalized-switcher,
  .personalized-landing-nav{
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 0,#000 86%,transparent 100%);
  }
  @supports (animation-timeline:scroll(self inline)){
    .personalized-switcher,
    .personalized-landing-nav{
      animation:pz-serit-sonum linear both;
      animation-timeline:scroll(self inline);
      animation-range:calc(100% - 40px) 100%;
    }
    @keyframes pz-serit-sonum{
      to{-webkit-mask-image:linear-gradient(90deg,#000 0,#000 100%,#000 100%);
         mask-image:linear-gradient(90deg,#000 0,#000 100%,#000 100%)}
    }
  }
}
