/* ------ RENK DOKUSU ------ */
:root{
  --prime:#26b263;
  --deep:#0e2017;
  --soft:#effff6;
}

/* ------ RESET & TEMEL ------ */
*{margin:0;padding:0;box-sizing:border-box;font-family:'Montserrat',sans-serif}
body{background:linear-gradient(140deg,var(--deep) 0%,#05130c 100%);color:var(--soft);line-height:1.6}
a{color:inherit;text-decoration:none}

/* ------ HERO ------ */
.banner{padding:4rem 1rem;text-align:center}
.banner h1{font-size:clamp(2.2rem,6vw,3.6rem);background:linear-gradient(90deg,#fff,var(--prime));-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.banner .tagline{margin:1rem auto 2rem;max-width:640px}
.cta{display:inline-block;background:var(--prime);padding:.9rem 2rem;border-radius:50px;font-weight:600;transition:.3s}
.cta:hover{transform:translateY(-4px);box-shadow:0 6px 14px rgba(0,0,0,.3)}

/* ------ CAROUSEL ------ */
.carousel{position:relative;max-width:1100px;margin:4rem auto;overflow:hidden;border-radius:16px;box-shadow:0 8px 22px rgba(0,0,0,.45)}
.viewport{width:100%;overflow:hidden}
.rail{display:flex;transition:transform .6s ease;list-style:none}
.frame{flex:0 0 100%;max-width:100%}
.frame img{width:100%;height:auto;display:block}

.arrow{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.45);border:none;color:#fff;font-size:2rem;line-height:1;padding:.25rem .75rem;border-radius:50%;cursor:pointer;transition:.3s;z-index:10}
.arrow:hover{background:var(--prime)}
.arrow.left{left:14px}
.arrow.right{right:14px}

.spots{position:absolute;bottom:12px;left:50%;transform:translateX(-50%);display:flex;gap:.6rem}
.spots button{width:12px;height:12px;border-radius:50%;border:1px solid var(--soft);background:transparent;cursor:pointer;transition:.3s}
.spots button.active,
.spots button:hover{background:var(--prime);border-color:var(--prime)}

/* ------ PERKS ------ */
.perks{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));max-width:1100px;margin:2rem auto}
.perk{background:rgba(255,255,255,.05);padding:1.8rem;border:1px solid rgba(255,255,255,.08);border-radius:14px;transition:.3s}
.perk:hover{transform:translateY(-6px);box-shadow:0 8px 20px rgba(0,0,0,.35)}
.perk h2{color:var(--prime);margin-bottom:.6rem}

/* ------ MINI MAKALE ------ */
.snippet{background:rgba(255,255,255,.04);border-left:4px solid var(--prime);padding:2rem 1.5rem;margin:3rem auto;max-width:1100px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.snippet h2{font-size:1.6rem;color:var(--prime);margin-bottom:1rem;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.snippet p{text-align:justify;text-indent:1.5rem}

/* ------ ACCORDION ------ */
.accordion{max-width:900px;margin:4rem auto}
.qa{border-bottom:1px solid rgba(255,255,255,.1)}
.q{width:100%;padding:1rem 0;border:none;background:transparent;color:#fff;font-size:1.05rem;display:flex;justify-content:space-between;align-items:center;cursor:pointer}
.a{max-height:0;overflow:hidden;transition:max-height .3s ease;padding-right:1rem}
.a p{padding:0 0 1rem}

footer{text-align:center;padding:2rem 0;font-size:.85rem;background:rgba(0,0,0,.2)}