/* Musteri portali — bolunmus ekran (referans: Keylight giris sayfasi), Veritral renkleri.
   Uzunluklar 1470x900 tasarim cercevesinde; --u ile olceklenir. < 740px tek sutun. */
:root{--u:1px;--pt-paper:#0c0a14;--pt-field:#14111f;--pt-line:rgba(255,255,255,.14);--pt-muted:#a9a4c4;--pt-ink:#fff}
@media (min-width:740px){
  :root{
    --u-floor:min(clamp(.8px, calc(.8px + (1176px - 100vw) / 1180), 1px), max(.8px, calc(100vh / 772), calc(500px - 100vh)));
    --u:min(4px, max(var(--u-floor), min(calc(100vw / 1470), calc(100vh / 900))));
  }
  @supports (height:100dvh){:root{
    --u-floor:min(clamp(.8px, calc(.8px + (1176px - 100vw) / 1180), 1px), max(.8px, calc(100dvh / 772), calc(500px - 100dvh)));
    --u:min(4px, max(var(--u-floor), min(calc(100vw / 1470), calc(100dvh / 900))));
  }}
}
@media (min-width:740px) and (orientation:portrait){:root{--u-floor:min(1px, calc(100vh / 772))}}
body.pg-portal{background:var(--pt-paper)}
.pt{display:flex;min-height:100vh;min-height:100dvh;width:100%}

/* ---------- marka paneli ---------- */
.pt-brand{position:relative;flex:0 0 calc(100% * 610 / 1470);max-width:calc(100% - 450 * var(--u));min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;justify-content:space-between;gap:calc(24 * var(--u));container-type:inline-size;padding:calc(32 * var(--u)) 0;overflow:hidden;isolation:isolate;color:#fff;
  background:radial-gradient(120% 70% at 100% 20%,rgba(79,26,251,.55),transparent 60%),radial-gradient(90% 60% at 10% 100%,rgba(80,76,255,.35),transparent 65%),linear-gradient(180deg,#0b0820 0%,#0a0716 55%,#07050f 100%)}
/* Yuklenen arka plan gorseli (CMS: portal > brand.background_url). Ustune okunabilirlik icin karartma katmani. */
.pt-bg{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:var(--pt-bg-pos,50% 50%)}
.pt-brand.has-bg{background:#07050f}
.pt-brand.has-bg .pt-glow,.pt-brand.has-bg::before,.pt-brand.has-bg::after{display:none}
.pt-shade{position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(180deg,rgba(7,5,15,var(--pt-dim,.45)) 0%,rgba(7,5,15,calc(var(--pt-dim,.45) * .6)) 45%,rgba(7,5,15,calc(var(--pt-dim,.45) + .15)) 100%)}
/* Veritral isareti: buyuk, parlayan, panelin sag kenarinda (referanstaki anahtar deliginin yeri) */
.pt-glow{position:absolute;z-index:-1;right:calc(-96 * var(--u));top:calc(-36 * var(--u));width:calc(300 * var(--u));aspect-ratio:1;
  background:linear-gradient(160deg,#C9BCFF,#854CFF 45%,#4F1AFB);-webkit-mask:url(/assets/veritral-mark.svg) center/contain no-repeat;mask:url(/assets/veritral-mark.svg) center/contain no-repeat;opacity:.5;filter:drop-shadow(0 0 40px rgba(133,76,255,.8))}
.pt-brand::before,.pt-brand::after{content:"";position:absolute;pointer-events:none;z-index:-2}
.pt-brand::before{left:50%;top:0;width:75%;height:50%;background:radial-gradient(closest-side,rgba(161,138,255,.55),rgba(79,26,251,.2) 55%,transparent);mix-blend-mode:screen;filter:blur(calc(6 * var(--u)));animation:ptBloom 5.5s cubic-bezier(.45,0,.55,1) infinite alternate}
.pt-brand::after{left:-10%;top:42%;width:120%;height:50%;background:radial-gradient(closest-side,rgba(80,76,255,.35),transparent);mix-blend-mode:screen;animation:ptDrift 9s cubic-bezier(.45,0,.55,1) infinite alternate}
@keyframes ptBloom{from{opacity:.35;transform:scale(.9)}to{opacity:1;transform:scale(1.12)}}
@keyframes ptDrift{from{opacity:.45;transform:translate3d(-6%,2%,0)}to{opacity:1;transform:translate3d(6%,-3%,0)}}
.pt-inset{--inset:clamp(calc(24 * var(--u)), calc(100cqi - 465.75 * var(--u)), calc(144 * var(--u)));--measure:min(calc(338 * var(--u)), calc(100cqi - var(--inset) - 24 * var(--u)));padding-left:var(--inset);padding-right:calc(24 * var(--u))}
.pt-top{display:flex;align-items:center;gap:calc(14 * var(--u))}
.pt-back{width:calc(40 * var(--u));height:calc(40 * var(--u));min-width:36px;min-height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18)}
.pt-back:hover{background:rgba(255,255,255,.16);color:#fff}.pt-back svg{width:18px;height:18px}
.pt-logo img{height:calc(30 * var(--u));min-height:24px;width:auto;display:block}
.pt-title{margin:0;max-width:var(--measure);font-size:min(calc(30 * var(--u)), calc(var(--measure) / 7.9));line-height:1.2;font-weight:500;letter-spacing:-.03em;color:#ece9ff}
.pt-copy{margin:calc(11.5 * var(--u)) 0 0;max-width:var(--measure);font-size:calc(16 * var(--u));line-height:calc(24 * var(--u));color:rgba(255,255,255,.55)}
.pt-reel{position:relative;margin-top:calc(40 * var(--u));height:calc(220 * var(--u));overflow:hidden}
.pt-track{position:absolute;left:0;top:0;display:flex;gap:calc(16 * var(--u));transform:translateX(calc(-43 * var(--u)));animation:ptReel 48s linear infinite;will-change:transform}
@media (hover:hover){.pt-reel:hover .pt-track{animation-play-state:paused}}
@keyframes ptReel{from{transform:translateX(calc(-43 * var(--u)))}to{transform:translateX(calc((-43 - 1104) * var(--u)))}}
.pt-card{flex:none;margin:0;width:calc(260 * var(--u));height:calc(220 * var(--u));display:flex;flex-direction:column;justify-content:space-between;padding:calc(22 * var(--u));border:1px solid rgba(255,255,255,.12);border-radius:calc(18 * var(--u));background:rgba(14,10,30,.5);-webkit-backdrop-filter:blur(16px) saturate(.9);backdrop-filter:blur(16px) saturate(.9)}
.pt-card-ic{width:calc(40 * var(--u));height:calc(40 * var(--u));border-radius:calc(12 * var(--u));display:grid;place-items:center;background:rgba(161,138,255,.16);color:#C9BCFF}
.pt-card-ic svg{width:calc(20 * var(--u));height:calc(20 * var(--u))}
.pt-card figcaption{display:flex;flex-direction:column;gap:calc(6 * var(--u));min-height:calc(110 * var(--u))}
.pt-card strong{font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));font-weight:500;color:#fff}
.pt-card span{font-size:calc(13.5 * var(--u));line-height:calc(19 * var(--u));color:rgba(255,255,255,.62)}
.pt-trust{margin-top:calc(36 * var(--u))}
.pt-marks img{display:block;width:auto;height:calc(var(--h,28px) * .72);max-height:calc(30 * var(--u));filter:brightness(0) invert(1);opacity:.6}
.pt-rule{display:flex;align-items:center;gap:calc(8 * var(--u));max-width:var(--measure)}
.pt-rule::before,.pt-rule::after{content:"";flex:1;height:1px;background:rgba(255,255,255,.22)}
.pt-rule span{font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));color:rgba(255,255,255,.88);white-space:nowrap}
.pt-marks{list-style:none;margin:calc(22 * var(--u)) 0 0;padding:0;max-width:var(--measure);display:flex;flex-wrap:wrap;justify-content:center;gap:calc(12 * var(--u)) calc(22 * var(--u))}
.pt-marks li{display:flex;align-items:center;font-size:calc(16 * var(--u));line-height:1.2;font-weight:600;letter-spacing:-.02em;color:rgba(201,188,255,.6);white-space:nowrap}
.pt-legal{margin:0;font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));color:rgba(255,255,255,.5)}

/* ---------- giris paneli ---------- */
.pt-auth{flex:1 1 auto;min-width:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--pt-paper)}
.pt-auth-main{flex:1;display:flex;align-items:center;justify-content:center;padding:calc(40 * var(--u)) calc(24 * var(--u)) 0}
.pt-panel{width:calc(402 * var(--u));max-width:100%}
.pt-h{margin:0;font-size:calc(32 * var(--u));line-height:calc(40 * var(--u));font-weight:500;letter-spacing:-.025em;color:#fff;outline:none}
.pt-sub{margin:calc(4 * var(--u)) 0 0;font-size:calc(16 * var(--u));line-height:calc(24 * var(--u));color:var(--pt-muted)}
.pt-form{margin-top:calc(26 * var(--u))}
.pt-field+.pt-field{margin-top:calc(16 * var(--u))}
.pt-label-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pt-label{display:block;font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));color:var(--pt-muted)}
.pt-ctl{position:relative;margin-top:calc(7 * var(--u))}
.pt-ic{position:absolute;left:calc(11 * var(--u));top:50%;transform:translateY(-50%);width:16px;height:16px;color:#8c87a6;pointer-events:none}
.pt-in{display:block;width:100%;height:calc(44 * var(--u));min-height:40px;padding:0 calc(44 * var(--u)) 0 calc(36 * var(--u));font-size:max(14px,calc(14 * var(--u)));color:#fff;background:var(--pt-field);border:1px solid var(--pt-line);border-radius:calc(10 * var(--u));outline:none;transition:border-color .15s,box-shadow .15s}
.pt-sel{padding-left:calc(14 * var(--u));appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#a9a4c4 50%),linear-gradient(135deg,#a9a4c4 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;cursor:pointer}
.pt-sel option{background:#14111f;color:#fff}
.pt-in::placeholder{color:#77729a}
.pt-in:focus-visible,.pt-in:focus{border-color:#A18AFF;box-shadow:0 0 0 3px rgba(161,138,255,.25)}
.pt-in[aria-invalid="true"]{border-color:#FF8FA3}
.pt-reveal{position:absolute;right:calc(6 * var(--u));top:50%;transform:translateY(-50%);width:34px;height:34px;padding:0;border:0;background:none;cursor:pointer;display:grid;place-items:center;color:#a9a4c4;border-radius:8px}
.pt-reveal:hover{color:#fff}.pt-reveal svg{width:16px;height:16px}
.pt-reveal:focus-visible{outline:2px solid #C9BCFF;outline-offset:0}
.pt-hint{margin:6px 0 0;font-size:12.5px;line-height:18px;color:#8c87a6}
.pt-ferr{margin:6px 0 0;font-size:13px;line-height:18px;color:#FF8FA3}
.pt-alert{margin:calc(16 * var(--u)) 0 0;padding:10px 14px;border-radius:10px;font-size:14px;line-height:20px;background:rgba(255,143,163,.1);border:1px solid rgba(255,143,163,.35);color:#ffc2cd}
.pt-alert.ok{background:rgba(141,227,166,.1);border-color:rgba(141,227,166,.35);color:#bff0cc}
.pt-link{all:unset;cursor:pointer;font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));color:#C9BCFF}
.pt-link:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.pt-link:focus-visible{outline:2px solid #C9BCFF;outline-offset:2px;border-radius:4px}
.pt-strong{font-weight:500;color:#fff}
.pt-cta{display:flex;align-items:center;justify-content:center;width:100%;height:calc(46 * var(--u));min-height:44px;margin-top:calc(22 * var(--u));border:0;border-radius:var(--r-pill);background:#fff;color:#16121E;font-size:15px;font-weight:500;cursor:pointer;transition:background .15s,color .15s,opacity .15s}
.pt-cta:hover{background:#504CFF;color:#fff}
.pt-cta[disabled]{opacity:.7;cursor:progress}
.pt-cta:focus-visible{outline:2px solid #C9BCFF;outline-offset:3px}
.pt-cta-ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.3);margin-top:12px}
.pt-cta-ghost:hover{background:rgba(255,255,255,.1);color:#fff}
.pt-check{display:flex;gap:12px;align-items:flex-start;margin-top:calc(18 * var(--u));cursor:pointer;font-size:13.5px;line-height:20px;color:var(--pt-muted)}
.pt-check input{position:absolute;opacity:0;width:1px;height:1px}
.pt-box{width:18px;height:18px;flex:none;margin-top:1px;border-radius:5px;border:1px solid rgba(255,255,255,.3);background:var(--pt-field);display:grid;place-items:center;color:#16121E}
.pt-box svg{width:12px;height:12px;opacity:0}
.pt-check input:checked+.pt-box{background:#fff;border-color:#fff}.pt-check input:checked+.pt-box svg{opacity:1}
.pt-check input:focus-visible+.pt-box{box-shadow:0 0 0 3px rgba(161,138,255,.45)}
.pt-check a{color:#fff;text-decoration:underline;text-underline-offset:3px}
.pt-switch{margin:calc(24 * var(--u)) 0 0;text-align:center;font-size:calc(14 * var(--u));line-height:calc(20 * var(--u));color:var(--pt-muted)}
.pt-hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.pt-done-ic{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:rgba(141,227,166,.14);color:#8de3a6;margin-bottom:18px}
.pt-done-ic svg{width:24px;height:24px}
.pt-foot{padding:calc(24 * var(--u)) calc(24 * var(--u)) calc(30 * var(--u));display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.pt-foot p{margin:0;font-size:13px;line-height:19px;color:#8c87a6}
.pt-foot nav{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap}
.pt-foot nav>a{font-size:14px;color:var(--pt-muted)}.pt-foot nav>a:hover{color:#fff}

/* ---------- mobil (< 740px): marka bandi -> form -> ozellikler ---------- */
@media (max-width:739.98px){
  :root{--g:clamp(16px,5vw,32px)}
  .pt{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr auto auto auto auto}
  .pt::before,.pt::after{content:"";grid-column:1;z-index:0;background:radial-gradient(120% 90% at 100% 0%,rgba(79,26,251,.5),transparent 60%),linear-gradient(180deg,#0b0820,#07050f)}
  .pt::before{grid-row:1/3}.pt::after{grid-row:5/8;background:radial-gradient(100% 80% at 0% 100%,rgba(80,76,255,.35),transparent 65%),#0a0716}
  .pt-brand,.pt-mid,.pt-auth{display:contents}
  .pt-brand::before,.pt-brand::after,.pt-glow{display:none}
  .pt-bg,.pt-shade{grid-column:1;grid-row:1/3;position:relative;inset:auto;z-index:0;height:100%;min-height:0}
  .pt-top,.pt-hero,.pt-auth-main,.pt-foot,.pt-reel,.pt-trust,.pt-bottom{grid-column:1;position:relative;z-index:1}
  .pt-top{grid-row:1}.pt-hero{grid-row:2}.pt-auth-main{grid-row:3}.pt-foot{grid-row:4}.pt-reel{grid-row:5}.pt-trust{grid-row:6}.pt-bottom{grid-row:7}
  .pt-inset{--inset:var(--g);--measure:min(100%,480px);padding-left:var(--g);padding-right:var(--g)}
  .pt-top{padding-top:calc(16px + env(safe-area-inset-top))}
  .pt-hero{padding-top:24px;padding-bottom:28px}
  .pt-title{font-size:clamp(24px,7vw,28px)}
  .pt-auth-main{align-items:flex-start;padding:28px var(--g) 8px;background:var(--pt-paper)}
  .pt-foot{background:var(--pt-paper);padding:8px var(--g) 28px}
  .pt-reel{margin-top:36px;height:200px}
  .pt-track{animation-name:ptReelM;transform:translateX(var(--g))}
  @keyframes ptReelM{from{transform:translateX(var(--g))}to{transform:translateX(calc(var(--g) - 1104px))}}
  .pt-card{width:240px;height:200px}
  .pt-trust{margin-top:32px}
  .pt-bottom{padding-top:28px;padding-bottom:calc(24px + env(safe-area-inset-bottom))}
  .pt-in{height:46px;font-size:16px}
}
@media (pointer:coarse){.pt-in{font-size:max(16px,calc(14 * var(--u)))}}
@media (prefers-reduced-motion:reduce){.pt-track{animation:none}.pt-brand::before,.pt-brand::after{animation:none}}
/* giris animasyonu: yalniz html.is-entering iken baslangic durumlari */
html.is-entering :is(.pt-logo,.pt-back,.pt-title,.pt-copy,.pt-card,.pt-rule span,.pt-marks,.pt-legal,.pt-h,.pt-sub,.pt-field,.pt-cta,.pt-switch,.pt-foot){opacity:0}

[dir="rtl"] .pt-back svg{transform:scaleX(-1)}