/* ==========================================================================
   TRN Teknoloji - İş Ortaklığı / Kazanç Modeli
   (Ortak stiller: css/is-ortakligi.css)
   ========================================================================== */

/* Hero */
.earn-hero{position:relative;height:clamp(440px,32vw,520px);overflow:hidden;background:#fff}
.earn-hero>img{width:100%;height:100%;object-fit:cover;object-position:center}
.earn-hero-copy{position:absolute;inset:0;display:flex;align-items:center}
.earn-hero-copy .inner{width:min(44%,590px)}
.io-page .earn-hero h1{font-size:clamp(1.9rem,3.5vw,3.45rem);line-height:1.03;letter-spacing:-.045em}
.earn-hero .lead{max-width:500px;margin-top:15px}
.earn-hero .btn{margin-top:20px}

.io-page .earn-section{padding:72px 0}

/* Kazanç avantajları */
.earn-benefits{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.earn-benefit{display:flex;min-height:300px;padding:28px 22px;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px solid #e2e3e7;border-radius:20px;background:#fff;box-shadow:0 9px 25px rgba(17,18,23,.05)}
.earn-benefit img{width:130px;height:130px;margin:0 auto 20px;object-fit:contain}
.io-page .earn-benefit h3{font-size:1.02rem;line-height:1.25}
.earn-benefit p{margin-top:9px;color:#60636d}

/* Seviyeler */
.io-page .levels{background:#f7f7f8}
.level-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.level{position:relative;display:flex;min-height:455px;padding:30px 28px;flex-direction:column;border:1px solid #e2e3e7;border-radius:22px;background:#fff;box-shadow:0 12px 30px rgba(17,18,23,.07)}
.level-tag{align-self:flex-start;padding:5px 10px;border-radius:999px;color:var(--red);background:#fff0f1;font-size:.74rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.io-page .level h3{margin-top:18px;font-size:1.45rem;line-height:1.25}
.level-sub{min-height:58px;margin-top:9px;color:#60636d}
.share{margin:24px 0 15px;color:var(--red);font-size:2.7rem;font-weight:900;line-height:1}
.share small{display:block;margin-top:8px;color:#111217;font-size:.88rem;letter-spacing:.05em;text-transform:uppercase}
.level ul{margin:8px 0 0;padding:0;list-style:none}
.level li{position:relative;padding:8px 0 8px 25px;border-bottom:1px solid #eee}
.level li::before{content:"✓";position:absolute;left:0;color:var(--red);font-weight:900}
.levels-cta{margin-top:34px;text-align:center}

/* SSS */
.faq-list{max-width:980px;margin:0 auto}
.faq-item{margin-bottom:13px;overflow:hidden;border:1px solid #e2e3e7;border-radius:15px;background:#fff;box-shadow:0 8px 22px rgba(17,18,23,.045)}
.faq-item summary{display:flex;padding:20px 22px;align-items:center;justify-content:space-between;gap:20px;font-weight:800;list-style:none;cursor:pointer}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:'+';flex:0 0 32px;color:var(--red);font-size:1.65rem;text-align:center;transition:transform .2s}
.faq-item[open] summary::after{transform:rotate(45deg)}
.faq-item p{padding:0 22px 22px;color:#60636d}

@media(max-width:940px){
  .earn-hero-copy .inner{width:52%}
  .earn-benefits{grid-template-columns:1fr 1fr}
  .level-grid{grid-template-columns:1fr}
  .level{min-height:0}
}
@media(max-width:640px){
  .io-page .earn-section{padding:54px 0}
  .earn-hero{height:520px}
  .earn-hero>img{object-position:68% center}
  .earn-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.98) 0%,rgba(255,255,255,.9) 58%,rgba(255,255,255,.15) 100%)}
  .earn-hero-copy{z-index:1;align-items:flex-start;padding-top:54px}
  .earn-hero-copy .inner{width:84%}
  .io-page .earn-hero h1{font-size:2.2rem}
  .earn-benefits{grid-template-columns:1fr;gap:12px}
  .earn-benefit{min-height:0;padding:22px 18px 24px}
  .earn-benefit img{width:150px;height:130px;margin-bottom:13px}
  .earn-benefit p{margin-top:5px}
  .level-grid{gap:14px}
  .level{padding:22px 20px;border-radius:18px}
  .io-page .level h3{margin-top:11px;font-size:1.28rem}
  .level-sub{min-height:0;margin-top:5px;font-size:.93rem;line-height:1.45}
  .share{margin:15px 0 11px;font-size:2.25rem}
  .share small{display:inline;margin:0 0 0 8px;font-size:.76rem}
  .level ul{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;margin-top:2px}
  .level li{padding:6px 0 6px 20px;font-size:.86rem;line-height:1.35}
  .levels-cta{margin-top:25px}
}