/* =====================================================
   OZİ • MERAK ORMANI
   forest.css
===================================================== */

/* ---------- HERO ---------- */

.forest-hero{

  padding:90px 0 70px;

  background:
    linear-gradient(180deg,#DFFFF8,#C9FFF1);

  position:relative;

  overflow:hidden;

}

.forest-hero::before{

  content:"";

  position:absolute;
  inset:0;

  background:
    radial-gradient(circle at top left,
    rgba(255,255,255,.55),transparent 45%);

  pointer-events:none;

}

.forest-hero-grid{

  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:60px;
  align-items:center;

}

.forest-hero h1{

  font-size:64px;
  color:#0D8EA0;
  margin:20px 0;

}

.forest-hero p{

  font-size:22px;
  line-height:1.8;
  max-width:560px;

}

.hero-chip{

  display:inline-block;
  background:#FFFFFF;
  color:#0D8EA0;
  padding:12px 22px;
  border-radius:999px;
  font-weight:800;
  box-shadow:0 10px 25px rgba(0,0,0,.08);

}

.forest-ozi{

  display:flex;
  justify-content:center;

}

.forest-ozi img{

  width:min(420px,100%);
  animation:oziForest 4s ease-in-out infinite;
  filter:drop-shadow(0 25px 35px rgba(0,0,0,.18));

}

@keyframes oziForest{

  0%{transform:translateY(0);}
  50%{transform:translateY(-15px);}
  100%{transform:translateY(0);}

}

/* ---------- BÖLÜMLER ---------- */

.forest-area{

  padding:100px 0;

}

.forest-area.light{

  background:#F4FFF9;

}

/* ---------- KARTLAR ---------- */

.forest-grid{

  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:28px;

}

.forest-card{

  background:white;
  border-radius:28px;
  padding:28px;
  text-align:center;
  box-shadow:0 15px 35px rgba(0,0,0,.08);

  transition:.35s ease;

  position:relative;
  overflow:hidden;

}

.forest-card::before{

  content:"";

  position:absolute;
  inset:0;

  background:
    linear-gradient(180deg,
    rgba(20,200,216,.08),
    transparent);

  opacity:0;
  transition:.35s;

}

.forest-card:hover{

  transform:translateY(-12px) scale(1.02);

  box-shadow:0 24px 45px rgba(20,200,216,.22);

}

.forest-card:hover::before{

  opacity:1;

}

.card-emoji{

  font-size:60px;
  margin-bottom:18px;
  animation:bounceEmoji 4s infinite;

}

@keyframes bounceEmoji{

  0%,100%{
    transform:translateY(0);
  }

  50%{
    transform:translateY(-10px);
  }

}

.forest-card h3{

  color:#0D8EA0;
  font-size:28px;
  margin-bottom:12px;

}

.forest-card p{

  font-size:18px;
  line-height:1.5;

}

/* ---------- OZİ MESAJ ---------- */

.forest-end{

  padding:90px 0 120px;

  background:
    linear-gradient(180deg,#E9FFF8,#D4FFF3);

}

.ozi-box{

  background:
    linear-gradient(135deg,#18C8D9,#6BEAF5);

  color:white;

  border-radius:34px;

  padding:36px;

  display:flex;
  justify-content:space-between;
  align-items:center;

  gap:30px;

}

.ozi-box h3{

  font-size:34px;
  margin-bottom:14px;

}

.ozi-box p{

  font-size:22px;
  line-height:1.7;

}

.ozi-box img{

  width:190px;
  animation:oziForest 4s infinite;

}

/* ---------- YAPRAK EFEKTİ ---------- */

.forest-area::after{

  content:"🍃";

  position:absolute;
  right:5%;
  font-size:34px;
  opacity:.15;

  animation:leafFloat 7s ease-in-out infinite;

}

.forest-area{

  position:relative;

}

@keyframes leafFloat{

  0%{
    transform:translateY(0) rotate(0);
  }

  50%{
    transform:translateY(20px) rotate(20deg);
  }

  100%{
    transform:translateY(0) rotate(0);
  }

}

/* ---------- MOBİL ---------- */

@media(max-width:900px){

  .forest-hero-grid{

    grid-template-columns:1fr;
    text-align:center;

  }

  .forest-hero p{

    margin:auto;

  }

  .forest-ozi{

    order:-1;

  }

  .ozi-box{

    flex-direction:column;
    text-align:center;

  }

}

@media(max-width:600px){

  .forest-hero h1{

    font-size:42px;

  }

  .forest-hero p{

    font-size:19px;

  }

  .section-title h2{

    font-size:38px;

  }

  .forest-card{

    padding:22px;

  }

  .card-emoji{

    font-size:50px;

  }

}
/* ==========================================================
   OZİ MERAK ORMANI GOLD
   FOREST.CSS 1/3
========================================================== */

/* ---------- Sayfa Temeli ---------- */

.forest-page{
    background:linear-gradient(180deg,#EFFFF8 0%,#F8FFF1 45%,#FFFDF5 100%);
    color:#23412D;
    overflow-x:hidden;
}

.forest-page section{
    padding:90px 0;
    position:relative;
}

.container{
    width:min(1180px,92%);
    margin:auto;
}

/* ---------- Hero ---------- */

.forest-hero{
    min-height:100vh;
    display:flex;
    align-items:center;
    position:relative;
    overflow:hidden;
}

.forest-hero-bg{
    position:absolute;
    inset:0;
}

.forest-hero-bg img{
    width:100%;
    height:100%;
    object-fit:cover;
    transform:scale(1.05);
}

.forest-overlay{
    position:absolute;
    inset:0;
    background:
        linear-gradient(to right,
        rgba(6,54,34,.78),
        rgba(18,116,85,.35),
        rgba(0,0,0,.08));
}

.forest-hero-container{
    position:relative;
    z-index:5;
    display:grid;
    grid-template-columns:1.1fr .9fr;
    gap:40px;
    align-items:center;
}

/* ---------- Hero Yazıları ---------- */

.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:10px;
    padding:10px 18px;
    border-radius:999px;
    background:#DFFFEF;
    color:#13734A;
    font-weight:700;
    margin-bottom:18px;
}

.forest-hero h2{
    font-size:clamp(2.6rem,6vw,4.7rem);
    line-height:1.05;
    color:white;
    margin-bottom:20px;
}

.forest-hero p{
    color:#EBFFF5;
    font-size:1.15rem;
    line-height:1.8;
    max-width:560px;
}

/* ---------- OZİ ---------- */

.forest-ozi{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

.ozi-main{
    width:min(420px,90%);
    filter:drop-shadow(0 30px 35px rgba(0,0,0,.25));
}

/* ---------- Konuşma Balonu ---------- */

.speech-bubble.large{
    position:absolute;
    top:-20px;
    left:-20px;
    background:white;
    padding:20px;
    border-radius:24px;
    width:260px;
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.speech-bubble.large strong{
    color:#16A34A;
}

.speech-bubble.large::after{
    content:"";
    position:absolute;
    bottom:-12px;
    left:42px;
    width:24px;
    height:24px;
    background:white;
    transform:rotate(45deg);
}

/* ---------- Hero Özellikleri ---------- */

.hero-features{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:30px;
}

.feature-pill{
    background:rgba(255,255,255,.16);
    color:white;
    padding:12px 18px;
    border-radius:999px;
    backdrop-filter:blur(10px);
    border:1px solid rgba(255,255,255,.25);
}

/* ---------- Ateş Böcekleri ---------- */

.fireflies span{
    position:absolute;
    width:10px;
    height:10px;
    background:#FFF4A0;
    border-radius:50%;
    box-shadow:0 0 18px #FFF7C5;
    animation:firefly 8s ease-in-out infinite;
}

.fireflies span:nth-child(1){top:12%;left:18%;}
.fireflies span:nth-child(2){top:30%;left:82%;animation-delay:1s;}
.fireflies span:nth-child(3){top:55%;left:12%;animation-delay:2s;}
.fireflies span:nth-child(4){top:70%;left:70%;animation-delay:3s;}
.fireflies span:nth-child(5){top:42%;left:48%;animation-delay:4s;}

@keyframes firefly{
    0%,100%{transform:translateY(0) scale(.6);opacity:.3;}
    50%{transform:translateY(-24px) scale(1.3);opacity:1;}
}

/* ---------- Yapraklar ---------- */

.forest-leaves .leaf{
    position:absolute;
    width:44px;
    animation:leafFloat 14s linear infinite;
    opacity:.9;
}

.leaf-1{left:8%;top:12%;}
.leaf-2{right:8%;top:22%;animation-delay:4s;}
.leaf-3{left:55%;top:8%;animation-delay:2s;}

@keyframes leafFloat{
    0%{transform:translateY(-20px) rotate(0deg);}
    50%{transform:translateY(30px) rotate(120deg);}
    100%{transform:translateY(120px) rotate(240deg);}
}

/* ---------- Dalga ---------- */

.wave-divider{
    position:absolute;
    bottom:-2px;
    width:100%;
    left:0;
}

.wave-divider svg{
    display:block;
    width:100%;
}

/* ---------- Ortak Başlık ---------- */

.section-heading{
    text-align:center;
    max-width:760px;
    margin:0 auto 60px;
}

.section-heading h2{
    font-size:2.4rem;
    color:#14532D;
    margin:18px 0;
}

.section-heading p{
    color:#5B7565;
    line-height:1.8;
}

.section-badge{
    display:inline-flex;
    background:#E6FFF2;
    color:#169D60;
    padding:10px 18px;
    border-radius:999px;
    font-weight:700;
}

/* ---------- Bilgi Kartları ---------- */

.waterfall-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
}

.water-card{
    background:white;
    padding:30px;
    border-radius:28px;
    text-align:center;
    box-shadow:0 15px 35px rgba(22,140,87,.08);
    transition:.35s;
}

.water-card img{
    width:74px;
    margin-bottom:18px;
}

.water-card:hover{
    transform:translateY(-8px);
}

/* ---------- Ağaç Ev ---------- */

.treehouse-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.treehouse-image img{
    width:100%;
}

.treehouse-content h2{
    font-size:2.3rem;
    margin:18px 0;
}

.treehouse-list{
    display:grid;
    gap:16px;
    margin:30px 0;
}

.tree-item{
    background:white;
    padding:18px 20px;
    border-radius:18px;
    box-shadow:0 8px 20px rgba(0,0,0,.05);
    font-weight:600;
}
/* ==========================================================
   OZİ MERAK ORMANI GOLD
   FOREST.CSS 2/3
   Merak Patikası • Harita • Hayvanlar • Çiçek Vadisi
========================================================== */

/* ----------------------------------------------------------
   MERAK PATİKASI
---------------------------------------------------------- */

.trail-section{
    background:linear-gradient(180deg,#F8FFF3,#ECFFF8);
}

.trail-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:28px;
}

.trail-card{
    position:relative;
    background:white;
    padding:28px;
    border-radius:28px;
    box-shadow:0 18px 35px rgba(22,140,87,.08);
    transition:.35s;
    overflow:hidden;
}

.trail-card:hover{
    transform:translateY(-10px);
    box-shadow:0 24px 45px rgba(22,140,87,.16);
}

.trail-card img{
    width:74px;
    height:74px;
    margin-bottom:18px;
}

.trail-card h3{
    color:#157347;
    margin-bottom:10px;
}

.trail-card p{
    color:#5F7668;
    line-height:1.7;
}

.trail-number{
    position:absolute;
    top:18px;
    right:20px;
    font-size:3rem;
    font-weight:800;
    color:rgba(22,163,74,.08);
}

/* ----------------------------------------------------------
   PATİKA HARİTASI
---------------------------------------------------------- */

.forest-map-section{
    background:#DDFBF0;
}

.forest-map-wrapper{
    position:relative;
    max-width:900px;
    margin:auto;
}

.forest-map-image{
    width:100%;
    border-radius:36px;
    box-shadow:0 20px 40px rgba(0,0,0,.12);
}

.forest-map-ozi{
    position:absolute;
    bottom:20px;
    left:25px;
    width:110px;
}

.trail-pin{
    position:absolute;
    width:46px;
    height:46px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:white;
    font-size:22px;
    box-shadow:0 8px 20px rgba(0,0,0,.18);
    animation:pinBounce 2s infinite ease-in-out;
}

.pin-1{top:14%;left:18%;}
.pin-2{top:30%;left:60%;}
.pin-3{top:48%;left:35%;}
.pin-4{top:60%;left:72%;}
.pin-5{top:72%;left:48%;}
.pin-6{top:82%;left:22%;}

@keyframes pinBounce{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-10px);}
}

/* ----------------------------------------------------------
   GÜNÜN GÖREVİ
---------------------------------------------------------- */

.daily-nature-section{
    background:linear-gradient(180deg,#F4FFF5,#FFFFFF);
}

.nature-card{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:36px;
    background:white;
    border-radius:36px;
    padding:40px;
    box-shadow:0 20px 45px rgba(0,0,0,.08);
}

.nature-left img{
    width:100%;
}

.nature-right h2{
    margin:16px 0;
    color:#146C43;
}

.mission-list{
    display:grid;
    gap:14px;
    margin:24px 0;
}

.mission-item{
    padding:16px 20px;
    border-radius:18px;
    background:#F2FFF7;
    border-left:6px solid #34C759;
    font-weight:600;
    color:#24553C;
}

/* ----------------------------------------------------------
   KELEBEK KORUSU
---------------------------------------------------------- */

.butterfly-section{
    background:linear-gradient(180deg,#FFFDF8,#F8FFF9);
}

.butterfly-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:center;
}

.butterfly-gallery{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
}

.butterfly-gallery img{
    width:100%;
    padding:18px;
    border-radius:24px;
    background:white;
    box-shadow:0 12px 28px rgba(0,0,0,.08);
    animation:floatButterfly 5s ease-in-out infinite;
}

.butterfly-gallery img:nth-child(2){
    animation-delay:1s;
}

.butterfly-gallery img:nth-child(3){
    animation-delay:2s;
}

.butterfly-gallery img:nth-child(4){
    animation-delay:3s;
}

@keyframes floatButterfly{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-12px);}
}

.nature-facts{
    display:grid;
    gap:12px;
    margin-top:24px;
}

.nature-facts li{
    list-style:none;
    background:white;
    padding:14px 18px;
    border-radius:16px;
    box-shadow:0 8px 20px rgba(0,0,0,.05);
}

/* ----------------------------------------------------------
   GÖKKUŞAĞI KÖPRÜSÜ
---------------------------------------------------------- */

.rainbow-section{
    background:linear-gradient(180deg,#F3F9FF,#FFFFFF);
}

.rainbow-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:40px;
    align-items:center;
}

.rainbow-image img{
    width:100%;
}

.rainbow-list{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:28px 0;
}

.rainbow-list .color{
    padding:10px 16px;
    border-radius:999px;
    color:white;
    font-weight:700;
}

.red{background:#FF5C5C;}
.orange{background:#FF983A;}
.yellow{background:#FFD449;color:#5B4700 !important;}
.green{background:#28B463;}
.blue{background:#2D7CFF;}
.indigo{background:#4450D8;}
.violet{background:#944CFF;}

/* ----------------------------------------------------------
   HAYVANLAR
---------------------------------------------------------- */

.animals-section{
    background:linear-gradient(180deg,#F8FFF2,#EEFFF7);
}

.animal-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
    gap:26px;
}

.animal-card{
    background:white;
    border-radius:28px;
    padding:22px;
    text-align:center;
    box-shadow:0 15px 35px rgba(0,0,0,.07);
    transition:.35s;
}

.animal-card:hover{
    transform:translateY(-8px);
}

.animal-card img{
    width:120px;
    height:120px;
    object-fit:contain;
    margin-bottom:18px;
}

.animal-card h3{
    color:#146C43;
    margin-bottom:10px;
}

.animal-tag{
    display:inline-block;
    margin-bottom:12px;
    padding:6px 14px;
    border-radius:999px;
    background:#ECFFF5;
    color:#188E58;
    font-size:.85rem;
    font-weight:700;
}

.animal-fact{
    margin-top:16px;
    padding:14px;
    border-radius:16px;
    background:#F7FFF9;
    color:#2D6448;
    font-size:.95rem;
    border:1px dashed #7DD7A6;
}

/* ----------------------------------------------------------
   SİNCAP TEPESİ
---------------------------------------------------------- */

.squirrel-section{
    background:#FFFDF8;
}

.squirrel-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:center;
}

.squirrel-image img{
    width:100%;
}

.squirrel-content h2{
    margin:18px 0;
    color:#835114;
}

/* ----------------------------------------------------------
   KUŞ SESLERİ
---------------------------------------------------------- */

.birds-section{
    background:#F0FBFF;
}

.bird-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:24px;
}

.bird-card{
    background:white;
    border-radius:24px;
    padding:24px;
    text-align:center;
    box-shadow:0 10px 25px rgba(0,0,0,.06);
}

.bird-card img{
    width:90px;
    margin-bottom:16px;
}

/* ----------------------------------------------------------
   BUGÜN NE ÖĞRENDİM
---------------------------------------------------------- */

.forest-learning-section{
    background:#FFFDF5;
}

.learning-card{
    display:grid;
    grid-template-columns:240px 1fr;
    gap:40px;
    background:white;
    border-radius:32px;
    padding:36px;
    box-shadow:0 16px 35px rgba(0,0,0,.08);
}

.learning-card img{
    width:100%;
}

.learning-list{
    display:grid;
    gap:14px;
    margin-top:22px;
}

.learning-item{
    padding:14px 18px;
    border-radius:14px;
    background:#F6FFF8;
    border-left:5px solid #43C36A;
    font-weight:600;
}

/* ----------------------------------------------------------
   ÇİÇEK VADİSİ
---------------------------------------------------------- */

.flower-valley-section{
    background:linear-gradient(180deg,#FFF6FB,#FFFFFF);
}

.flower-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:24px;
}

.flower-card{
    background:white;
    border-radius:28px;
    padding:24px;
    text-align:center;
    box-shadow:0 12px 28px rgba(255,95,170,.12);
    transition:.35s;
}

.flower-card:hover{
    transform:translateY(-8px) rotate(-2deg);
}

.flower-card img{
    width:90px;
    margin-bottom:16px;
}

.flower-card h3{
    color:#E91E63;
}
/* ==========================================================
   OZİ MERAK ORMANI GOLD
   FOREST.CSS 3/3
   Laboratuvar • Mantar • Arılar • Timeline • Responsive
========================================================== */

/* ----------------------------------------------------------
   BİTKİ LABORATUVARI
---------------------------------------------------------- */

.plant-lab-section{
    background:linear-gradient(180deg,#F4FFF8,#FFFFFF);
}

.plant-lab-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.plant-lab-image img{
    width:100%;
    animation:floatLab 6s ease-in-out infinite;
}

@keyframes floatLab{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-12px);}
}

.plant-lab-content h2{
    margin:18px 0;
    color:#1B7F4F;
    font-size:2.2rem;
}

.plant-steps{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
    margin:30px 0;
}

.step-card{
    background:white;
    padding:22px;
    border-radius:22px;
    text-align:center;
    box-shadow:0 12px 28px rgba(34,139,94,.08);
    transition:.35s;
}

.step-card:hover{
    transform:translateY(-6px);
}

.step-card strong{
    display:block;
    margin:10px 0 6px;
    color:#1B7F4F;
}

/* ----------------------------------------------------------
   MANTAR BAHÇESİ
---------------------------------------------------------- */

.mushroom-section{
    background:linear-gradient(180deg,#FFF8F1,#FFFFFF);
}

.mushroom-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:24px;
}

.mushroom-card{
    background:white;
    padding:24px;
    border-radius:26px;
    text-align:center;
    box-shadow:0 12px 28px rgba(180,95,35,.08);
    transition:.35s;
}

.mushroom-card:hover{
    transform:translateY(-8px) rotate(-1deg);
}

.mushroom-card img{
    width:95px;
    margin-bottom:16px;
}

.mushroom-card h3{
    color:#A04E1A;
}

.forest-tip{
    margin-top:40px;
    padding:22px 28px;
    border-radius:22px;
    background:#FFF3D9;
    border-left:8px solid #FFB84D;
    color:#6C4B12;
    line-height:1.8;
}

/* ----------------------------------------------------------
   TOHUMLA BÜYÜME
---------------------------------------------------------- */

.growth-section{
    background:linear-gradient(180deg,#F8FFF2,#ECFFF5);
}

.growth-timeline{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
    gap:20px;
}

.growth-step{
    position:relative;
    background:white;
    padding:24px 18px;
    border-radius:24px;
    text-align:center;
    box-shadow:0 12px 24px rgba(20,110,60,.08);
    transition:.35s;
}

.growth-step:hover{
    transform:translateY(-8px);
}

.growth-step::after{
    content:"🌱";
    position:absolute;
    top:-14px;
    right:16px;
    font-size:24px;
}

.growth-step h4{
    margin:12px 0;
    color:#198754;
}

/* ----------------------------------------------------------
   BAL FABRİKASI
---------------------------------------------------------- */

.bee-section{
    background:linear-gradient(180deg,#FFFCEB,#FFF9D5);
}

.bee-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:center;
}

.bee-content h2{
    color:#A36B00;
    margin:18px 0;
}

.bee-list{
    display:grid;
    gap:14px;
    margin-top:26px;
}

.bee-item{
    background:white;
    padding:16px 20px;
    border-radius:18px;
    box-shadow:0 8px 20px rgba(255,184,0,.08);
    border-left:5px solid #FFD54A;
    font-weight:600;
}

.bee-image{
    display:flex;
    justify-content:center;
}

.bee-image img{
    width:260px;
    animation:beeFly 5s ease-in-out infinite;
}

@keyframes beeFly{
    0%,100%{transform:translateY(0) rotate(-4deg);}
    50%{transform:translateY(-14px) rotate(4deg);}
}

/* ----------------------------------------------------------
   DOĞA KARTLARI
---------------------------------------------------------- */

.nature-cards-section{
    background:#F4FFF8;
}

.nature-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:22px;
}

.nature-card{
    background:white;
    padding:26px;
    border-radius:24px;
    text-align:center;
    box-shadow:0 12px 25px rgba(0,0,0,.06);
    transition:.35s;
}

.nature-card:hover{
    transform:translateY(-8px);
}

.nature-card h3{
    color:#1D8F57;
    margin:12px 0;
}

/* ----------------------------------------------------------
   ORTAK BUTONLAR
---------------------------------------------------------- */

.forest-page .btn-primary{
    background:linear-gradient(135deg,#34C759,#17A85A);
    color:white;
    border:none;
    border-radius:999px;
    padding:15px 28px;
    font-weight:700;
    transition:.35s;
}

.forest-page .btn-primary:hover{
    transform:translateY(-3px);
    box-shadow:0 12px 25px rgba(52,199,89,.35);
}

.forest-page .btn-secondary{
    background:white;
    color:#157347;
    border:2px solid #BFEED2;
    border-radius:999px;
    padding:14px 24px;
    font-weight:700;
}

.forest-page .btn-secondary:hover{
    background:#EFFFF6;
}

/* ----------------------------------------------------------
   HOVER LIFT
---------------------------------------------------------- */

.hover-lift{
    transition:.35s;
}

.hover-lift:hover{
    transform:translateY(-8px);
}

/* ----------------------------------------------------------
   ARKA PLAN SÜSLEMELERİ
---------------------------------------------------------- */

.flower-valley-section::before,
.bee-section::before,
.mushroom-section::before{
    content:"";
    position:absolute;
    inset:0;
    pointer-events:none;
    opacity:.05;
    background-image:
      radial-gradient(circle at 20% 20%,#34C759 3px,transparent 4px),
      radial-gradient(circle at 70% 35%,#FF70A6 3px,transparent 4px),
      radial-gradient(circle at 40% 80%,#FFD54A 3px,transparent 4px);
    background-size:180px 180px;
}

/* ----------------------------------------------------------
   RESPONSIVE
---------------------------------------------------------- */

@media (max-width:992px){

.forest-hero-container,
.treehouse-container,
.butterfly-container,
.rainbow-container,
.nature-card,
.learning-card,
.plant-lab-container,
.squirrel-container,
.bee-container{

grid-template-columns:1fr;

}

.speech-bubble.large{
position:relative;
left:0;
top:0;
width:100%;
margin-bottom:20px;
}

.plant-steps{
grid-template-columns:1fr;
}

.waterfall-grid{
grid-template-columns:1fr;
}

}

@media (max-width:768px){

.forest-page section{
padding:70px 0;
}

.section-heading h2{
font-size:2rem;
}

.hero-features{
justify-content:center;
}

.trail-grid,
.animal-grid,
.flower-grid,
.mushroom-grid,
.nature-grid,
.bird-grid{
grid-template-columns:1fr;
}

.growth-timeline{
grid-template-columns:repeat(2,1fr);
}

.forest-map-ozi{
width:80px;
}

.trail-pin{
width:38px;
height:38px;
font-size:18px;
}

}

@media (max-width:480px){

.growth-timeline{
grid-template-columns:1fr;
}

.hero-badge,
.section-badge{
font-size:.8rem;
padding:8px 14px;
}

.forest-hero h2{
font-size:2.2rem;
}

}

/* ----------------------------------------------------------
   SAYFA GİRİŞ ANİMASYONLARI
---------------------------------------------------------- */

.forest-page section{
animation:fadeForest .8s ease both;
}

.forest-page section:nth-of-type(odd){
animation-delay:.05s;
}

.forest-page section:nth-of-type(even){
animation-delay:.15s;
}

@keyframes fadeForest{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}

/* ----------------------------------------------------------
   OZİ GOLD SONU
---------------------------------------------------------- */
/* ==========================================================
   OZİ TV — MERAK ORMANI GOLD BONUS PATCH
   (MASTER BUILD 5/8 → 8/8)
========================================================== */

/* ----------------------------------------------------------
   LABORATUVAR
---------------------------------------------------------- */

.laboratory-section{
    background:linear-gradient(180deg,#EFFFF7,#F7FFF9);
    position:relative;
    overflow:hidden;
}

.laboratory-section::before{
    content:"";
    position:absolute;
    inset:0;
    opacity:.05;
    background-image:radial-gradient(circle,#34C759 2px,transparent 2px);
    background-size:90px 90px;
}

.laboratory-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:60px;
    align-items:center;
}

.lab-ozi{
    width:100%;
    max-width:420px;
    animation:oziFloat 5s ease-in-out infinite;
}

.lab-tools{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
    margin-top:30px;
}

.lab-tool{
    background:white;
    border-radius:20px;
    padding:18px;
    text-align:center;
    font-weight:700;
    color:#17643E;
    box-shadow:0 10px 25px rgba(22,140,87,.08);
}

/* ----------------------------------------------------------
   BÜYÜTEÇ
---------------------------------------------------------- */

.magnifier-section{
    background:#FFFDF7;
}

.magnifier-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:22px;
}

.magnifier-card{
    background:white;
    padding:24px;
    border-radius:24px;
    text-align:center;
    box-shadow:0 10px 28px rgba(0,0,0,.06);
}

.magnifier-card img{
    width:110px;
    margin-bottom:18px;
    transition:.35s;
}

.magnifier-card:hover img{
    transform:scale(1.08);
}

/* ----------------------------------------------------------
   MİNİ DENEYLER
---------------------------------------------------------- */

.experiment-section{
    background:linear-gradient(180deg,#F4FAFF,#FFFFFF);
}

.experiment-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
    gap:24px;
}

.experiment-card{
    background:white;
    border-radius:26px;
    padding:26px;
    position:relative;
    box-shadow:0 14px 32px rgba(55,125,255,.08);
}

.experiment-number{
    position:absolute;
    top:18px;
    right:18px;
    width:44px;
    height:44px;
    border-radius:50%;
    background:#2D7CFF;
    color:white;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
}

/* ----------------------------------------------------------
   MERAK DEFTERİ
---------------------------------------------------------- */

.journal-section{
    background:#FFF9ED;
}

.journal-container{
    display:grid;
    grid-template-columns:320px 1fr;
    gap:50px;
    align-items:center;
}

.journal-image img{
    width:100%;
}

.journal-list{
    display:grid;
    gap:14px;
    margin:26px 0;
}

.journal-item{
    background:white;
    padding:16px 20px;
    border-radius:16px;
    border-left:5px solid #FFB347;
    font-weight:600;
}

/* ----------------------------------------------------------
   DOĞA DEDEKTİFİ
---------------------------------------------------------- */

.detective-section{
    background:#F4FFF4;
}

.detective-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:22px;
}

.detective-card{
    background:white;
    border-radius:24px;
    padding:22px;
    text-align:center;
    box-shadow:0 10px 24px rgba(20,120,70,.08);
}

.detective-icon{
    font-size:2.4rem;
    display:block;
    margin-bottom:12px;
}

/* ----------------------------------------------------------
   MERAK SORUSU
---------------------------------------------------------- */

.quiz-section{
    background:linear-gradient(180deg,#EEF7FF,#FFFFFF);
}

.quiz-container{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:50px;
    align-items:center;
}

.quiz-left img{
    width:100%;
}

.quiz-card,
.quiz-right{
    background:white;
    border-radius:28px;
    padding:30px;
    box-shadow:0 15px 35px rgba(0,0,0,.08);
}

.quiz-options,
.quiz-buttons{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin:24px 0;
}

/* ----------------------------------------------------------
   OYUN PARKI
---------------------------------------------------------- */

.forest-games-section{
    background:linear-gradient(180deg,#EFFFF6,#FFFFFF);
}

.games-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
    gap:24px;
}

.game-card{
    background:white;
    border-radius:28px;
    padding:26px;
    text-align:center;
    box-shadow:0 14px 30px rgba(0,0,0,.06);
    transition:.35s;
}

.game-card:hover{
    transform:translateY(-10px);
}

.game-card img{
    width:90px;
    margin-bottom:18px;
}

/* ----------------------------------------------------------
   KELEBEK OYUNU
---------------------------------------------------------- */

.butterfly-game-section{
    background:#FFFDF8;
}

.butterfly-game-container{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:center;
}

.score-board{
    display:flex;
    gap:18px;
    margin:24px 0;
}

.score-item{
    flex:1;
    background:white;
    padding:18px;
    border-radius:18px;
    text-align:center;
    box-shadow:0 8px 18px rgba(0,0,0,.06);
}

.score-item strong{
    display:block;
    font-size:2rem;
    color:#16A34A;
}

.butterfly-game-right{
    position:relative;
    min-height:340px;
}

.game-butterfly{
    position:absolute;
    width:90px;
}

.butterfly-a{
    top:0;
    left:15%;
    animation:butterflyFly 8s infinite ease-in-out;
}

.butterfly-b{
    top:80px;
    right:10%;
    animation:butterflyFly 7s infinite ease-in-out;
}

.butterfly-c{
    bottom:20px;
    left:40%;
    animation:butterflyFly 6s infinite ease-in-out;
}

.butterfly-d{
    bottom:100px;
    right:30%;
    animation:butterflyFly 9s infinite ease-in-out;
}

@keyframes butterflyFly{
    0%,100%{
        transform:translate(0,0) rotate(0deg);
    }
    25%{
        transform:translate(20px,-20px) rotate(6deg);
    }
    50%{
        transform:translate(-10px,18px) rotate(-6deg);
    }
    75%{
        transform:translate(25px,-12px) rotate(4deg);
    }
}

/* ----------------------------------------------------------
   FINDIK AVI
---------------------------------------------------------- */

.acorn-section{
    background:#FFF8EE;
}

.acorn-board{
    display:grid;
    grid-template-columns:260px 1fr;
    gap:40px;
    align-items:center;
}

.acorn-basket{
    background:white;
    padding:28px;
    border-radius:26px;
    text-align:center;
    box-shadow:0 12px 24px rgba(150,90,20,.08);
}

.acorn-basket img{
    width:90px;
    margin-bottom:12px;
}

.acorn-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:18px;
}

.acorn-btn{
    border:none;
    background:white;
    font-size:2rem;
    padding:18px;
    border-radius:20px;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 8px 18px rgba(0,0,0,.05);
}

.acorn-btn:hover{
    transform:scale(1.08);
    background:#FFF3D5;
}

/* ----------------------------------------------------------
   ROZETLER
---------------------------------------------------------- */

.forest-badges-section{
    background:#F7FFF7;
}

.badge-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:24px;
}

.forest-badge-card{
    background:white;
    padding:26px;
    border-radius:26px;
    text-align:center;
    box-shadow:0 10px 25px rgba(0,0,0,.06);
}

.forest-badge-card img{
    width:95px;
    margin-bottom:18px;
}

/* ----------------------------------------------------------
   YILDIZ PANOSU
---------------------------------------------------------- */

.stars-board-section{
    background:linear-gradient(180deg,#FFFCEB,#FFFDF5);
}

.stars-board{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:50px;
    align-items:center;
}

.stars-left img{
    width:100%;
}

.stars-progress{
    height:16px;
    background:#E9F5EC;
    border-radius:999px;
    overflow:hidden;
    margin:24px 0;
}

.stars-progress-fill{
    width:80%;
    height:100%;
    background:linear-gradient(90deg,#FFD84D,#FFB347);
    border-radius:999px;
}

.stars-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}

.stars-stats div{
    background:white;
    border-radius:18px;
    padding:18px;
    text-align:center;
}

.stars-stats strong{
    display:block;
    font-size:1.5rem;
    color:#E39A00;
}

/* ----------------------------------------------------------
   FOTOĞRAF GALERİSİ
---------------------------------------------------------- */

.photo-grid,
.gallery-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:18px;
}

.photo-card,
.gallery-card{
    overflow:hidden;
    border-radius:24px;
    box-shadow:0 10px 24px rgba(0,0,0,.08);
}

.photo-card img,
.gallery-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.45s;
}

.photo-card:hover img,
.gallery-card:hover img{
    transform:scale(1.08);
}

.gallery-card.large{
    grid-column:span 2;
    grid-row:span 2;
}

.gallery-card.wide{
    grid-column:span 2;
}

/* ----------------------------------------------------------
   HİKÂYE
---------------------------------------------------------- */

.story-section{
    background:#FFFDF7;
}

.story-container{
    display:grid;
    grid-template-columns:320px 1fr;
    gap:50px;
    align-items:center;
}

.story-left img{
    width:100%;
}

.story-text{
    line-height:2;
    color:#4C6654;
    margin:20px 0 30px;
}

/* ----------------------------------------------------------
   KAMP ATEŞİ
---------------------------------------------------------- */

.campfire-section{
    background:linear-gradient(180deg,#FFF5E6,#FFFBEF);
}

.campfire-container{
    display:grid;
    grid-template-columns:1fr 320px;
    gap:40px;
    align-items:center;
}

.campfire-image img{
    width:100%;
    animation:fireGlow 3s ease-in-out infinite;
}

.campfire-features{
    display:grid;
    gap:14px;
    margin-top:24px;
}

.campfire-item{
    background:white;
    padding:14px 18px;
    border-radius:16px;
}

@keyframes fireGlow{
    0%,100%{
        transform:scale(1);
        filter:drop-shadow(0 0 8px rgba(255,150,0,.25));
    }
    50%{
        transform:scale(1.05);
        filter:drop-shadow(0 0 18px rgba(255,140,0,.5));
    }
}

/* ----------------------------------------------------------
   BUGÜN ORMANDA
---------------------------------------------------------- */

.today-section{
    background:#F3FFF6;
}

.today-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
    gap:24px;
}

.today-card{
    background:white;
    border-radius:24px;
    padding:24px;
}

.today-icon{
    font-size:2rem;
    display:block;
    margin-bottom:12px;
}

/* ----------------------------------------------------------
   TAKVİM
---------------------------------------------------------- */

.calendar-section{
    background:#F8FFF9;
}

.calendar-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
    gap:18px;
}

.calendar-day{
    background:white;
    padding:20px;
    border-radius:18px;
    text-align:center;
    font-weight:600;
}

.calendar-day strong{
    display:block;
    color:#157347;
    margin-bottom:10px;
}

/* ----------------------------------------------------------
   SÜRPRİZ
---------------------------------------------------------- */

.surprise-section{
    background:linear-gradient(180deg,#FFF8FB,#FFFDFE);
}

.surprise-container{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:40px;
    align-items:center;
}

.surprise-left img{
    width:100%;
}

/* ----------------------------------------------------------
   ORMAN KURALLARI
---------------------------------------------------------- */

.forest-rules-section{
    background:#F0FFF3;
}

.rules-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:22px;
}

.rule-card{
    background:white;
    padding:26px;
    border-radius:22px;
    text-align:center;
}

/* ----------------------------------------------------------
   VEDA
---------------------------------------------------------- */

.forest-goodbye-section{
    background:linear-gradient(180deg,#EFFFF7,#D8F8E9);
    text-align:center;
}

.goodbye-container{
    max-width:760px;
    margin:auto;
}

.goodbye-container img{
    width:220px;
    margin-bottom:20px;
    animation:oziFloat 4s ease-in-out infinite;
}

@keyframes oziFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-12px);}
}

/* ----------------------------------------------------------
   DOĞA SESLERİ
---------------------------------------------------------- */

.forest-sounds-section{
    background:#F4FCFF;
}

.sound-grid{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(170px,1fr));
    gap:20px;
}

.sound-card{
    background:white;
    border:none;
    border-radius:24px;
    padding:24px;
    cursor:pointer;
    text-align:center;
    box-shadow:0 10px 25px rgba(0,0,0,.06);
    transition:.35s;
}

.sound-card:hover{
    transform:translateY(-8px);
    background:#EAFBFF;
}

.sound-card h3{
    margin:12px 0 6px;
    color:#146C94;
}

/* ----------------------------------------------------------
   SAYAÇLAR
---------------------------------------------------------- */

.forest-counter-section{
    background:linear-gradient(180deg,#ECFFF7,#FFFFFF);
}

.counter-wrapper{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
    gap:22px;
}

.counter-card{
    background:white;
    padding:26px;
    border-radius:24px;
    text-align:center;
    box-shadow:0 12px 25px rgba(0,0,0,.05);
}

.counter-icon{
    font-size:2.2rem;
    display:block;
    margin-bottom:12px;
}

.counter-card h2{
    font-size:2.4rem;
    color:#16A34A;
}

/* ----------------------------------------------------------
   BÜLTEN
---------------------------------------------------------- */

.newsletter-section{
    background:#FFFDF6;
}

.newsletter-container{
    display:grid;
    grid-template-columns:280px 1fr;
    gap:40px;
    align-items:center;
}

.newsletter-left img{
    width:100%;
}

.newsletter-form{
    display:flex;
    gap:14px;
    margin-top:24px;
    flex-wrap:wrap;
}

.newsletter-form input{
    flex:1;
    min-width:220px;
    padding:16px 18px;
    border-radius:999px;
    border:2px solid #DCEFE3;
    font-size:1rem;
}

/* ----------------------------------------------------------
   DİĞER DÜNYALAR
---------------------------------------------------------- */

.next-worlds-section{
    background:#F6FFF8;
}

.world-links{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
    gap:22px;
}

.world-card{
    display:block;
    text-decoration:none;
    color:#1B4332;
    background:white;
    border-radius:28px;
    padding:28px;
    text-align:center;
    box-shadow:0 12px 28px rgba(0,0,0,.06);
    transition:.35s;
}

.world-card:hover{
    transform:translateY(-8px);
}

.world-card h3{
    margin:16px 0 10px;
}

.world-card.stars{border-top:6px solid #FFD54A;}
.world-card.videos{border-top:6px solid #FF5E7E;}
.world-card.games{border-top:6px solid #34C759;}
.world-card.club{border-top:6px solid #8A5BFF;}

/* ----------------------------------------------------------
   FOOTER
---------------------------------------------------------- */

.forest-footer{
    background:linear-gradient(180deg,#0F5132,#09331F);
    color:white;
    padding-top:70px;
}

.footer-grid{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1.4fr;
    gap:40px;
    padding-bottom:50px;
}

.footer-logo{
    width:120px;
    margin-bottom:16px;
}

.footer-text{
    color:#CDEEDB;
    line-height:1.7;
}

.forest-footer h4{
    margin-bottom:16px;
}

.forest-footer ul{
    list-style:none;
    padding:0;
    display:grid;
    gap:10px;
}

.forest-footer a{
    color:#DFF7EA;
    text-decoration:none;
}

.forest-footer a:hover{
    color:#7FFFC1;
}

.footer-bottom{
    border-top:1px solid rgba(255,255,255,.12);
    padding:24px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:16px;
}

.back-top{
    border:none;
    background:#27C46A;
    color:white;
    padding:12px 20px;
    border-radius:999px;
    cursor:pointer;
    font-weight:700;
}

/* ----------------------------------------------------------
   MOBİL
---------------------------------------------------------- */

@media (max-width:992px){

.laboratory-container,
.journal-container,
.story-container,
.campfire-container,
.quiz-container,
.newsletter-container,
.stars-board,
.surprise-container,
.butterfly-game-container,
.acorn-board,
.footer-grid{
grid-template-columns:1fr;
}

.photo-grid,
.gallery-grid{
grid-template-columns:1fr 1fr;
}

.gallery-card.large,
.gallery-card.wide{
grid-column:span 1;
grid-row:span 1;
}

.stars-stats{
grid-template-columns:1fr;
}

}

@media (max-width:640px){

.photo-grid,
.gallery-grid{
grid-template-columns:1fr;
}

.acorn-grid{
grid-template-columns:repeat(2,1fr);
}

.lab-tools{
grid-template-columns:1fr;
}

.score-board{
flex-direction:column;
}

.newsletter-form{
flex-direction:column;
}

.footer-bottom{
flex-direction:column;
text-align:center;
}

}