/* =========================================================
   3D Eğitim Pasaportu (hero) — TASLAK v2
   Krem renk yalnızca pasaport sayfalarında.
   ========================================================= */
.stage{display:flex;flex-direction:column;align-items:center;gap:26px;text-align:left}
.scene{--W:min(300px,21vw);--H:calc(var(--W)*1.42);width:calc(var(--W)*2);height:var(--H);perspective:2200px;position:relative}
.scene__spot{position:absolute;left:50%;top:50%;width:170%;height:150%;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(141,176,227,.28),rgba(141,176,227,.08) 55%,transparent);pointer-events:none;filter:blur(10px)}
.book{position:absolute;inset:0;transform-style:preserve-3d;will-change:transform}
.book-shadow{position:absolute;left:50%;right:0;bottom:-30px;height:34px;background:radial-gradient(closest-side,rgba(0,0,0,.55),transparent);filter:blur(6px)}
.base{position:absolute;top:0;left:var(--W);width:var(--W);height:var(--H);border-radius:4px 14px 14px 4px;box-shadow:0 40px 80px -30px rgba(0,0,0,.8);overflow:hidden}
.leaf{position:absolute;top:0;left:var(--W);width:var(--W);height:var(--H);transform-origin:left center;transform-style:preserve-3d;will-change:transform}
.face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;overflow:hidden}
.front{border-radius:4px 14px 14px 4px}
.back{transform:rotateY(180deg);border-radius:14px 4px 4px 14px}
.leaf .face::after{content:"";position:absolute;inset:0;pointer-events:none;background:var(--shade,transparent)}

/* sayfalar */
.pg{background:
   repeating-radial-gradient(circle at 30% 120%,rgba(1,39,69,.04) 0 2px,transparent 2px 9px),
   linear-gradient(135deg,#f8f4ec,#ece2cf);
   padding:calc(var(--W)*.085);color:#1c2533;display:flex;flex-direction:column}
.front.pg{box-shadow:inset 14px 0 18px -14px rgba(0,0,0,.3)}
.back.pg{box-shadow:inset -14px 0 18px -14px rgba(0,0,0,.3)}
.pg-top{display:flex;justify-content:space-between;align-items:center;font-size:calc(var(--W)*.03);letter-spacing:2px;color:#5d6676;text-transform:uppercase;font-weight:600}
.pg-no{font-family:var(--serif);font-size:calc(var(--W)*.05);color:var(--bordo)}
.pg .pg-h{font-family:var(--serif);color:var(--navy);font-size:calc(var(--W)*.13);line-height:1;margin-top:calc(var(--W)*.06)}
.pg .city{font-size:calc(var(--W)*.038);letter-spacing:3px;text-transform:uppercase;color:var(--bordo);font-weight:600;margin-top:6px}
.pg ul{list-style:none;margin-top:calc(var(--W)*.06);font-size:calc(var(--W)*.042);display:flex;flex-direction:column;gap:calc(var(--W)*.022)}
.pg ul li{padding-left:16px;position:relative}
.pg ul li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:var(--bordo)}
.pg .more{margin-top:auto;font-size:calc(var(--W)*.04);font-weight:600;color:var(--navy);border-top:1px dashed #c9bda5;padding-top:calc(var(--W)*.04)}
.pg .more b{color:var(--bordo)}
.stamp{position:absolute;right:calc(var(--W)*.08);bottom:calc(var(--W)*.2);width:calc(var(--W)*.38);opacity:.85;transform:rotate(-14deg);mix-blend-mode:multiply}
.visa{align-items:center;justify-content:center;text-align:center}
.visa .big{font-family:var(--serif);font-weight:700;font-size:calc(var(--W)*.2);color:var(--navy);line-height:.9}
.visa .sub{margin-top:10px;font-size:calc(var(--W)*.035);letter-spacing:4px;text-transform:uppercase;color:#5d6676}
.visa .stamp{position:static;width:calc(var(--W)*.55);transform:rotate(9deg);margin-top:calc(var(--W)*.06)}
.mrz{font-family:'Courier New',monospace;font-size:calc(var(--W)*.031);letter-spacing:1px;color:#3b4250;margin-top:auto;line-height:1.4;word-break:break-all}
.pg-eyebrow{font-size:calc(var(--W)*.035);letter-spacing:3px;text-transform:uppercase;color:var(--bordo);font-weight:600}

/* kapak: lacivert deri + yaldız + kenar ışığı */
.cover{background:
   radial-gradient(120% 80% at 30% 0%,rgba(141,176,227,.22),transparent 55%),
   repeating-linear-gradient(45deg,rgba(255,255,255,.02) 0 2px,transparent 2px 5px),
   linear-gradient(160deg,#0f3a6e,#082b55 50%,#03172f);
   color:#f0e2bd;display:flex;flex-direction:column;align-items:center;justify-content:space-between;padding:calc(var(--W)*.12) calc(var(--W)*.08);text-align:center;
   box-shadow:inset 0 0 0 1px rgba(141,176,227,.35),inset 0 0 0 calc(var(--W)*.03) rgba(0,0,0,.08),inset 6px 0 10px rgba(0,0,0,.4),0 0 60px -10px rgba(87,140,214,.6)}
.cover::before{content:"";position:absolute;inset:0;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);transform:translateX(-100%);animation:shine 5s ease-in-out infinite}
@keyframes shine{0%,60%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.cover .t1{font-size:calc(var(--W)*.042);letter-spacing:5px;font-weight:600}
.cover .t2{font-size:calc(var(--W)*.034);letter-spacing:4px;opacity:.7;margin-top:6px}
.cover img{width:72%;filter:drop-shadow(0 2px 1px rgba(0,0,0,.4))}
.cover .emblem{width:calc(var(--W)*.34);height:calc(var(--W)*.34);border:1.5px solid rgba(240,226,189,.55);border-radius:50%;display:grid;place-items:center;font-family:var(--serif);font-size:calc(var(--W)*.05);letter-spacing:2px;position:relative}
.cover .emblem::after{content:"";position:absolute;inset:8px;border:1px dashed rgba(240,226,189,.35);border-radius:50%}
.cover .stripe{width:60%;height:3px;background:linear-gradient(90deg,transparent,var(--bordo-l),transparent)}
.idpage .row{display:flex;flex-direction:column;margin-top:calc(var(--W)*.035)}
.idpage .row small{font-size:calc(var(--W)*.028);letter-spacing:2px;text-transform:uppercase;color:#5d6676}
.idpage .row span{font-family:var(--serif);font-size:calc(var(--W)*.065);color:var(--navy);font-weight:600;line-height:1.1}
.idpage .photo{width:calc(var(--W)*.3);height:calc(var(--W)*.36);border:1.5px dashed #b9ab8f;border-radius:6px;display:grid;place-items:center;color:#5d6676;font-size:calc(var(--W)*.03);text-align:center;margin-top:calc(var(--W)*.05)}
.cta-page{align-items:center;justify-content:center;text-align:center;gap:calc(var(--W)*.05)}
.cta-page .pg-h{margin-top:0}
.cta-page p{font-size:calc(var(--W)*.042);color:#5d6676}
.cta-page .btn{font-size:calc(var(--W)*.042);padding:calc(var(--W)*.04) calc(var(--W)*.07)}

.country-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:620px}
.country-nav button{font-family:var(--sans);font-size:12px;font-weight:600;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:rgba(7,31,61,.6);color:var(--blue-xl);cursor:pointer;transition:all .25s;backdrop-filter:blur(6px)}
.country-nav button:hover{border-color:var(--bordo-l);color:#fff}
.country-nav button.active{background:var(--bordo);border-color:var(--bordo-l);color:#fff;box-shadow:0 0 18px rgba(224,87,125,.5)}

@media (max-width:860px){
  .scene{--W:min(42vw,230px)}
  .country-nav{display:none}
}

.pg-flag{display:block;margin-top:calc(var(--W)*.05);width:calc(var(--W)*.14);height:auto;filter:drop-shadow(0 4px 8px rgba(0,0,0,.2))}
.pg-flag--big{margin-top:0;width:calc(var(--W)*.22);margin-bottom:calc(var(--W)*.05)}
.country-nav button{display:inline-flex;align-items:center;gap:7px}
.country-nav button img{width:18px;height:18px}
.pg .pg-flag + .pg-h{margin-top:calc(var(--W)*.03)}
