/* =========================================================================
   Varyasyon 3 · Levha
   Layout: görünür 12 kolonlu ızgara, siyah 2px bölüm çizgileri, keskin köşe.
   Renk görevleri levha sisteminden: kırmızı halka = sınıf, mavi = yön/eylem.
   ========================================================================= */
.v3 {
  --bg: #FFFFFF;
  --ink: #0F0F10;
  --muted: #4D4D52;          /* beyazda 8:1 */
  --grid: #EAEAEC;
  --red: #D50000;
  --blue: #0B4EA2;           /* yön levhası mavisi, beyaz yazıyla 7.6:1 */
  --blue-deep: #083A7A;
  --sign-gray: #8A8C91;
  --f-disp: "Archivo", "Arial", system-ui, sans-serif;
  --f-body: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  background: var(--bg); color: var(--ink);
  font: 400 1rem/1.6 var(--f-body);
  font-stretch: 100%;
  --ph-font: var(--f-disp);
}
.v3-wrap {
  width: 100%; max-width: 1320px; margin-inline: auto;
  padding-left: max(20px, env(safe-area-inset-left, 0px));
  padding-right: max(20px, env(safe-area-inset-right, 0px));
}
:where(.v3) :where(h1, h2, h3) { margin: 0; text-wrap: balance; }
:where(.v3) p { margin: 0; }
:where(.v3) :where(ul, ol, dl) { margin: 0; padding: 0; list-style: none; }
:where(.v3) dd { margin: 0; }

.v3-h1, .v3-h2, .v3-final__h { font-family: var(--f-disp); font-stretch: 125%; font-weight: 800; text-transform: uppercase; }
.v3-h1 { font-size: clamp(2.7rem, 6.6vw, 5.6rem); line-height: .92; letter-spacing: -0.02em; }
.v3-h1 em { font-style: normal; color: var(--red); }
.v3-h2 { font-size: clamp(1.9rem, 4.2vw, 3.4rem); line-height: .95; letter-spacing: -0.015em; }
.v3-lead { font-size: 1.15rem; color: var(--muted); max-width: 44ch; }
.v3-muted { color: var(--muted); max-width: 46ch; }
.v3-eyebrow { font: 700 .78rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 14px; display: flex; align-items: center; gap: 10px; }
.v3-eyebrow::before { content: ""; width: 14px; height: 14px; border-radius: 50%; border: 3px solid var(--red); }

/* Butonlar: mavi yön levhası + çizgili */
.v3-sbtn {
  display: inline-flex; align-items: center; gap: 12px; min-height: 54px; padding: 0 8px 0 20px;
  background: var(--blue); color: #FFFFFF; text-decoration: none; border-radius: 6px;
  box-shadow: inset 0 0 0 3px var(--blue), inset 0 0 0 5px #FFFFFF;
  font: 700 .95rem/1 var(--f-body); font-stretch: 112%; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap;
  transition: background-color .16s var(--ease-out), box-shadow .16s var(--ease-out);
}
.v3-sbtn .ic { width: 38px; height: 38px; padding: 9px; border-radius: 4px; background: #FFFFFF; color: var(--blue); stroke-width: 2.4; transition: transform .18s var(--ease-out); }
.v3-sbtn:hover { background: var(--blue-deep); box-shadow: inset 0 0 0 3px var(--blue-deep), inset 0 0 0 5px #FFFFFF; }
.v3-sbtn:hover .ic { transform: translateX(2px); }
.v3-sbtn--sm { min-height: 46px; padding-left: 16px; font-size: .82rem; }
.v3-sbtn--sm .ic { width: 32px; height: 32px; padding: 7px; }
.v3-obtn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 54px; padding: 0 20px;
  border: 2px solid var(--ink); color: var(--ink); text-decoration: none; border-radius: 6px;
  font: 700 .95rem/1 var(--f-body); font-stretch: 112%; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap;
  transition: background-color .16s var(--ease-out), color .16s var(--ease-out);
}
.v3-obtn:hover { background: var(--ink); color: #FFFFFF; }
.v3-obtn--inv { border-color: #FFFFFF; color: #FFFFFF; }
.v3-obtn--inv:hover { background: #FFFFFF; color: var(--ink); }
.v3-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* Menü */
.v3-head { position: sticky; top: calc(var(--vs-h) + env(safe-area-inset-top, 0px)); z-index: 20; background: var(--bg); border-bottom: 2px solid var(--ink); }
.v3-head__in { display: flex; align-items: center; gap: 32px; min-height: 76px; }
.v3-head__logo { width: 180px; flex: none; }
.v3-head nav { margin-left: auto; }
.v3-head__links { display: flex; }
.v3-head__links a {
  display: block; padding: 10px 16px; text-decoration: none; border-left: 1px solid var(--grid);
  font: 700 .82rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .08em; text-transform: uppercase;
  transition: color .16s var(--ease-out);
}
.v3-head__links li:last-child a { border-right: 1px solid var(--grid); }
.v3-head__links a:hover { color: var(--red); }
@media (max-width: 960px) { .v3-head nav { display: none; } .v3-head__in { justify-content: space-between; } }
@media (max-width: 440px) { .v3-tagline span { padding: 5px 8px; font-size: .66rem; } }
@media (max-width: 440px) { .v3-head__logo { width: 136px; } .v3-sbtn--sm span { display: none; } .v3-sbtn--sm { padding: 0 6px; } }

/* Hero */
.v3-hero {
  border-bottom: 2px solid var(--ink);
  background:
    linear-gradient(90deg, var(--grid) 1px, transparent 1px) center top / calc(min(1320px, 100%) / 12) 100%,
    var(--bg);
}
.v3-hero__grid { display: grid; grid-template-columns: 7fr 5fr; gap: 40px; align-items: stretch; }
.v3-hero__copy { display: grid; align-content: center; gap: 28px; padding-block: 72px 80px; min-width: 0; }
.v3-tagline { display: flex; flex-wrap: wrap; gap: 0; }
.v3-tagline span { padding: 6px 12px; border: 2px solid var(--ink); font: 700 .76rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .1em; text-transform: uppercase; background: var(--bg); }
.v3-tagline span + span { border-left: 0; }
.v3-tagline span:last-child { background: var(--ink); color: #FFFFFF; }

.v3-signs { position: relative; min-height: 520px; }
.v3-pole { position: absolute; left: 50%; top: 40px; bottom: 0; width: 14px; margin-left: -7px; background: linear-gradient(90deg, #9EA0A5, #D9DADD 45%, #8A8C91); }
.v3-signs__ring { position: absolute; left: 50%; top: 40px; translate: -50% 0; }
.v3-signs__dir { position: absolute; left: 50%; top: 248px; translate: -50% 0; width: min(360px, 92%); }
.v3-signs__tri { position: absolute; left: 50%; top: 392px; translate: -50% 0; }
.v3-signs > * { animation: v3-swing 6s ease-in-out infinite; transform-origin: 50% 0; }
.v3-signs > .v3-pole { animation: none; }
.v3-signs__dir { animation-delay: -2s; }
.v3-signs__tri { animation-delay: -4s; }
@keyframes v3-swing { 50% { transform: rotate(.6deg); } }

/* Kırmızı halkalı levha */
.v3-ring {
  display: grid; place-items: center; width: 180px; height: 180px; border-radius: 50%;
  background: #FFFFFF; border: 22px solid var(--red);
  box-shadow: 0 0 0 3px #FFFFFF, 0 0 0 4px rgba(15,15,16,.15), 0 16px 30px -18px rgba(15,15,16,.45);
}
.v3-ring span { font: 800 4rem/1 var(--f-disp); font-stretch: 112%; color: var(--ink); letter-spacing: -0.03em; }
.v3-cell .v3-ring { width: 92px; height: 92px; border-width: 11px; }
.v3-cell .v3-ring span { font-size: 2.1rem; }
.v3-ring--lg.v3-ring { width: 150px; height: 150px; border-width: 18px; }
.v3-ring--lg span { font-size: 3.4rem; }

/* Mavi yön levhası */
.v3-dir { background: var(--blue); color: #FFFFFF; border-radius: 10px; padding: 6px; box-shadow: 0 16px 30px -18px rgba(8,58,122,.6); }
.v3-dir__in { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 16px 18px; border: 3px solid #FFFFFF; border-radius: 6px; }
.v3-dir__arrow { width: 42px; height: 42px; stroke-width: 2.6; }
.v3-dir__txt { display: grid; gap: 2px; }
.v3-dir__txt b { font: 800 1.45rem/1 var(--f-disp); font-stretch: 112%; text-transform: uppercase; }
.v3-dir__txt span { font: 600 .9rem/1.1 var(--f-body); font-stretch: 112%; opacity: .92; }
.v3-dir em { font: 700 1.1rem/1 var(--f-body); font-style: normal; font-stretch: 112%; }
.v3-tri {
  display: grid; place-items: end center; width: 150px; height: 132px; padding-bottom: 22px;
  background: var(--red); clip-path: polygon(50% 0, 100% 100%, 0 100%);
  position: absolute;
}
.v3-tri::before { content: ""; position: absolute; inset: 15px 17px 9px; background: #FFFFFF; clip-path: polygon(50% 0, 100% 100%, 0 100%); }
.v3-tri .ic { position: relative; width: 50px; height: 50px; color: var(--ink); stroke-width: 2.2; }
@media (max-width: 900px) {
  .v3-hero__grid { grid-template-columns: 1fr; gap: 0; }
  .v3-hero__copy { padding-block: 48px 8px; }
  .v3-signs { min-height: 490px; }
  .v3-signs__ring.v3-ring { width: 150px; height: 150px; border-width: 18px; }
  .v3-signs__ring span { font-size: 3.2rem; }
  .v3-signs__dir { top: 210px; }
  .v3-signs__tri { top: 330px; }
}

/* Bilgi şeridi */
.v3-facts { border-bottom: 2px solid var(--ink); }
.v3-facts__row { display: grid; grid-template-columns: repeat(3, 1fr) 1.3fr; }
.v3-facts__row > div { display: grid; gap: 8px; padding: 26px 22px; border-left: 1px solid var(--grid); }
.v3-facts__row > div:first-child { border-left: 0; padding-left: 0; }
.v3-facts dt { font: 700 .74rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.v3-facts dd { font: 800 clamp(1.25rem, 2.1vw, 1.75rem)/1.05 var(--f-disp); font-stretch: 112%; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; user-select: all; }
.v3-facts__addr.v3-facts__addr { font-size: 1.05rem; font-weight: 700; line-height: 1.3; user-select: auto; }
@media (max-width: 900px) {
  .v3-facts__row { grid-template-columns: 1fr 1fr; }
  .v3-facts__row > div:nth-child(3) { border-left: 0; padding-left: 0; }
  .v3-facts__row > div:nth-child(n+3) { border-top: 1px solid var(--grid); }
}
@media (max-width: 480px) {
  .v3-facts__row { grid-template-columns: 1fr; }
  .v3-facts__row > div { border-left: 0; padding-left: 0; }
  .v3-facts__row > div + div { border-top: 1px solid var(--grid); }
}

/* Bölüm başlıkları */
.v3-sechead { display: grid; gap: 0; padding-bottom: 32px; }
.v3-sechead--row { display: flex; justify-content: space-between; align-items: end; gap: 24px; flex-wrap: wrap; }

/* Sınıflar: bento */
.v3-classes { padding-block: 96px; border-bottom: 2px solid var(--ink); }
.v3-bento { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 2px solid var(--ink); border-left: 1px solid var(--grid); }
.v3-cell { display: grid; align-content: start; justify-items: start; gap: 14px; padding: 28px; border-right: 1px solid var(--grid); border-bottom: 1px solid var(--grid); transition: background-color .18s var(--ease-out); }
.v3-cell:hover { background: #FAFAFA; }
.v3-cell h3 { font: 800 1.35rem/1.05 var(--f-disp); font-stretch: 112%; text-transform: uppercase; letter-spacing: -0.01em; }
.v3-cell p { color: var(--muted); }
.v3-cell--big { grid-column: span 2; grid-row: span 2; grid-template-columns: auto 1fr; gap: 40px; align-content: center; align-items: center; padding: 48px; }
.v3-cell--big h3 { font-size: clamp(1.8rem, 3vw, 2.6rem); }
.v3-cell__body { display: grid; gap: 16px; min-width: 0; }
.v3-specs { display: grid; border-top: 2px solid var(--ink); margin-top: 8px; }
.v3-specs li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--grid); }
.v3-specs span { color: var(--muted); font-size: .9rem; }
.v3-specs b { font-weight: 700; text-align: right; }
.v3-plate { padding: 4px 10px; border: 2px solid var(--ink); border-radius: 4px; font: 700 .72rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .1em; text-transform: uppercase; }
.v3-age { margin-top: auto; font-size: .9rem; }
.v3-age b { font: 800 1.2rem/1 var(--f-disp); color: var(--ink); margin-left: 6px; }
.v3-cell--info { grid-column: span 3; grid-template-columns: auto auto 1fr; align-items: center; gap: 24px; background: #F4F6FA; }
.v3-cell--info p { max-width: 60ch; }
.v3-info { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 8px; background: var(--blue); box-shadow: inset 0 0 0 3px var(--blue), inset 0 0 0 5px #FFFFFF; }
.v3-info span { font: 800 2rem/1 Georgia, serif; color: #FFFFFF; }
@media (max-width: 900px) {
  .v3-bento { grid-template-columns: 1fr 1fr; }
  .v3-cell--big { grid-column: span 2; grid-row: auto; grid-template-columns: 1fr; padding: 28px; }
  .v3-cell--info { grid-column: span 2; grid-template-columns: auto 1fr; }
  .v3-cell--info p { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .v3-bento { grid-template-columns: 1fr; }
  .v3-cell--big, .v3-cell--info { grid-column: auto; }
}

/* Süreç */
.v3-steps { padding-block: 96px; border-bottom: 2px solid var(--ink); }
.v3-steps__grid { display: grid; grid-template-columns: 5fr 7fr; gap: 48px; align-items: start; }
.v3-steps__head { position: sticky; top: calc(var(--vs-h) + 120px); display: grid; gap: 18px; }
.v3-steps__list { border-top: 2px solid var(--ink); }
.v3-steps__list li { display: grid; grid-template-columns: 96px 1fr auto; gap: 24px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--grid); }
.v3-steps__n { font: 800 4rem/.8 var(--f-disp); font-stretch: 125%; color: var(--red); font-variant-numeric: tabular-nums; }
.v3-steps__list h3 { font: 800 1.35rem/1.1 var(--f-disp); font-stretch: 112%; text-transform: uppercase; margin-bottom: 6px; }
.v3-steps__list p { color: var(--muted); }
.v3-steps__list .ic { width: 30px; height: 30px; color: var(--ink); stroke-width: 1.6; }
@media (max-width: 860px) {
  .v3-steps__grid { grid-template-columns: 1fr; }
  .v3-steps__head { position: static; }
  .v3-steps__list li { grid-template-columns: 64px 1fr; }
  .v3-steps__list .ic { display: none; }
  .v3-steps__n { font-size: 3rem; }
}

/* Neden */
.v3-why { padding-block: 96px; border-bottom: 2px solid var(--ink); }
.v3-why__grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 2px solid var(--ink); }
.v3-why__grid li { display: grid; gap: 12px; align-content: start; padding: 28px 24px 8px; border-left: 1px solid var(--grid); }
.v3-why__grid li:first-child { border-left: 0; padding-left: 0; }
.v3-why__grid h3 { font: 800 1.15rem/1.15 var(--f-disp); font-stretch: 112%; text-transform: uppercase; }
.v3-why__grid p { color: var(--muted); }
.v3-must { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--blue); color: #FFFFFF; box-shadow: inset 0 0 0 3px var(--blue), inset 0 0 0 5px #FFFFFF; }
.v3-must .ic { width: 26px; height: 26px; stroke-width: 2.2; }
@media (max-width: 900px) {
  .v3-why__grid { grid-template-columns: 1fr 1fr; }
  .v3-why__grid li:nth-child(3) { border-left: 0; padding-left: 0; }
  .v3-why__grid li:nth-child(n+3) { border-top: 1px solid var(--grid); padding-top: 28px; }
}
@media (max-width: 480px) { .v3-why__grid { grid-template-columns: 1fr; } .v3-why__grid li { border-left: 0; padding-left: 0; } .v3-why__grid li + li { border-top: 1px solid var(--grid); } }

/* Mezunlar */
.v3-grads { padding-block: 96px 0; border-bottom: 2px solid var(--ink); }
.v3-grads__row { display: grid; grid-template-columns: repeat(5, 1fr); border-top: 2px solid var(--ink); }
.v3-grads__row .ph { filter: grayscale(1) contrast(1.05); border-left: 1px solid var(--bg); transition: filter .25s var(--ease-out); }
.v3-grads__row .ph:hover { filter: none; }
.v3 .ph figcaption { background: var(--red); border-radius: 0; left: 0; bottom: 0; font-stretch: 125%; letter-spacing: .08em; text-transform: uppercase; padding: 6px 10px; }
.v3 .ph__plac { border-radius: 0; }
@media (max-width: 900px) { .v3-grads__row { grid-template-columns: repeat(3, 1fr); } .v3-grads__row .ph:nth-child(n+4) { display: none; } }
@media (max-width: 520px) { .v3-grads__row { grid-template-columns: 1fr 1fr; } .v3-grads__row .ph:nth-child(n+3) { display: none; } }

/* Konum */
.v3-loc { padding-block: 96px; border-bottom: 2px solid var(--ink); }
.v3-loc__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.v3-dir--panel { padding: 8px; border-radius: 14px; }
.v3-dir__in--panel { display: grid; grid-template-columns: 1fr; gap: 0; padding: 0; border-width: 4px; border-radius: 9px; }
.v3-dir__line { display: flex; align-items: center; gap: 16px; padding: 22px 26px; }
.v3-dir__line + .v3-dir__line { border-top: 3px solid #FFFFFF; }
.v3-dir__line b { font: 800 clamp(1.4rem, 2.8vw, 2.2rem)/1.05 var(--f-disp); font-stretch: 112%; text-transform: uppercase; }
.v3-dir__line--sub { justify-content: space-between; padding-block: 16px; font: 600 1.05rem/1.3 var(--f-body); font-stretch: 112%; }
.v3-dir__line--sub em { font-style: normal; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; }
.v3-loc__copy { display: grid; gap: 18px; justify-items: start; min-width: 0; }
.v3-loc__chips { display: flex; flex-wrap: wrap; gap: 8px; }
.v3-loc__chips li { padding: 8px 12px; border: 2px solid var(--ink); border-radius: 4px; font: 700 .8rem/1 var(--f-body); font-stretch: 112%; text-transform: uppercase; letter-spacing: .05em; }
@media (max-width: 860px) { .v3-loc__grid { grid-template-columns: 1fr; } }

/* Kapanış */
.v3-final { background: var(--ink); color: #FFFFFF; padding-block: 96px; }
.v3-final__grid { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: end; }
.v3-final__h { font-size: clamp(3rem, 9vw, 7.5rem); line-height: .88; letter-spacing: -0.03em; }
.v3-final__side { display: grid; gap: 24px; padding-bottom: 8px; }
.v3-final__side p { color: #C9C9CE; max-width: 40ch; font-size: 1.1rem; }
@media (max-width: 860px) { .v3-final__grid { grid-template-columns: 1fr; } }

/* Alt bilgi */
.v3-foot { padding-block: 56px 28px; font-size: .92rem; }
.v3-foot__grid { display: grid; grid-template-columns: 1.4fr 1fr 1.3fr 1fr; gap: 32px; border-top: 2px solid var(--ink); padding-top: 32px; }
.v3-foot__logo .logo { width: 200px; }
.v3-foot h3 { font: 700 .74rem/1 var(--f-body); font-stretch: 125%; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 12px; }
.v3-foot p { font-variant-numeric: tabular-nums; line-height: 1.8; }
.v3-foot a { text-decoration: none; }
.v3-foot a:hover { color: var(--red); }
.v3-foot__bot { margin-top: 40px; color: var(--muted); font-size: .82rem; }
@media (max-width: 860px) { .v3-foot__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .v3-foot__grid { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) { .v3-signs > * { animation: none; } }