/*
   Okul Poster Afiş · tema katmanı (custom.css'ten sonra yüklenir, en son söz bu dosyada).
   Kimlik: logodaki üçgen mozaik. Üç imza öğesi:
     · prizma şerit   — logonun altı rengiyle ince üçgen bant (op-prism.svg): üst bilgi, mega menü, kart başlıkları
     · flama          — okul süsü bayrak dizisi (op-flama.svg): "an" sayfaları, açılış, alt bilgi
     · bantlı afiş    — duvara yapıştırılmış poster gibi hafif eğik, köşesinde renkli kâğıt bant olan görsel kartlar
   Renk: lacivert mürekkep (#182447), okul mavisi eylem rengi (#1f6fc0), logodan mor · pembe · turuncu · sarı · gök mavisi vurgular.
   Zemin: soğuk "sınıf duvarı" (#f6f8fc) ve beyaz; Devo'nun krem/yeşilinden bilinçli olarak ayrışır.
   Yazı: Bricolage Grotesque (başlık, 800) · Figtree (gövde) · Caveat (el yazısı notlar).
*/

/* ---------- 1) belirteçler ---------- */
:root{
  --op-ink:#182447;--op-ink-2:#34436a;--op-muted:#64718c;--op-line:#e4e9f2;--op-line-2:#dbe2ee;--op-soft:#f1f4f9;--op-wall:#f6f8fc;
  --op-blue:#1f6fc0;--op-blue-dk:#175aa0;--op-blue-soft:#e8f1fb;--op-sky:#27a3df;--op-purple:#6f2c91;--op-magenta:#d81b60;--op-orange:#f7931e;--op-yellow:#ffcf1a;
  --op-grad:linear-gradient(90deg,#6f2c91,#d81b60 22%,#f7931e 44%,#ffcf1a 60%,#27a3df 80%,#1f6fc0);
  --op-hand:"Caveat","Comic Sans MS",cursive;
  --op-shadow:0 26px 50px -34px rgba(24,36,71,.5);
  /* Devo belirteçlerinin yerine (custom.css ve bölümler bunları kullanır) */
  --ss-green:var(--op-blue);--ss-green-dark:var(--op-blue-dk);--ss-green-soft:var(--op-blue-soft);
  --ss-ink:var(--op-ink);--ss-ink-2:var(--op-ink-2);--ss-muted:var(--op-muted);--ss-line:var(--op-line);--ss-yellow:var(--op-yellow);
  --dv-stripe4:url("op-prism.svg") 0 0/72px 100% repeat-x;
  --dv-confetti:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='560' height='420'%3E%3Cg opacity='.6'%3E%3Cpath d='M48 70l16 4-11 12z' fill='%236f2c91'/%3E%3Cpath d='M236 30l12 9-14 5z' fill='%23d81b60'/%3E%3Cpath d='M430 96l18-2-8 15z' fill='%23ffcf1a'/%3E%3Cpath d='M118 250l14 10-16 4z' fill='%2327a3df'/%3E%3Cpath d='M330 300l10-13 6 16z' fill='%23f7931e'/%3E%3Cpath d='M504 236l-4 16-11-11z' fill='%231f6fc0'/%3E%3Cpath d='M210 380l15 3-10 11z' fill='%23ffcf1a'/%3E%3Cpath d='M28 360l7-14 8 13z' fill='%23d81b60'/%3E%3Cpath d='M390 190l9 12-15 1z' fill='%236f2c91'/%3E%3C/g%3E%3C/svg%3E");
}
.nk{--accent:var(--op-blue);--accent-dark:var(--op-blue-dk);--ink:var(--op-ink)}
html,body,.main{background:#fff}
body{color:var(--op-ink)}
h1,h2,h3,h4{color:var(--op-ink);font-weight:800;letter-spacing:-.025em}
::selection{background:#ffe680;color:var(--op-ink)}
:focus-visible{outline:2px solid var(--op-blue);outline-offset:2px}
a{text-underline-offset:3px}

/* ---------- 2) düğmeler ---------- */
.btn--primary,.nk .btn-primary,.nk .btn.btn-primary{background:var(--op-blue);border-color:var(--op-blue);color:#fff}
.btn--primary:hover,.nk .btn-primary:hover{background:var(--op-blue-dk);border-color:var(--op-blue-dk)}

/* ---------- 3) yardımcılar ---------- */
.op-hl{position:relative;z-index:0;white-space:nowrap;background:none;color:inherit}
.op-hl::after{content:"";position:absolute;z-index:-1;left:-.08em;right:-.08em;bottom:.06em;height:.36em;border-radius:.2em;background:var(--hl,var(--op-yellow));transform:rotate(-1.2deg);opacity:.9}
.op-eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--op-blue)}
.op-eyebrow::before{content:"";width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-top:10px solid var(--ec,var(--op-magenta))}
.op-hand{font-family:var(--op-hand);font-weight:700}
.op-prism{display:block;height:6px;background:var(--dv-stripe4)}
.op-tape{position:absolute;z-index:3;width:74px;height:22px;background:var(--tc,rgba(255,207,26,.82));box-shadow:0 1px 2px rgba(0,0,0,.08);clip-path:polygon(0 8%,6% 0,12% 10%,18% 0,24% 8%,30% 0,36% 9%,42% 0,48% 8%,54% 0,60% 10%,66% 0,72% 8%,78% 0,84% 9%,90% 0,96% 8%,100% 0,100% 92%,94% 100%,88% 90%,82% 100%,76% 91%,70% 100%,64% 92%,58% 100%,52% 90%,46% 100%,40% 92%,34% 100%,28% 90%,22% 100%,16% 92%,10% 100%,4% 90%,0 100%)}

/* ---------- 4) "an" sayfaları: duvar zemini + flama + üçgen konfeti (Devo'daki konfetili krem zeminin yerine) ---------- */
.dv-fun{position:relative;background:url("op-flama.svg") 50% 0/600px 64px repeat-x,var(--dv-confetti) 0 40px/560px 420px,radial-gradient(560px 360px at 100% 0%,rgba(255,207,26,.16),transparent 70%),radial-gradient(560px 380px at 0% 100%,rgba(39,163,223,.12),transparent 70%),var(--op-wall)!important}
.dv-moment{padding:96px 16px 80px}
.dv-moment__card{border-radius:24px;border-color:var(--op-line);box-shadow:var(--op-shadow);transform:rotate(-.4deg)}
.dv-moment__card::before{left:50%;top:-11px;width:96px;height:24px;margin-left:-48px;border-radius:2px;background:rgba(255,207,26,.85);transform:rotate(-3deg);clip-path:polygon(0 10%,8% 0,16% 10%,24% 0,32% 10%,40% 0,48% 10%,56% 0,64% 10%,72% 0,80% 10%,88% 0,100% 8%,100% 90%,92% 100%,84% 90%,76% 100%,68% 90%,60% 100%,52% 90%,44% 100%,36% 90%,28% 100%,20% 90%,12% 100%,0 92%)}
.dv-moment__ico{background:var(--op-blue-soft);color:var(--op-blue);border-radius:20px}
.dv-moment__code{background:var(--op-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.dv-moment__eyebrow{background:#fff3c4;color:#6b4f00}
.dv-moment__btn{background:var(--op-blue);box-shadow:0 14px 26px -14px rgba(31,111,192,.8)}
.dv-moment__btn--ghost{background:#fff;box-shadow:inset 0 0 0 1.5px var(--op-line-2)}
.dv-moment__search{background:var(--op-soft);border-radius:999px}
.dv-moment__search button{border-radius:999px}
.dv-moment__chips a{background:#fff;border-color:var(--op-line-2);color:var(--op-ink-2)}
.dv-moment__chips a:hover{border-color:var(--op-blue);color:var(--op-blue)}
.dv-stripe4{background:var(--dv-stripe4)}
.dvh-mega::before{background:var(--dv-stripe4)}
#section-school::before,#section-faq::before{background:var(--dv-stripe4)!important}

/* ---------- 5) bölüm başlıkları (nc-* ve ss-* bölümleri) ---------- */
.nchd__title,.nk .nchd__title{font-weight:800;letter-spacing:-.03em}
.nchd__link{color:var(--op-blue)}
.nk .eyebrow{color:var(--op-blue)}

/* ---------- 6) ürün kartı: beyaz "afiş kâğıdı", hover'da hafif kalkar ve köşesinde bant belirir ---------- */
.nk .card,.nk .product-card,.nk .pcard{--card-radius:16px}
.nk .card .card-media,.nk .product-card .card-media{background:#f3f5f9;border-radius:14px}
.nk .card .price-now,.nk .product-card .price-now{color:var(--op-ink)}
.nk .card .badge-sale,.nk .card .badge--sale{background:var(--op-magenta)!important;color:#fff!important}

/* ---------- 7) form öğeleri ---------- */
.nk input:focus,.nk select:focus,.nk textarea:focus{border-color:var(--op-blue)}

/* ---------- 8) mobil ---------- */
@media (max-width:640px){
  .dv-moment{padding:72px 12px 48px}
  .dv-fun{background-size:420px 48px,560px 420px,auto,auto,auto!important}
}
@media (prefers-reduced-motion:reduce){.dv-moment__card{transform:none}}

/* ---------- 9) okul teklif formu: dört kademe ---------- */
.ssk__seg{grid-template-columns:repeat(4,1fr)}
@media (max-width:420px){.ssk__seg{grid-template-columns:repeat(2,1fr)}}

/* ---------- 10) hesap ekranları: zemin snippets/nk-auth-bar içinde; giriş kartı flamanın altında başlar ---------- */
body.nk-auth-body .nk .nk-auth-main{padding-top:84px!important}