/* Üyelik (30. tur; 38. tur third version: the package cards as pricing pages show them, see index.html). */
.membership-page main{max-width:1040px}
.sr-only{position:absolute;width:1px;height:1px;clip:rect(0,0,0,0);overflow:hidden;white-space:nowrap}
.member-preview{padding:18px 20px}
.preview-toggle{display:flex;align-items:center;gap:10px;min-height:44px;font-weight:650}
.preview-toggle input{width:22px;height:22px}
/* 32. tur: the newest comments. */
.member-comments{padding:18px 20px}.member-comments h2{margin:4px 0 12px;font:600 22px/1.25 Georgia,serif}.member-comments .text-link{display:inline-block;margin-top:12px}

/* The tick of the lists and the comparison: one drawn mark in the accent colour. */
.plan-features li::before,.assure li::before,.compare-table .yes::before,.order-features li::before{content:"";flex:none;width:18px;height:18px;background:var(--ui-accent,#ecc27f);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 6 9 17l-5-5' fill='none' stroke='black' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}

/* The heading. */
.pricing-hero{max-width:720px;margin:0 auto;padding:14px 8px 6px;text-align:center}
.pricing-hero h1{margin:8px 0 10px;font:500 40px/1.12 Georgia,serif}
.pricing-hero .lead{margin:0 auto;color:var(--ui-muted,#c6ced6);font-size:17px}
.pricing-hero h1,.pricing-hero .lead,.presale,.paynote{text-wrap:balance}

/* The three packages: name, who it suits, price, the button, what it opens. The best one is marked and its button filled. */
.plans{list-style:none;margin:22px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:stretch}
.plan{position:relative;display:flex;flex-direction:column;padding:28px 24px 24px;border:1px solid var(--ui-line,#3a4b5c);border-radius:20px;background:var(--ui-reading,#15202b);box-shadow:var(--ui-shadow)}
.plan.best{border:2px solid var(--ui-accent,#ecc27f);padding:27px 23px 23px;background:linear-gradient(180deg,#ecc27f14,#ecc27f00 42%),var(--ui-reading,#15202b);box-shadow:0 0 0 5px #ecc27f17,var(--ui-shadow)}
.plan-badge{position:absolute;top:0;left:50%;margin:0;transform:translate(-50%,-55%);padding:5px 14px;border-radius:999px;background:var(--ui-accent,#ecc27f);color:#1b1407;font:800 11.5px/1.3 system-ui,sans-serif;letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}
.plan h2{margin:0;font:600 26px/1.15 Georgia,serif}
.plan-fits{margin:6px 0 0;min-height:2.9em;font-size:14.5px;line-height:1.45;color:var(--ui-muted,#c6ced6)}
.plan-price{margin:14px 0 4px;display:flex;align-items:baseline;gap:6px}
.plan-price .amount{font:800 46px/1 system-ui,-apple-system,sans-serif;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.plan-price .currency{font:700 19px/1 system-ui,sans-serif;color:var(--ui-muted,#c6ced6)}
.plan-terms{margin:0 0 18px;font-size:13px;color:var(--ui-muted,#c6ced6)}
.plan .plan-buy{width:100%;min-height:50px;margin:0;border-radius:12px;font-size:16px;font-weight:750}
.plan .plan-buy:not(.primary){border:1.5px solid var(--ui-accent,#ecc27f);background:transparent;color:var(--ui-accent,#ecc27f)}
.plan .plan-buy:not(.primary):hover{background:#ecc27f1a}
.plan-features{list-style:none;margin:22px 0 0;padding:20px 0 0;border-top:1px solid var(--ui-line,#3a4b5c);display:grid;gap:11px;font-size:14.5px;line-height:1.45}
.plan-features li{position:relative;padding-left:28px}
.plan-features li::before{position:absolute;left:0;top:1px}

/* What every package keeps, and the honest line until the payment opens. */
.assure{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:10px 28px;font-size:14.5px}
.assure li{display:flex;align-items:center;gap:8px}
.presale,.paynote{max-width:680px;margin:6px auto 4px;text-align:center;font-size:13.5px;line-height:1.5;color:var(--ui-muted,#c6ced6)}

/* The free start. */
.free-plan{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 26px}
.free-plan h2{margin:4px 0 6px;font:600 23px/1.25 Georgia,serif}
.free-plan p{margin:0;font-size:14.5px;line-height:1.55}
.free-plan .free-status{margin-top:6px;color:var(--ui-accent,#ecc27f);font-weight:600}
.free-plan .action{flex:none;min-width:180px;min-height:48px;margin:0}

/* Free and membership side by side. */
.compare{padding:24px 26px}
.compare h2,.faq h2{margin:4px 0 14px;font:600 25px/1.25 Georgia,serif}
.compare-wrap{overflow-x:auto}
.compare-table{width:100%;border-collapse:collapse;font-size:14.5px}
.compare-table th,.compare-table td{padding:13px 12px;border-bottom:1px solid var(--ui-line,#3a4b5c);text-align:center;vertical-align:middle}
.compare-table thead th{padding-top:6px;font:600 17px/1.25 Georgia,serif;border-bottom:2px solid var(--ui-line,#3a4b5c)}
.compare-table thead th small{display:block;margin-top:2px;white-space:nowrap;font:500 12.5px/1.3 system-ui,sans-serif;color:var(--ui-muted,#c6ced6)}
.compare-table tbody th{text-align:left;font-weight:650}
.compare-table tbody th small{display:block;margin-top:2px;font-weight:400;font-size:13px;color:var(--ui-muted,#c6ced6)}
.compare-table td{width:23%}
.compare-table .member-col{background:#ecc27f0f}
.compare-table thead .member-col{color:var(--ui-accent,#ecc27f);border-radius:12px 12px 0 0}
.compare-table tbody tr:last-child>*{border-bottom:0}
.compare-table .yes,.compare-table .no{display:inline-flex;justify-content:center;width:100%;font-size:0}
.compare-table .no::before{content:"—";font-size:16px;color:var(--ui-muted,#c6ced6)}

/* Questions before paying. */
.faq{padding:24px 26px}
.faq details{border-bottom:1px solid var(--ui-line,#3a4b5c)}
.faq details:last-of-type{border-bottom:0}
.faq summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:54px;cursor:pointer;font-weight:650;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";flex:none;font:400 26px/1 system-ui,sans-serif;color:var(--ui-accent,#ecc27f)}
.faq details[open] summary::after{content:"−"}
.faq details p{margin:0 0 16px;max-width:760px;line-height:1.6;color:var(--ui-muted,#c6ced6)}

/* The last call. */
.pricing-final{padding:30px 24px;text-align:center}
.pricing-final h2{margin:0 0 6px;font:500 30px/1.2 Georgia,serif}
.pricing-final p{margin:0;color:var(--ui-muted,#c6ced6)}
.pricing-final .actions{justify-content:center}
.pricing-final .action{min-height:48px}
/* 61. tur: the payment institution's band under the buttons (iyzico's logo pack, unchanged), as on every footer. */
.pricing-final .pay-band{margin:20px auto 0;max-width:456px}.pay-band img{display:block;width:100%;height:auto}

/* A tablet keeps three columns, a phone one; there the best package comes first. */
@media(max-width:900px){.plan{padding:26px 18px 20px}.plan.best{padding:25px 17px 19px}.plan-price .amount{font-size:40px}}
@media(max-width:760px){
 .pricing-hero h1{font-size:31px}.pricing-hero .lead{font-size:15.5px}
 .plans{grid-template-columns:1fr;max-width:480px;margin:26px auto 0;gap:26px}
 .plan.best{order:-1}.plan-fits{min-height:0}
 .free-plan{flex-direction:column;align-items:stretch;gap:16px;padding:20px 18px}.free-plan .action{width:100%}
 .compare,.faq{padding:20px 16px}.compare-table th,.compare-table td{padding:11px 6px}.compare-table td{width:26%;font-size:13.5px}
 .assure{flex-direction:column;align-items:center;gap:8px}
}
/* 40. tur: the discount code that came with the link. */
.code-banner{max-width:620px;margin:16px auto 0;padding:10px 16px;border:1px solid var(--ui-accent,#ecc27f);border-radius:12px;background:#ecc27f14;font-size:14.5px;line-height:1.5;text-align:center}
.code-banner.warn{border-color:var(--ui-line,#3a4b5c);background:transparent;color:var(--ui-muted,#c6ced6)}.code-banner[hidden]{display:none}
.presale[hidden],.paynote[hidden]{display:none}
/* 43. tur (user: “ödeme sistemi entegrasyonu yapacağız ya hani nelerin olması lazım”; chose “Hepsini yap”): the texts to read
   before buying, under the questions. */
.faq-legal{margin:16px 0 0;font-size:14px;line-height:1.6;color:var(--ui-muted,#c6ced6)}
.faq-legal a,.faq details a{color:var(--ui-link,#a8d8f3)}
