/* AxeBug Comics — axebug.com
   Orijinal (Hostinger/Zyro) sayfanın ölçüleri: masaüstünde 1224px içerik genişliği, 920px altında tek sütun (328px).
   Ölçüler orijinal sayfadan alındı; yorumlardaki "y" değerleri bölüm başına göre piksel konumudur. */

@font-face {
  font-family: 'Electrolize';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/electrolize-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/manrope-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('/fonts/manrope-latin-500-normal.woff2') format('woff2');
}

:root {
  --font-primary: 'Electrolize', 'Arial Narrow', sans-serif;
  --font-secondary: 'Manrope', system-ui, sans-serif;
  --black: #000;
  --white: #fff;
  --yellow: #ffd600;
  --pack-yellow: #e8e800;
  --text: #e6e6e6;
  --muted: #888;
  --soft: #d1dadf;
  --panel: #26292e;
  --panel-border: #888;
  --rule: #464646;
  --footer: #323232;
  --light: #fafafa;
  --ink: #1a1a1a;
  --wrap: 1224px;
  --header-h: 113px;
  color-scheme: dark;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: var(--header-h);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}

body {
  margin: 0;
  background: var(--black);
  color: var(--white);
  font-family: var(--font-secondary);
  font-size: 16px;
  line-height: 1.8;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Orijinal metin kutuları white-space: break-spaces kullanıyor (satır sonundaki boşluk taşmaz); satır kırılımları aynı olsun diye */
.hero__title,
.hero__lead,
.hero__note,
.card__title,
.card__text,
.panel__title,
.panel__text p,
.panel__quote p,
.panel__quote footer,
.whatson__intro h3,
.whatson__intro p,
.kit__name,
.kit__list p,
.package__text p,
.package__level,
.about__list li,
.about__banner,
.section-title,
.contact__title,
.site-footer__address h2,
.site-footer__address p,
.site-footer__copy {
  white-space: break-spaces;
}

img,
video,
iframe {
  display: block;
  max-width: 100%;
}
img {
  height: auto;
}

h1,
h2,
h3,
p,
ul,
blockquote {
  margin: 0;
}
h1,
h2,
h3 {
  font-weight: 400;
}
ul {
  padding: 0;
  list-style: none;
}
a {
  color: inherit;
}

.wrap {
  width: min(var(--wrap), 100% - 32px);
  margin-inline: auto;
  position: relative;
}

.skip-link {
  position: absolute;
  left: 16px;
  top: -60px;
  z-index: 100;
  padding: 10px 16px;
  background: var(--yellow);
  color: var(--black);
  font-family: var(--font-primary);
}
.skip-link:focus {
  top: 16px;
}

:focus-visible {
  outline: 2px solid var(--yellow);
  outline-offset: 3px;
}

/* ---------- Düğmeler ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-primary);
  font-size: 16px;
  line-height: 1.2;
  letter-spacing: 0.02em;
  text-align: center;
  text-decoration: none;
  border-radius: 0;
  transition:
    background-color 0.2s ease,
    color 0.2s ease,
    border-color 0.2s ease;
}
.btn--light {
  background: var(--white);
  color: var(--black);
}
.btn--light:hover {
  background: var(--yellow);
}
.btn--outline {
  background: var(--black);
  color: #fefefe;
  border: 1px solid #fefefe;
}
.btn--outline:hover {
  background: var(--yellow);
  color: var(--black);
  border-color: var(--yellow);
}
.btn--login {
  padding: 12px 31px;
  letter-spacing: 0;
  background: var(--white);
  color: var(--black);
  border: 2px solid var(--yellow);
  border-radius: 25px;
}
.btn--login:hover {
  background: var(--yellow);
  border-color: var(--black);
}

/* ---------- Üst bilgi ---------- */
.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 50;
  height: var(--header-h);
  transition: background-color 0.25s ease;
}
.site-header.is-scrolled,
.site-header.is-open {
  background: var(--black);
}
.site-header__inner {
  display: flex;
  align-items: center;
  height: 100%;
  padding-inline: 16px;
}
.site-header__logo img {
  width: 140px;
  height: 49px;
}
.site-nav {
  margin-left: auto;
  display: flex;
  align-items: center;
  gap: 14px;
}
.site-nav__links {
  display: flex;
  gap: 41px;
  margin-right: 0;
}
.site-nav__links a {
  font-family: var(--font-primary);
  font-size: 14px;
  line-height: 1.2;
  letter-spacing: 0.01em;
  color: var(--white);
  text-decoration: none;
  transition: color 0.2s ease;
}
.site-nav__links a:hover {
  color: var(--yellow);
}
.burger {
  display: none;
}

/* ---------- Video arka planlar ---------- */
.bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  background: var(--black);
}

/* ---------- Hero (yükseklik 1443, üst bilgi dahil) ---------- */
.hero {
  position: relative;
  min-height: 1443px;
  overflow: hidden;
  background: #0b0b10 url('/assets/hero-poster.jpg') center / cover no-repeat;
}
.hero__shade {
  position: absolute;
  inset: 0;
  background: rgb(0 0 0 / 0.16);
}
.hero__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 193px;
  padding-bottom: 300px;
  text-align: center;
}
.hero__art {
  position: relative;
  width: 100%;
  aspect-ratio: 1224 / 413;
}
.hero__motto {
  position: absolute;
  left: 8.415%;
  top: 0;
  width: 48.448%;
}
.hero__ship {
  position: absolute;
  left: 55.229%;
  top: 2.9%;
  width: 44.771%;
}
.hero__title {
  margin-top: 140px;
  font-family: var(--font-primary);
  font-size: 72px;
  line-height: 1.3;
}
.hero__lead {
  margin-top: 17px;
  max-width: 1016px;
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 1.3;
}
.hero__cta {
  margin-top: 49px;
  width: 269px;
  height: 52px;
}
.hero__note {
  margin-top: 40px;
  font-size: 16px;
  line-height: 1.8;
}

/* ---------- Karakterler ve kutular (yükseklik 3856) ---------- */
.intro {
  background: var(--black);
  padding: 109px 0 272px;
}
.cards {
  display: grid;
  grid-template-columns: repeat(3, 194px);
  justify-content: center;
  column-gap: 115px;
  align-items: start;
  text-align: center;
}
.card img {
  width: 194px;
  margin-inline: auto;
}
.card__title {
  margin-top: 38px;
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 1.3;
}
.card__text {
  margin-top: 42px;
  font-family: var(--font-primary);
  font-size: 14px;
  line-height: 1.3;
  color: var(--muted);
}
.card--1 {
  padding-top: 19px;
}
.card--3 {
  padding-top: 75px;
}
.card--3 .card__title {
  margin-top: 22px;
}
.card--3 .card__text {
  margin-top: 58px;
}

.panel {
  position: relative;
  width: min(1047px, 100%);
  margin: 159px auto 0;
  padding: 39px 35px var(--pb);
  min-height: var(--mh);
  background: var(--panel);
  border: 10px solid var(--panel-border);
  border-left-width: 9px;
}
.panel + .panel {
  margin-top: var(--gap-before);
}
.panel__title {
  margin-bottom: 23px;
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 1.3;
  text-align: center;
  color: var(--soft);
}
.panel__title--white {
  color: var(--white);
}
.panel__text {
  font-family: var(--font-primary);
  font-size: 17px;
  line-height: 1.3;
  color: var(--text);
}
.panel__text p + p {
  margin-top: 15px;
}
.panel--4c .panel__text p + p:nth-child(2) {
  margin-top: 8px;
}
.panel__text strong {
  font-weight: 700;
}
.panel__art {
  position: absolute;
  left: 50%;
  bottom: calc(-1 * var(--overhang));
  width: var(--art-w);
  max-width: none;
  transform: translateX(-50%);
}
.panel--4c {
  --mh: 484px;
  --pb: 92px;
  --art-w: min(978px, 95.2%);
  --overhang: 141px;
}
.panel--einstein {
  --mh: 484px;
  --pb: 158px;
  --art-w: min(689px, 67%);
  --overhang: 218px;
  --gap-before: 313px;
  padding-top: 41px;
}
.panel--einstein .panel__art {
  aspect-ratio: 689 / 366;
  object-fit: cover;
}
.panel--einstein .panel__title,
.panel--einstein .panel__quote p {
  margin-bottom: 15px;
}
.panel__quote {
  margin-bottom: 44px;
  font-family: var(--font-primary);
  line-height: 1.3;
  text-align: center;
  color: var(--soft);
}
.panel__quote p {
  font-size: 38px;
}
.panel__quote footer {
  font-size: 20px;
}
.panel--english {
  --mh: 380px;
  --pb: 108px;
  --art-w: min(792px, 77%);
  --overhang: 224px;
  --gap-before: 359px;
}
.panel--english .panel__title {
  margin-bottom: 38px;
}
.panel--inter {
  --mh: 352px;
  --pb: 127px;
  --art-w: min(853px, 83%);
  --overhang: 183px;
  --gap-before: 316px;
  padding-top: 41px;
}
.panel--inter .panel__title {
  margin-bottom: 44px;
}

/* ---------- What's On (yükseklik 1740) ---------- */
.whatson {
  position: relative;
  padding: 92px 0 174px;
  background: var(--black);
  /* background-attachment: fixed eşdeğeri: sabit video bu bölümün sınırlarında görünür */
  clip-path: inset(0);
}
.fixed-bg {
  position: fixed;
  inset: 0;
  z-index: 0;
  background: #05060a url('/assets/stars-poster.jpg') center / cover no-repeat;
}
.whatson > .wrap {
  z-index: 1;
}
.section-title {
  font-family: var(--font-primary);
  font-size: 72px;
  line-height: 1.3;
  text-align: center;
}
.whatson__intro {
  margin-top: 7px;
  max-width: 1016px;
  margin-inline: auto;
  text-align: center;
}
.whatson__intro h3 {
  margin-bottom: 12px;
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 1.3;
}
.whatson__intro p {
  font-family: var(--font-primary);
  font-size: 16px;
  line-height: 1.8;
  color: var(--text);
}
.kits {
  display: grid;
  grid-template-columns: repeat(3, 297px);
  justify-content: center;
  column-gap: 63px;
  margin-top: 154px;
  text-align: center;
}
.kit__blob {
  display: block;
  width: 297px;
  height: 353px;
  border-radius: 36px;
  overflow: hidden;
  -webkit-mask: var(--blob) center / 100% 100% no-repeat;
  mask: var(--blob) center / 100% 100% no-repeat;
}
.kit__blob img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.kit--1 .kit__blob {
  --blob: url('/assets/blob-1.svg');
}
.kit--2 .kit__blob {
  --blob: url('/assets/blob-2.svg');
}
.kit--3 .kit__blob {
  --blob: url('/assets/blob-3.svg');
}
.kit__name {
  margin-top: 27px;
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 1.3;
}
.kit__name a {
  text-decoration: none;
}
.kit__name a:hover {
  color: var(--yellow);
}
.kit__list {
  margin-top: 18px;
  font-family: var(--font-primary);
  font-size: 18px;
  line-height: 1.5;
  color: var(--text);
}
.kit__list strong {
  font-weight: 700;
}
.kit__list p:not(:last-child) {
  margin-bottom: 8px;
}
.kit__list p.kit__gap14 {
  margin-bottom: 14px;
}
.kit__list p.kit__gap8 {
  margin-bottom: 8px;
}
.muted {
  color: var(--muted);
}
.kit-links {
  display: flex;
  justify-content: center;
  gap: 71px;
  margin-top: 62px;
}
.kit-links .btn {
  width: 503px;
  height: 52px;
  padding-inline: 16px;
}

/* ---------- Paketler ---------- */
.package {
  position: relative;
  padding-top: 92px;
  background: var(--black);
  overflow: hidden;
}
.glow {
  position: absolute;
  max-width: none;
  object-fit: cover;
  pointer-events: none;
}
.package--1 .glow {
  left: 0;
  top: -91px;
  width: 803px;
  height: 663px;
}
.package--2 .glow {
  right: 0;
  top: -68px;
  width: 503px;
  height: 501px;
}
.package--3 .glow {
  left: 69px;
  top: -68px;
  width: 503px;
  height: 501px;
}
.package .section-title,
.package__grid,
.package .rule {
  position: relative;
}
.package__grid {
  display: grid;
  grid-template-columns: 503px 664px;
  justify-content: space-between;
  align-items: start;
  margin-top: 54px;
}
.package__media img {
  width: 503px;
  aspect-ratio: 503 / 500;
  object-fit: cover;
}
.package__level {
  margin-top: 73px;
  font-family: var(--font-primary);
  font-size: 24px;
  line-height: 1.3;
  text-align: center;
  color: var(--pack-yellow);
}
.package__level strong {
  font-weight: 700;
}
.package__text {
  font-family: var(--font-primary);
  font-size: 16px;
  line-height: 1.5;
  color: var(--white);
}
.package--2 .package__text {
  line-height: 1.8;
}
.package__text p {
  margin-bottom: 15px;
}
.package--1 .package__text p:first-child {
  margin-bottom: 17px;
}
.package__text strong {
  font-weight: 700;
}
/* Orijinalde paragraf Manrope, içindeki metin Electrolize: karışık yazı tipi satırları biraz uzatır; aynı yükseklik için korunur */
.package__text p,
.panel--4c .panel__text p:not(:first-child) {
  font-family: var(--font-secondary);
}
.package__text p > *,
.panel--4c .panel__text p > * {
  font-family: var(--font-primary);
}
.package--2 .package__text p {
  font-family: var(--font-primary);
}
.package__text span {
  color: var(--muted);
}
.rule {
  width: min(712px, 100%);
  height: 4px;
  margin: 117px auto 27px;
  border: 0;
  background: var(--rule);
}
.package--2 .package__level {
  margin-top: 119px;
}
.package--2 .rule {
  margin-top: 200px;
  margin-bottom: 26px;
}
.package--3 .rule {
  margin-top: 46px;
  margin-bottom: 46px;
}

/* ---------- Hakkımızda (yükseklik 1011) ---------- */
.about {
  position: relative;
  padding: 92px 0 80px;
  background: var(--black);
  overflow: hidden;
}
.about__grid {
  display: grid;
  grid-template-columns: 1fr 606px;
  min-height: 476px;
  margin-top: 68px;
}
.about__art {
  position: relative;
}
.about__art .glow {
  left: 11px;
  top: 190px;
  width: 752px;
  height: 502px;
}
.about__motto {
  position: relative;
  width: 480px;
  margin: 30px 0 0 103px;
  -webkit-mask: url('/assets/motto-mask.svg') center / 100% 100% no-repeat;
  mask: url('/assets/motto-mask.svg') center / 100% 100% no-repeat;
}
.about__list {
  position: relative;
  padding: 0 33px 0 34px;
  list-style: disc;
  font-family: var(--font-primary);
  font-size: 18px;
  line-height: 1.5;
  color: var(--text);
}
.about__list li {
  margin-bottom: 8px;
}
.about__list li::marker {
  color: var(--text);
}
.about__banner {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: min(598px, 100%);
  min-height: 69px;
  margin: 0 auto;
  margin-top: 132px;
  padding: 4px 20px;
  background: var(--yellow);
  color: var(--black);
  font-family: var(--font-primary);
  font-size: 32px;
  line-height: 1.3;
  text-align: center;
}
.about__banner strong {
  font-weight: 700;
}

/* ---------- Galeri (yükseklik 941) ---------- */
.gallery {
  padding: 112px 0 87px;
  background: var(--black);
}
.gallery__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 50px 10px;
  width: min(1008px, 100%);
  margin-inline: auto;
}
.gallery__grid a {
  display: block;
  aspect-ratio: 329 / 290;
  overflow: hidden;
}
/* Orijinal: görsel kare kırpılır, kutu dikeyde ortadan keser */
.gallery__grid img {
  position: relative;
  top: 50%;
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
  transform: translateY(-50%);
  transition: transform 0.3s ease;
}
.gallery__grid a:hover img {
  transform: translateY(-50%) scale(1.03);
}
.gallery__cta {
  display: flex;
  width: min(503px, 100%);
  height: 52px;
  margin: 59px auto 0;
  padding-inline: 12px;
}

.lightbox {
  width: 100vw;
  height: 100vh;
  max-width: none;
  max-height: none;
  margin: 0;
  padding: 0;
  border: 0;
  background: rgb(0 0 0 / 0.92);
}
.lightbox[open] {
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox::backdrop {
  background: rgb(0 0 0 / 0.6);
}
.lightbox__img {
  max-width: min(92vw, 1600px);
  max-height: 86vh;
  width: auto;
  height: auto;
}
.lightbox button {
  position: absolute;
  border: 0;
  background: transparent;
  color: var(--white);
  font-size: 48px;
  line-height: 1;
  cursor: pointer;
  padding: 8px 16px;
}
.lightbox__close {
  top: 16px;
  right: 16px;
}
.lightbox__nav--prev {
  left: 8px;
  top: 50%;
  transform: translateY(-50%);
}
.lightbox__nav--next {
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
}

/* ---------- İletişim (yükseklik 830) ---------- */
.contact {
  padding: 102px 0 118px;
  background: var(--light);
  color: var(--ink);
  color-scheme: light;
}
.contact__title {
  font-family: var(--font-primary);
  font-size: 48px;
  line-height: 1.3;
  text-align: center;
  color: #323232;
}
.contact__grid {
  display: grid;
  grid-template-columns: 509px 400px;
  justify-content: space-between;
  align-items: start;
  margin-top: 49px;
  padding-left: 103px;
  padding-right: 103px;
}
.contact__map {
  width: 509px;
  height: 416px;
  margin-top: 12px;
  border: 0;
  background: #eef0f4;
}
.contact-form {
  display: flex;
  flex-direction: column;
  gap: 22px;
  font-family: var(--font-secondary);
}
.field label {
  display: block;
  font-size: 16px;
  line-height: 1.8;
  color: var(--ink);
}
.field input,
.field textarea {
  display: block;
  width: 100%;
  height: 48px;
  padding: 12px 16px;
  border: 1px solid #f1f1f1;
  border-radius: 0;
  background: #f1f1f1;
  color: var(--ink);
  font: 16px/1.4 var(--font-secondary);
}
.field textarea {
  height: 96px;
  resize: vertical;
}
.field input:focus,
.field textarea:focus {
  outline: none;
  border-color: var(--ink);
}
.field [aria-invalid='true'] {
  border-color: #c4271e;
}
.field__error {
  min-height: 0;
  font-size: 13px;
  line-height: 1.4;
  color: #c4271e;
}
.field__error:empty {
  display: none;
}
.field__error:not(:empty) {
  margin-top: 4px;
}
.hp {
  position: absolute;
  left: -10000px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
.btn--submit {
  align-self: center;
  margin-top: 9px;
  padding: 14px 32px;
  border: 1px solid var(--black);
  background: var(--black);
  color: var(--white);
  font-family: var(--font-secondary);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
}
.btn--submit:hover {
  background: var(--yellow);
  color: var(--black);
}
.btn--submit[disabled] {
  opacity: 0.6;
  cursor: progress;
}
.form-status {
  font-size: 15px;
  line-height: 1.5;
  text-align: center;
}
.form-status:empty {
  display: none;
}
.form-status.is-ok {
  color: #146c2e;
}
.form-status.is-error {
  color: #c4271e;
}

/* ---------- Alt bilgi (yükseklik 239) ---------- */
.site-footer {
  background: var(--footer);
  color: var(--white);
}
.site-footer__inner {
  min-height: 239px;
  padding: 80px 0 40px 103px;
}
.site-footer__address {
  max-width: min(843px, 100% - 300px);
}
.site-footer__address h2 {
  font-family: var(--font-primary);
  font-size: 24px;
  font-weight: 700;
  line-height: 1.3;
}
.site-footer__address p {
  font-family: var(--font-primary);
  font-size: 13px;
  line-height: 1.3;
}
.site-footer__address a {
  text-decoration: none;
}
.site-footer__address a:hover {
  color: var(--yellow);
}
.social {
  position: absolute;
  top: 84px;
  right: 103px;
  display: flex;
  gap: 21px;
}
.social a {
  display: block;
  color: var(--white);
  transition: color 0.2s ease;
}
.social a:hover {
  color: var(--yellow);
}
.social svg {
  display: block;
}
.site-footer__maker {
  position: absolute;
  top: 120px;
  right: 84px;
  width: 180px;
  height: 60px;
}
.site-footer__copy {
  position: absolute;
  top: 176px;
  left: 103px;
  font-family: var(--font-primary);
  font-size: 10px;
  line-height: 1.3;
}

/* ---------- Kaydırınca beliren öğeler (yalnız JS açıkken) ---------- */
.js .reveal {
  opacity: 0;
  transform: translateY(40px);
  transition:
    opacity 0.7s ease,
    transform 0.7s ease;
}
.js .reveal.is-visible {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  .js .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* ---------- Orta genişlik (921–1239): masaüstü düzeni esner ---------- */
@media (max-width: 1239px) and (min-width: 921px) {
  .cards {
    column-gap: 8%;
  }
  .kits {
    grid-template-columns: repeat(3, minmax(0, 297px));
    column-gap: 4%;
  }
  .kit__blob {
    width: 100%;
    height: auto;
    aspect-ratio: 297 / 353;
  }
  .kit-links {
    gap: 32px;
  }
  .kit-links .btn {
    width: auto;
    flex: 1 1 0;
    max-width: 503px;
  }
  .package__grid {
    grid-template-columns: 41% 54%;
  }
  .package__media img {
    width: 100%;
  }
  .about__grid {
    grid-template-columns: 1fr 50%;
  }
  .about__motto {
    width: min(480px, 90%);
    margin-left: 5%;
  }
  .contact__grid {
    grid-template-columns: minmax(0, 509px) minmax(0, 400px);
    column-gap: 40px;
    padding-inline: 0;
  }
  .contact__map {
    width: 100%;
  }
  .site-footer__inner {
    padding-left: 16px;
  }
  .social {
    right: 16px;
  }
  .site-footer__maker {
    right: 0;
  }
  .site-footer__copy {
    left: 16px;
  }
}

/* ---------- Mobil (≤ 920px): 328px'lik tek sütun ---------- */
@media (max-width: 920px) {
  :root {
    --header-h: 81px;
  }
  .wrap {
    width: min(328px, 100% - 32px);
  }
  @media (min-width: 600px) {
    .wrap {
      width: 560px;
    }
  }

  .site-header__inner {
    width: 100%;
    padding-inline: 32px;
  }
  .burger {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
    height: 18px;
    margin-left: auto;
    padding: 0;
    border: 0;
    background: none;
    cursor: pointer;
  }
  .burger::before {
    content: '';
    position: absolute;
    inset: -13px;
  }
  .burger {
    position: relative;
  }
  .burger span {
    display: block;
    height: 2px;
    background: var(--white);
    transition:
      transform 0.25s ease,
      opacity 0.25s ease;
  }
  .site-header.is-open .burger span:nth-child(1) {
    transform: translateY(8px) rotate(45deg);
  }
  .site-header.is-open .burger span:nth-child(2) {
    opacity: 0;
  }
  .site-header.is-open .burger span:nth-child(3) {
    transform: translateY(-8px) rotate(-45deg);
  }
  .site-nav {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: flex-end;
    gap: 14px;
    padding: 0 16px 24px;
    background: var(--black);
  }
  .site-header.is-open .site-nav {
    display: flex;
  }
  .site-nav__links {
    flex-direction: column;
    align-items: flex-end;
    gap: 13px;
  }
  /* 44px dokunma alanı */
  .site-nav__links a {
    display: block;
    padding: 13px 0;
  }
  .btn--login {
    font-size: 14px;
  }

  /* Hero (mobil yükseklik 973) */
  .hero {
    min-height: 973px;
    background-image: url('/assets/hero-poster-800.jpg');
  }
  .hero__inner {
    padding-top: 105px;
    padding-bottom: 37px;
  }
  .hero__title {
    order: 1;
    margin-top: 0;
    font-size: 40px;
  }
  .hero__art {
    order: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    aspect-ratio: auto;
    margin-top: 0;
  }
  .hero__motto,
  .hero__ship {
    position: static;
  }
  .hero__ship {
    order: 1;
    width: 229px;
    height: 193px;
    object-fit: cover;
  }
  .hero__motto {
    order: 2;
    width: 328px;
    margin-top: -32px;
  }
  .hero__lead {
    order: 3;
    margin-top: 23px;
    font-size: 20px;
  }
  .hero__note {
    order: 4;
    margin-top: 15px;
    font-size: 14px;
    line-height: 1.3;
  }
  .hero__cta {
    order: 5;
    margin-top: 28px;
    width: 223px;
    font-size: 14px;
  }

  /* Karakterler ve kutular (mobil yükseklik 2795) */
  .intro {
    padding: 38px 0 32px;
  }
  .cards {
    grid-template-columns: 1fr;
    row-gap: 40px;
  }
  .card--1,
  .card--3 {
    padding-top: 0;
  }
  .card--1 img {
    width: 178px;
  }
  .card--2 img,
  .card--3 img {
    width: 164px;
  }
  .card__title,
  .card--3 .card__title {
    margin-top: 16px;
    font-size: 18px;
  }
  .card__text,
  .card--3 .card__text {
    margin-top: 8px;
    font-size: 16px;
  }
  .panel {
    width: 100%;
    margin-top: 56px;
    padding: 22px 14px var(--pb);
    border-width: 9px 9px 7px;
  }
  .panel + .panel {
    margin-top: var(--gap-before);
  }
  /* Orijinalde 11px; telefonda okunur olsun diye büyütüldü */
  .panel__title {
    margin-bottom: 8px;
    font-size: 15px;
  }
  .panel__text {
    font-size: 13px;
  }
  .panel__text p + p {
    margin-top: 10px;
  }
  .panel__quote p {
    font-size: 16px;
  }
  .panel__quote footer {
    font-size: 14px;
  }
  .panel--4c {
    --mh: 391px;
    --pb: 84px;
    --art-w: 100%;
    --overhang: 21px;
  }
  .panel--einstein {
    --mh: 273px;
    --pb: 70px;
    --art-w: 207px;
    --overhang: 61px;
    --gap-before: 66px;
    padding-top: 14px;
  }
  .panel--einstein .panel__title,
  .panel--einstein .panel__quote p,
  .panel__quote footer {
    margin-bottom: 12px;
  }
  .panel__quote {
    margin-bottom: 12px;
  }
  .panel--english {
    --mh: 240px;
    --pb: 70px;
    --art-w: 248px;
    --overhang: 60px;
    --gap-before: 100px;
    padding-top: 10px;
  }
  .panel--english .panel__title {
    margin-bottom: 4px;
  }
  .panel--inter {
    --mh: 222px;
    --pb: 84px;
    --art-w: 100%;
    --overhang: 58px;
    --gap-before: 106px;
    padding-top: 20px;
  }
  .panel--inter .panel__title {
    margin-bottom: 4px;
  }
  .intro > .wrap {
    padding-bottom: 58px;
  }

  /* What's On (mobil yükseklik 2361) */
  .whatson {
    padding: 24px 0 40px;
  }
  .section-title {
    font-size: 32px;
  }
  .whatson__intro {
    margin-top: 4px;
  }
  .whatson__intro h3 {
    font-size: 20px;
  }
  .whatson__intro p {
    line-height: 1.27;
  }
  .kits {
    grid-template-columns: 1fr;
    row-gap: 48px;
    margin-top: 55px;
  }
  .kit__blob {
    width: 158px;
    height: 189px;
    margin-inline: auto;
  }
  .kit__name {
    margin-top: 24px;
    font-size: 20px;
  }
  .kit__list {
    margin-top: 16px;
    font-size: 14px;
    line-height: 1.3;
  }
  .kit-links {
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-top: 36px;
  }
  .kit-links .btn {
    width: 290px;
    font-size: 10px;
  }
  .kit-links .btn + .btn {
    width: 100%;
  }

  /* Paketler */
  .package {
    padding-top: 16px;
  }
  .package__grid {
    grid-template-columns: 1fr;
    margin-top: 16px;
  }
  .package__media {
    display: contents;
  }
  .package__media img {
    width: 100%;
    aspect-ratio: 328 / 320;
  }
  .package__text {
    margin-top: 33px;
    font-size: 14px;
    line-height: 1.3;
  }
  .package--2 .package__text {
    line-height: 1.3;
  }
  .package__level {
    order: 3;
    margin-top: 28px;
    font-size: 18px;
  }
  .package__text {
    order: 2;
  }
  .rule,
  .package--2 .rule,
  .package--3 .rule {
    width: 200px;
    height: 3px;
    margin: 38px auto 22px;
  }
  .package--2 .package__level {
    margin-top: 28px;
  }
  .package--1 .glow {
    left: 0;
    top: 556px;
    width: 100%;
    height: 268px;
  }
  .package--2 .glow {
    left: 0;
    right: auto;
    top: 304px;
    width: 100%;
    height: 320px;
  }
  .package--3 .glow {
    left: 0;
    top: 453px;
    width: 100%;
    height: 320px;
  }

  /* Hakkımızda (mobil yükseklik 924) */
  .about {
    padding: 47px 0 48px;
  }
  .about__grid {
    grid-template-columns: 1fr;
    margin-top: 16px;
  }
  .about__art .glow {
    left: 0;
    top: -119px;
    width: 100%;
    height: 320px;
  }
  .about__motto {
    width: 221px;
    margin: 0 auto;
  }
  .about__list {
    margin-top: 34px;
    padding: 0 0 0 40px;
    font-size: 14px;
    line-height: 1.3;
  }
  .about__banner {
    margin-top: 25px;
    min-height: 109px;
    padding: 12px 8px;
  }

  /* Galeri (mobil yükseklik 627) */
  .gallery {
    padding: 16px 0 45px;
  }
  .gallery__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px 12px;
  }
  .gallery__grid a {
    aspect-ratio: 158 / 150;
  }
  .gallery__cta {
    width: 100%;
    margin-top: 16px;
    font-size: 12px;
  }

  /* İletişim (mobil yükseklik 879) */
  .contact {
    padding: 49px 0 42px;
  }
  .contact__title {
    font-size: 32px;
  }
  .contact__grid {
    grid-template-columns: 1fr;
    row-gap: 40px;
    margin-top: 14px;
    padding-inline: 0;
  }
  .contact__map {
    width: 100%;
    height: 200px;
    margin-top: 0;
  }

  /* Alt bilgi (mobil yükseklik 322) */
  .site-footer__inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 56px 0 48px;
  }
  .social,
  .site-footer__maker,
  .site-footer__copy {
    position: static;
  }
  .site-footer__address {
    align-self: stretch;
    max-width: none;
  }
  .site-footer__address h2 {
    font-size: 20px;
  }
  .site-footer__address p {
    font-size: 11px;
  }
  .social {
    margin: 8px 0 0;
    gap: 2px;
  }
  .social a {
    padding: 12px;
  }
  .site-footer__maker {
    width: 119px;
    height: 40px;
    margin: 0;
  }
  .site-footer__copy {
    align-self: stretch;
    margin-top: 20px;
    font-size: 9px;
  }
}

/* ---------- Tablet (600–920px): tek sütun düzeni daha geniş ve okunaklı (orijinalde yok, iyileştirme) ---------- */
@media (min-width: 600px) and (max-width: 920px) {
  .hero__ship {
    width: 340px;
    height: auto;
  }
  .hero__motto {
    width: 480px;
    margin-top: -40px;
  }
  .hero__lead {
    font-size: 22px;
  }
  .cards {
    grid-template-columns: repeat(3, 1fr);
    column-gap: 24px;
    align-items: end;
  }
  .card {
    display: flex;
    flex-direction: column;
    height: 100%;
  }
  .card img,
  .card--1 img,
  .card--2 img,
  .card--3 img {
    width: 140px;
    margin-top: auto;
  }
  .card__text,
  .card--3 .card__text {
    font-size: 14px;
    min-height: 13em;
  }
  .panel__title {
    font-size: 18px;
  }
  .panel__text {
    font-size: 14px;
  }
  .panel__quote p {
    font-size: 22px;
  }
  .panel--einstein {
    --art-w: 62%;
    --overhang: 90px;
    --pb: 90px;
  }
  .panel--english {
    --art-w: 74%;
    --overhang: 100px;
    --pb: 100px;
    --gap-before: 150px;
  }
  .panel--inter {
    --art-w: 82%;
    --overhang: 90px;
    --pb: 110px;
    --gap-before: 130px;
  }
  .panel--4c {
    --overhang: 40px;
    --pb: 110px;
  }
  .kit__blob {
    width: 200px;
    height: 238px;
  }
  .kit__list {
    font-size: 16px;
  }
  .kit-links .btn,
  .kit-links .btn + .btn {
    width: 100%;
    font-size: 13px;
  }
  .package__text {
    font-size: 15px;
  }
  .about__motto {
    width: 320px;
  }
  .about__list {
    font-size: 16px;
  }
  .gallery__grid {
    grid-template-columns: repeat(3, 1fr);
  }
  .gallery__cta {
    font-size: 14px;
  }
  .contact__map {
    height: 300px;
  }
}

/* ---------- 404 ---------- */
.not-found {
  min-height: 100vh;
  background: #05060a url('/assets/stars-poster.jpg') center / cover no-repeat;
}
.not-found__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
  padding: 80px 0;
  text-align: center;
  font-family: var(--font-primary);
  font-size: 20px;
}
.not-found .btn {
  padding: 16px 32px;
}
@media (max-width: 920px) {
  .not-found .section-title {
    font-size: 32px;
  }
}