/* Tüm sayfalarda ortak Lunno görünümü */
:root{--display:"Arial Rounded MT Bold",Nunito,Arial,sans-serif}
:where(.hero h1,.page-hero h1,.section h2,.cta-section h2,.article-page h1,.article-page h2,.quick-grid strong,.feature-grid strong,.pillars h2,.character-card h3,.character-info h2,.character-info h3,.game-body h3,.blog-card h3,.tip-card h3,.scenario-grid h3,.series-grid h3,.video-card h3,.resources h2,.steps span,.story-process li span,.story-process li strong,.how-it-works strong,.editorial-pair h3){font-family:var(--display)!important;letter-spacing:-.025em}

/* Lunno nedir: banner tek görsel, kartlar tam görünür */
body[data-page="about"] .about-banner-only{grid-template-columns:1fr;min-height:590px;background-image:linear-gradient(90deg,rgba(223,247,243,.98),rgba(255,250,244,.90) 58%,rgba(255,255,255,.18)),url('assets/hero-field.png')}
body[data-page="about"] .about-banner-only:before{display:none}
body[data-page="about"] .about-banner-only>div{max-width:820px}
body[data-page="about"] .about-rich .pillars article{position:relative;overflow:hidden;border:0;box-shadow:0 18px 45px rgba(41,38,111,.10)}
body[data-page="about"] .about-rich .pillars article:nth-child(1){background:linear-gradient(155deg,#e8f6ff,#fff)}
body[data-page="about"] .about-rich .pillars article:nth-child(2){background:linear-gradient(155deg,#fff4d9,#fff)}
body[data-page="about"] .about-rich .pillars article:nth-child(3){background:linear-gradient(155deg,#f2eaff,#fff)}
body[data-page="about"] .about-rich .pillars img{height:300px;margin-top:20px;background:#fff;object-fit:contain;object-position:center;border-radius:22px;padding:8px}
body[data-page="about"] .about-rich .pillars article:nth-child(3) img{object-fit:cover;padding:0}

/* Kullanım adımları: Lunno paleti ve oyun kartı hissi */
body[data-page="about"] .how-it-works{position:relative;overflow:hidden;background:linear-gradient(135deg,#fff0dc 0%,#f9e8f3 46%,#e8f5ff 100%);color:#272640;border:1px solid #f0d9c7;box-shadow:0 20px 52px rgba(41,38,111,.10)}
body[data-page="about"] .how-it-works:after{content:"";position:absolute;right:-70px;bottom:-90px;width:260px;height:260px;background:url('assets/characters.png') center/contain no-repeat;opacity:.12;pointer-events:none}
body[data-page="about"] .how-it-works h2{color:var(--navy);font-size:clamp(2.4rem,4vw,4rem)}
body[data-page="about"] .how-it-works ol{position:relative;z-index:1;counter-reset:lunno-step}
body[data-page="about"] .how-it-works li{counter-increment:lunno-step;min-height:170px;padding:24px;background:rgba(255,255,255,.86);border:2px solid transparent;box-shadow:0 12px 30px rgba(41,38,111,.08)}
body[data-page="about"] .how-it-works li:nth-child(1){border-color:#ffb3a6}
body[data-page="about"] .how-it-works li:nth-child(2){border-color:#ffd86d}
body[data-page="about"] .how-it-works li:nth-child(3){border-color:#9fd8ff}
body[data-page="about"] .how-it-works li:before{content:"0" counter(lunno-step);display:block;color:var(--orange);font-family:var(--display);font-size:1.7rem;margin-bottom:12px}

/* Büyük ve okunabilir tanıtım görseli */
body[data-page="about"] .about-system{display:flex;flex-direction:column;gap:36px;text-align:center;background:linear-gradient(180deg,#eefaff,#fffaf4)}
body[data-page="about"] .about-system-copy{max-width:920px;margin:auto}
body[data-page="about"] .about-system>img{width:min(1180px,100%);max-height:none;object-fit:contain;border-radius:34px;box-shadow:0 24px 65px rgba(41,38,111,.15)}
body[data-page="about"] .benefit-list{grid-template-columns:repeat(3,1fr)}

/* Ortak CTA: ana sayfadaki açık, katmanlı görünüm */
.cta-section{position:relative;overflow:hidden;background:linear-gradient(120deg,#fff4dc 0%,#eef9ff 48%,#f3edff 100%);color:var(--navy);border-top:1px solid #f0dfca;border-bottom:1px solid #dfe9f3}
.cta-section:after{content:"";position:absolute;inset:auto -7% -70px auto;width:330px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(255,197,90,.28),transparent 68%);pointer-events:none}
.cta-section h2{color:var(--navy)}
.cta-section img{position:relative;z-index:1;filter:drop-shadow(0 20px 22px rgba(41,38,111,.14));animation:ctaBob 5s ease-in-out infinite}
.cta-section .primary.light{background:linear-gradient(135deg,var(--coral),var(--orange));color:#fff;box-shadow:0 12px 28px rgba(255,98,88,.25)}
@keyframes ctaBob{50%{transform:translateY(-12px) rotate(1deg)}}

/* Ana hero: metnin arkasına geçmeyen sakin, canlı renk akışı */
.hero-ambient-motion{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;opacity:.52}
.hero-ambient-motion i{position:absolute;display:block;width:270px;height:270px;border-radius:42% 58% 60% 40%/48% 45% 55% 52%;filter:blur(28px);animation:ambientDrift 13s ease-in-out infinite alternate}
.hero-ambient-motion i:nth-child(1){left:-80px;top:6%;background:rgba(255,179,194,.42)}
.hero-ambient-motion i:nth-child(2){left:42%;bottom:-120px;background:rgba(255,216,109,.38);animation-delay:-4s}
.hero-ambient-motion i:nth-child(3){right:2%;top:4%;background:rgba(149,215,255,.42);animation-delay:-8s}
.hero-ambient-motion i:nth-child(4){right:24%;bottom:4%;background:rgba(190,163,255,.32);animation-delay:-2s}
@keyframes ambientDrift{0%{transform:translate3d(-18px,12px,0) rotate(0) scale(.9)}100%{transform:translate3d(36px,-30px,0) rotate(34deg) scale(1.16)}}

/* İletişim */
.contact-hero{min-height:430px;background:linear-gradient(120deg,#e9fbf6,#fff4dc 50%,#eee8ff);text-align:center;padding:86px 24px 70px}
.contact-hero h1{font-family:var(--display);font-size:clamp(3.4rem,7vw,6.5rem);line-height:.96;color:var(--navy);margin:14px auto 20px;max-width:850px}
.contact-hero p{max-width:700px;margin:auto;font-size:1.1rem}
.contact-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}
.contact-card,.contact-form{background:#fff;border:1px solid var(--line);border-radius:30px;padding:30px;box-shadow:0 16px 42px rgba(41,38,111,.08)}
.contact-card img{display:block;width:220px;margin:0 auto 22px}.contact-card h2,.contact-form h2{font-family:var(--display);color:var(--navy);font-size:2.4rem;margin:0 0 14px}
.contact-links{display:grid;gap:10px;margin-top:22px}.contact-links a{padding:13px 16px;border-radius:16px;background:#f3f0ff;text-decoration:none;font-weight:700;color:var(--navy)}
.contact-form label{display:grid;gap:7px;margin-bottom:16px;font-weight:700;color:var(--navy)}.contact-form input,.contact-form textarea{width:100%;border:1px solid #dcd5cc;border-radius:15px;padding:13px 14px;background:#fffdf9;color:#272640}.contact-form textarea{min-height:150px;resize:vertical}.contact-status{min-height:24px;color:#087f50;font-weight:700}

@media(prefers-reduced-motion:reduce){.hero-ambient-motion,.cta-section img{animation:none!important}.hero-ambient-motion i{animation:none!important}}
@media(max-width:850px){body[data-page="about"] .about-banner-only{min-height:470px}body[data-page="about"] .benefit-list,.contact-layout{grid-template-columns:1fr}.hero-ambient-motion{opacity:.32}}
@media(max-width:560px){body[data-page="about"] .about-rich .pillars img{height:240px}body[data-page="about"] .benefit-list{grid-template-columns:1fr}.contact-card,.contact-form{padding:22px}.contact-hero{padding-top:65px}}

/* Yeni görsel paket düzenlemeleri */
.home-game-screens{background:#fffdf9}
.home-screen-row{display:grid;grid-template-columns:repeat(6,1fr);gap:14px;align-items:stretch}
.home-screen-row a{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:#fff;border:1px solid var(--line);border-radius:24px;padding:14px;box-shadow:0 12px 30px rgba(41,38,111,.07);transition:transform .22s ease,box-shadow .22s ease}
.home-screen-row a:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.home-screen-row img{width:100%;aspect-ratio:9/16;object-fit:cover;object-position:top;border-radius:18px;background:#f6f6fb}
.home-screen-row strong{font-family:Chewy;font-weight:400;font-size:1.35rem;line-height:1;color:var(--navy)}
.home-screen-row span{font-size:.78rem;font-weight:800;color:var(--orange);text-transform:uppercase;letter-spacing:.08em}
.character-info-showcase{background:#fffaf4}
.character-info-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.character-info-grid button{border:0;background:none;padding:0;border-radius:24px;overflow:hidden;cursor:zoom-in;box-shadow:0 14px 30px rgba(41,38,111,.1);transition:transform .22s ease}
.character-info-grid button:hover{transform:translateY(-6px)}
.character-info-grid img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover}
.real-card-gallery{grid-template-columns:repeat(5,1fr);gap:14px;margin-bottom:92px}
.real-card-gallery button:first-child{grid-column:auto}
.real-card-gallery button{position:relative;background:#fff;padding:10px;border:1px solid var(--line);border-radius:22px}
.real-card-gallery img{display:block;min-height:0;width:100%;aspect-ratio:800/1051;object-fit:cover;border-radius:16px}
.real-card-gallery span{display:block;padding:9px 2px 2px;font-size:.78rem;font-weight:800;color:var(--navy);line-height:1.2}
.product-gallery{grid-template-columns:repeat(4,1fr)}
.product-gallery button:first-child{grid-column:auto}
.product-gallery img{min-height:260px;object-fit:cover}
body[data-page="cards"] .page-hero>img{width:min(520px,42vw);max-height:420px;border-radius:24px;object-fit:cover;box-shadow:0 18px 45px rgba(41,38,111,.13)}
body[data-page="games"] .game-card>img{object-fit:contain;background:#f8f5ff;padding:8px}
body[data-page="games"] .game-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-page="games"] .game-card{grid-template-columns:210px 1fr}
body[data-page="games"] .game-card>img{min-height:360px}

@media(max-width:1100px){
  .home-screen-row{grid-template-columns:repeat(3,1fr)}
  .character-info-grid{grid-template-columns:repeat(3,1fr)}
  .real-card-gallery{grid-template-columns:repeat(3,1fr)}
  .product-gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:850px){
  body[data-page="games"] .game-grid{grid-template-columns:1fr}
  body[data-page="games"] .game-card{grid-template-columns:190px 1fr}
}
@media(max-width:560px){
  .home-screen-row{grid-template-columns:repeat(2,1fr)}
  .character-info-grid{grid-template-columns:repeat(2,1fr)}
  .real-card-gallery,.product-gallery{grid-template-columns:repeat(2,1fr)}
  body[data-page="games"] .game-card{grid-template-columns:1fr}
  body[data-page="games"] .game-card>img{height:360px;min-height:0}
}


/* Sayfa üst kısımlarında görselleri sadeleştir */
.floating-bg:after{opacity:.02}
.page-hero{min-height:500px}
.page-hero>img{width:min(340px,32vw);max-height:300px;justify-self:end;align-self:end;opacity:.97}
body[data-page="characters"] .page-hero>img,
body[data-page="story"] .page-hero>img{width:min(450px,38vw);max-height:270px}
body[data-page="games"] .page-hero>img{width:min(300px,24vw);max-height:360px;border-radius:24px;box-shadow:0 18px 40px rgba(41,38,111,.12)}
body[data-page="cards"] .page-hero>img{width:min(360px,30vw);max-height:310px;border-radius:24px;object-fit:cover;box-shadow:0 18px 40px rgba(41,38,111,.12)}
body[data-page="blog"] .page-hero>img{width:min(280px,24vw);max-height:240px}
@media(max-width:850px){.page-hero>img{justify-self:center;align-self:center;width:min(440px,86vw);max-height:300px}}


/* 2026-07-09 banner refinement */
.page-hero{min-height:540px;grid-template-columns:1.08fr .92fr;background-image:linear-gradient(90deg,rgba(223,247,243,.98),rgba(255,250,244,.94) 55%,rgba(255,255,255,.55)),url('assets/hero-field.png');background-position:center;background-size:cover;}
.page-hero:before,.page-hero:after{display:none!important;}
.page-hero>div{max-width:860px;}
.page-hero>img{justify-self:end;align-self:end;opacity:1;filter:drop-shadow(0 22px 34px rgba(39,52,90,.12));}
body[data-page="characters"] .page-hero>img{width:min(520px,40vw)!important;max-height:360px!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;object-fit:contain!important;}
body[data-page="games"] .page-hero>img,
body[data-page="cards"] .page-hero>img,
body[data-page="blog"] .page-hero>img{background:#fff;border:1px solid rgba(41,38,111,.08);border-radius:28px;padding:14px;box-shadow:0 18px 45px rgba(41,38,111,.12);}
body[data-page="games"] .page-hero>img{width:min(320px,24vw)!important;max-height:420px!important;object-fit:cover!important;}
body[data-page="cards"] .page-hero>img{width:min(410px,30vw)!important;max-height:330px!important;object-fit:cover!important;}
body[data-page="blog"] .page-hero>img{width:min(470px,36vw)!important;max-height:290px!important;object-fit:cover!important;}
body[data-page="story"] .page-hero:after{display:block!important;}
body[data-page="story"] .page-hero>img{background:#fff;border:1px solid rgba(41,38,111,.08);border-radius:28px;padding:10px;box-shadow:0 18px 45px rgba(41,38,111,.12);width:min(440px,34vw)!important;max-height:300px!important;object-fit:cover!important;}
.contact-card img{display:block;width:100%;max-width:340px;max-height:240px;object-fit:cover;margin:0 auto 22px;border-radius:24px;box-shadow:0 16px 32px rgba(41,38,111,.12)}
@media(max-width:850px){.page-hero{grid-template-columns:1fr;gap:20px;min-height:unset;padding-bottom:56px}.page-hero>img{justify-self:center;align-self:center}body[data-page="blog"] .page-hero>img,body[data-page="story"] .page-hero>img{width:min(520px,90vw)!important;max-height:280px!important}}


/* 2026-07-09 content placement update */
.page-hero.no-hero-art{grid-template-columns:1fr!important;min-height:500px;}
.page-hero.no-hero-art>div{max-width:880px;}
body[data-page="blog"] .page-hero.no-hero-art{background-image:linear-gradient(90deg,rgba(223,247,243,.66),rgba(255,250,244,.58) 46%,rgba(255,255,255,.10)),url('assets/blog-hero-landscape.png')!important;background-position:center!important;background-size:cover!important;}
body[data-page="cards"] .page-hero.no-hero-art{background-image:linear-gradient(90deg,rgba(223,247,243,.98),rgba(255,250,244,.94) 55%,rgba(255,255,255,.55)),url('assets/hero-field.png')!important;}
body[data-page="story"] .page-hero>img{width:min(620px,46vw)!important;max-height:320px!important;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;object-fit:contain!important;}
body[data-page="games"] .page-hero>img,body[data-page="download"] .page-hero>img{width:min(260px,20vw)!important;max-height:260px!important;background:#fff;border:1px solid rgba(41,38,111,.08);border-radius:32px;padding:12px;box-shadow:0 18px 45px rgba(41,38,111,.12);object-fit:contain!important;}
body[data-page="cards"] .page-hero>img,body[data-page="blog"] .page-hero>img{display:none!important;}
.contact-card img{object-fit:contain!important;background:linear-gradient(180deg,#f9f7ff,#f3fff9);padding:14px;}
.awareness-grid img{height:360px!important;object-fit:cover!important;}
.download-app-icon{width:112px!important;max-width:112px!important;display:block;margin:0 auto 16px!important;padding:0!important;border-radius:24px;}
@media(max-width:850px){.page-hero.no-hero-art{min-height:unset!important;}body[data-page="games"] .page-hero>img,body[data-page="download"] .page-hero>img{width:min(240px,58vw)!important;max-height:240px!important;}.awareness-grid img{height:280px!important;}}

/* Direct APK download page */
.apk-download-card{
  background:#fff;
  border:1px solid rgba(41,38,111,.08);
  border-radius:32px;
  padding:34px 28px;
  text-align:center;
  box-shadow:var(--shadow);
}
.apk-download-card h2{
  font-family:var(--display)!important;
  color:var(--navy);
  font-size:clamp(2.2rem,4vw,3.4rem);
  line-height:1;
  margin:6px 0 12px;
}
.apk-download-card p{
  max-width:360px;
  margin:0 auto 22px;
  color:#56556b;
}
.apk-download-card small{
  display:block;
  margin-top:14px;
  color:#77758b;
  font-weight:700;
}
.download-apk-btn{
  min-height:56px;
  padding:0 34px;
  font-size:1.05rem;
}
.download-explain{
  background:#fff;
  border:1px solid rgba(41,38,111,.08);
  border-radius:28px;
  padding:30px;
  box-shadow:0 14px 34px rgba(41,38,111,.08);
}
.download-explain h2{
  font-family:var(--display)!important;
  color:var(--navy);
  font-size:clamp(2rem,4vw,3rem);
  line-height:1;
  margin:8px 0 12px;
}
.download-explain strong{
  color:var(--orange);
}
@media(max-width:850px){
  .download-apk-btn{width:100%;max-width:320px;}
  .apk-download-card{padding:30px 20px;}
}