:root  {
  --ink:#0b2234;
  --green:#066145;
  --muted:#425c52;
  --line:#b9cdbf;
  --bg:#e9f1ec;
  font-family:Arial,Helvetica,sans-serif;
  color:var(--ink);
  background:var(--bg);
  font-synthesis:none
}
*  {
  box-sizing:border-box
}
body  {
  margin:0
}
a  {
  color:inherit
}
img  {
  max-width:100%
}
.wrap  {
  width:min(1160px,100% - 64px);
  margin:auto
}
.header  {
  background:#fff;
  border-bottom:1px solid var(--line)
}
.header-inner  {
  min-height:106px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px
}
.logo  {
  display:block;
  line-height:0;
  width:290px
}
.logo img  {
  display:block;
  width:100%;
  height:auto
}
.header-note  {
  font-size:14px;
  line-height:1.8;
  color:var(--muted);
  text-align:right
}
.header-note b  {
  color:var(--green)
}
.crumb  {
  font-size:13px;
  color:#486255;
  padding:25px 0
}
.crumb a  {
  color:var(--green);
  text-decoration:none
}
.layout  {
  display:grid;
  grid-template-columns:minmax(0,1fr) 260px;
  gap:58px;
  align-items:start
}
.kicker  {
  display:block;
  color:var(--green);
  font-size:12px;
  font-weight:700;
  letter-spacing:1.4px;
  line-height:1.7;
  text-transform:uppercase
}
h1  {
  font-size:42px;
  line-height:1.15;
  letter-spacing:-1.7px;
  margin:13px 0 22px;
  max-width:680px
}
h1 span  {
  color:var(--green)
}
p  {
  font-size:16px;
  line-height:1.95;
  color:#2f4b3e;
  margin:0 0 15px
}
strong  {
  font-weight:700;
  color:#143c29
}
.intro  {
  padding:0 0 29px;
  border-bottom:2px solid var(--ink)
}
.intro .lead  {
  font-size:18px;
  line-height:1.85;
  color:#254331
}
.intro-note  {
  margin-top:20px;
  padding:14px 17px;
  background:#d4e6da;
  border-left:3px solid var(--green);
  font-size:14px;
  line-height:1.8;
  color:#304e3b
}
.list-heading  {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding:27px 0 0
}
.list-heading h2  {
  font-size:23px;
  letter-spacing:-.55px;
  margin:0
}
.list-heading span  {
  font-size:12px;
  color:var(--muted);
  white-space:nowrap
}
.site  {
  padding:34px 0 30px;
  border-bottom:1px solid #abc5b4;
  scroll-margin-top:25px
}
.site-title  {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin-bottom:20px
}
.site-title>div  {
  display:flex;
  gap:16px;
  align-items:center
}
.site-index  {
  font-size:13px;
  color:#426951;
  font-variant-numeric:tabular-nums
}
.site h2  {
  font-size:29px;
  letter-spacing:-.7px;
  margin:0
}
.action  {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  padding:12px 18px;
  border:1px solid var(--green);
  border-radius:3px;
  background:var(--green);
  color:#fff;
  text-decoration:none;
  font-size:14px;
  font-weight:700;
  white-space:nowrap
}
.action:hover  {
  background:#044e38
}
.action span  {
  font-size:18px;
  line-height:1
}
.bonus-summary  {
  background:#d9e9de;
  padding:18px 20px;
  border:1px solid #abcbb8;
  border-radius:3px;
  margin-bottom:23px
}
.bonus-label  {
  font-size:12px;
  letter-spacing:1px;
  color:var(--green);
  font-weight:700;
  text-transform:uppercase
}
.bonus-summary h3  {
  margin:7px 0 12px;
  font-size:20px;
  line-height:1.4;
  letter-spacing:-.3px
}
.bonus-summary h3 span  {
  font-size:15px;
  color:#38533f;
  font-weight:400;
  margin-left:6px
}
.bonus-summary dl  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:13px 25px;
  margin:0
}
.bonus-summary dt  {
  font-size:12px;
  line-height:1.4;
  color:#42614d;
  margin:0 0 4px
}
.bonus-summary dd  {
  margin:0;
  font-size:14px;
  color:#123d28;
  font-weight:600;
  line-height:1.6
}
.site-copy p:last-child  {
  margin-bottom:0
}
.details  {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px 23px;
  border-top:1px solid var(--line);
  margin-top:22px;
  padding-top:16px
}
.details dt  {
  font-size:12px;
  color:#45634f;
  margin-bottom:6px
}
.details dd  {
  margin:0;
  font-size:14px;
  line-height:1.7;
  overflow-wrap:anywhere
}
.details .wide  {
  grid-column:1/-1
}
.positive  {
  padding:17px 19px;
  margin-top:21px;
  background:white;
  border-left:2px solid #42815d
}
.positive h3  {
  font-size:13px;
  color:var(--green);
  margin:0 0 7px
}
.positive p  {
  font-size:14px;
  line-height:1.8;
  margin:0;
  color:#3d5947
}
.review-note  {
  font-size:12px;
  line-height:1.8;
  color:#46674f;
  margin-top:15px
}
.sidebar  {
  position:sticky;
  top:25px
}
.side-block  {
  margin:0 0 30px;
  padding-bottom:27px;
  border-bottom:1px solid #aac3b3
}
.side-label  {
  font-size:12px;
  font-weight:bold;
  color:#3e604a;
  letter-spacing:1.3px;
  margin:0 0 15px
}
.menu  {
  display:flex;
  flex-direction:column;
  gap:3px
}
.menu a  {
  font-size:15px;
  line-height:1.5;
  text-decoration:none;
  padding:13px 14px;
  color:#2c5039;
  border-left:2px solid transparent
}
.menu a.active  {
  background:#c5dfce;
  border-color:var(--green);
  color:var(--green);
  font-weight:700
}
.menu a:hover  {
  background:#d6e9dd
}
.site-menu a  {
  display:flex;
  justify-content:space-between;
  padding:9px 0;
  font-size:14px;
  text-decoration:none;
  color:#2c543d
}
.site-menu a span  {
  color:#426c4c
}
.side-text  {
  font-size:14px;
  line-height:1.85;
  color:#3b5a44
}
.side-text strong  {
  font-weight:600
}
.small-date  {
  font-size:12px;
  color:#48664e;
  line-height:1.8
}
.basics  {
  padding:32px 0 20px
}
.basics h2,.faq h2  {
  font-size:26px;
  letter-spacing:-.7px;
  margin:8px 0 18px
}
.basics h3  {
  font-size:18px;
  margin:23px 0 10px
}
.faq  {
  padding:20px 0 35px
}
.faq details  {
  border-top:1px solid var(--line);
  padding:0
}
.faq summary  {
  cursor:pointer;
  list-style:none;
  font-size:15px;
  line-height:1.7;
  font-weight:600;
  padding:17px 25px 17px 0;
  position:relative
}
.faq summary::-webkit-details-marker  {
  display:none
}
.faq summary:after  {
  content:'+';
  position:absolute;
  right:0;
  color:var(--green);
  font-size:20px
}
.faq details[open] summary:after  {
  content:'−'
}
.faq details p  {
  font-size:15px;
  margin:0 0 19px
}
.footer  {
  border-top:1px solid var(--line);
  background:#d1e0d5;
  margin-top:38px;
  padding:27px 0
}
.footer-top  {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px
}
.footer-brand  {
  font-weight:700;
  font-size:14px
}
.footer-brand span  {
  color:var(--green)
}
.footer nav  {
  display:flex;
  gap:18px
}
.footer nav a  {
  font-size:13px;
  color:#294c36;
  text-decoration:none
}
.legal  {
  border-top:1px solid #adc5b5;
  margin-top:19px;
  padding-top:18px;
  font-size:12px;
  line-height:1.9;
  color:#3c5c46
}
.legal p  {
  font-size:12px;
  line-height:1.9;
  margin:0 0 10px;
  color:inherit
}
.skip  {
  position:fixed;
  top:-80px;
  left:12px;
  z-index:10;
  padding:13px;
  background:var(--ink);
  color:#fff
}
.skip:focus  {
  top:12px
}
a:focus-visible,summary:focus-visible  {
  outline:3px solid #25a272;
  outline-offset:4px
}
@media(max-width:1000px)  {
  .layout  {
    grid-template-columns:minmax(0,1fr) 225px;
    gap:33px
  }
  .wrap  {
    width:calc(100% - 44px)
  }
  h1  {
    font-size:35px
  }
  .bonus-summary h3 span  {
    display:block;
    margin:5px 0 0
  }
  .logo  {
    width:270px
  }
}
@media(max-width:740px)  {
  .wrap  {
    width:calc(100% - 36px)
  }
  .header-inner  {
    min-height:90px
  }
  .logo  {
    width:250px
  }
  .header-note  {
    display:none
  }
  .crumb  {
    padding:20px 0
  }
  .layout  {
    display:flex;
    flex-direction:column;
    gap:24px
  }
  .layout main  {
    width:100%;
    min-width:0
  }
  .sidebar  {
    position:static;
    order:-1;
    width:100%
  }
  .sidebar .side-block  {
    display:none
  }
  .sidebar .side-block:first-child  {
    display:block;
    border:0;
    padding:0;
    margin:0
  }
  .sidebar .side-label  {
    display:none
  }
  .menu  {
    flex-direction:row;
    gap:6px;
    flex-wrap:wrap
  }
  .menu a  {
    font-size:13px;
    flex:1;
    text-align:center;
    padding:10px 7px;
    border:1px solid var(--line);
    border-radius:3px;
    background:#fff
  }
  .menu a.active  {
    border-color:#7eaf90
  }
  .sidebar>.small-date  {
    display:none
  }
  h1  {
    font-size:35px;
    letter-spacing:-1.2px;
    margin-top:10px
  }
  .intro .lead  {
    font-size:17px
  }
  p  {
    font-size:16px;
    line-height:1.95
  }
  .intro  {
    padding-bottom:24px
  }
  .intro-note  {
    font-size:14px
  }
  .list-heading  {
    padding-top:23px
  }
  .list-heading h2  {
    font-size:20px
  }
  .list-heading>span  {
    font-size:11px
  }
  .site  {
    padding-top:29px
  }
  .site h2  {
    font-size:26px
  }
  .site-title  {
    margin-bottom:17px;
    gap:12px
  }
  .action  {
    font-size:13px;
    padding:11px 14px;
    gap:15px
  }
  .bonus-summary  {
    padding:16px
  }
  .bonus-summary h3  {
    font-size:19px
  }
  .bonus-summary dl  {
    gap:13px 16px
  }
  .bonus-summary dd  {
    font-size:13px
  }
  .details  {
    gap:16px
  }
  .details dd  {
    font-size:13px
  }
  .positive  {
    padding:15px
  }
  .footer-top  {
    flex-direction:column;
    align-items:flex-start;
    gap:18px
  }
  .footer nav  {
    gap:16px
  }
  .basics h2,.faq h2  {
    font-size:23px
  }
  .small-date  {
    font-size:12px
  }
}
@media(prefers-reduced-motion:no-preference)  {
  html  {
    scroll-behavior:smooth
  }
}
.hero-image {
  margin:22px 0 24px;
  background:#0b2234;
  border-radius:8px;
  overflow:hidden
}
.hero-image img {
  display:block;
  width:100%;
  height:auto;
  object-fit:contain
}
.freespin-offer {
  margin:0 0 24px;
  padding:17px 19px;
  border:1px solid #b5cebd;
  border-left:3px solid #066145;
  border-radius:3px;
  background:#fff
}
.freespin-offer .offer-type {
  display:block;
  margin-bottom:6px;
  font-size:12px;
  font-weight:700;
  letter-spacing:.7px;
  color:#425c52;
  text-transform:uppercase
}
.freespin-offer h3 {
  margin:0 0 10px;
  font-size:18px;
  line-height:1.5;
  color:#0b2234
}
.freespin-offer p {
  margin:0 0 10px;
  font-size:15px;
  line-height:1.85
}
.freespin-offer p:last-child {
  margin-bottom:0
}
.freespin-offer ul {
  margin:0 0 10px;
  padding-left:20px;
  color:#2f4b3e;
  font-size:15px;
  line-height:1.85
}
@media(max-width:740px) {
  .hero-image {
    margin:19px 0 22px;
    border-radius:5px
  }
  .freespin-offer {
    padding:15px
  }
  .freespin-offer h3 {
    font-size:17px
  }
}


/* Bonus Çeşitleri */
.guide-section {
  padding: 28px 0;
  border-bottom: 1px solid var(--line);
  scroll-margin-top: 24px;
}
.guide-section h2 {
  margin: 0 0 15px;
  font-size: 26px;
  line-height: 1.3;
  letter-spacing: -.6px;
}
.guide-section h3 {
  margin: 23px 0 9px;
  font-size: 19px;
  line-height: 1.4;
}
.guide-section p:last-child {
  margin-bottom: 0;
}
.section-number {
  display: block;
  margin-bottom: 9px;
  color: var(--green);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}
.term-note {
  margin: 20px 0 0;
  padding: 16px 18px;
  border-left: 3px solid var(--green);
  background: #d4e6da;
  color: #234533;
  font-size: 15px;
  line-height: 1.85;
}
.comparison-wrap {
  overflow-x: auto;
  margin: 19px 0;
  border: 1px solid #adc7b5;
  border-radius: 5px;
  background: #fff;
}
.comparison-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
  font-size: 15px;
  line-height: 1.65;
}
.comparison-table caption {
  padding: 14px 17px;
  font-size: 14px;
  text-align: left;
  color: #345442;
  background: #d9e9de;
}
.comparison-table th,
.comparison-table td {
  padding: 14px 17px;
  border-bottom: 1px solid #d3e0d7;
  vertical-align: top;
}
.comparison-table thead th {
  background: #0d4433;
  color: #fff;
  font-weight: 600;
}
.comparison-table tbody th {
  color: #153d2c;
  font-weight: 600;
}
.comparison-table tr:last-child th,
.comparison-table tr:last-child td {
  border-bottom: 0;
}
.example-box {
  margin: 19px 0;
  padding: 21px 23px;
  border: 1px solid #adc7b5;
  border-radius: 5px;
  background: #fff;
}
.example-box h3 {
  margin: 0 0 10px;
  color: var(--green);
}
.example-box .formula {
  margin: 15px 0;
  padding: 13px 15px;
  color: #103b2a;
  background: #e6efe9;
  font-size: 17px;
  font-weight: 700;
  line-height: 1.65;
}
.article-checks {
  margin: 14px 0 0;
  padding-left: 22px;
  color: #2f4b3e;
  font-size: 16px;
  line-height: 1.9;
}
.article-checks li {
  padding-left: 4px;
  margin-bottom: 8px;
}
.reading-link {
  margin-top: 24px;
  padding: 19px 21px;
  background: #d4e6da;
  border-radius: 5px;
}
.reading-link a {
  color: #07543b;
  text-underline-offset: 4px;
  font-weight: 700;
}
.reading-link p {
  margin: 0;
}
@media (max-width: 740px) {
  .guide-section {
    padding: 24px 0;
  }
  .guide-section h2 {
    font-size: 23px;
  }
  .comparison-table {
    font-size: 13px;
  }
  .comparison-table th,
  .comparison-table td {
    padding: 12px 10px;
  }
  .example-box {
    padding: 17px;
  }
  .example-box .formula {
    font-size: 16px;
  }
}

.footer nav {
  flex-wrap: wrap;
  row-gap: 10px;
}

/* Responsive hero images and mobile navigation */
.affiliate-disclosure {
  margin-top: 18px;
  padding: 13px 17px;
  border: 1px solid #b9cdbf;
  border-left: 3px solid var(--green);
  border-radius: 3px;
  background: #d9e9de;
}
.affiliate-disclosure p {
  margin: 0;
  font-size: 14px;
  line-height: 1.7;
}
.affiliate-disclosure a {
  color: var(--green);
  font-weight: 700;
  text-underline-offset: 3px;
}
@media (max-width: 740px) {
  .menu {
    align-items: stretch;
    flex-wrap: nowrap;
  }
  .menu a {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 0;
    min-width: 0;
    min-height: 64px;
    padding: 10px 4px;
    font-size: clamp(11px, 3.2vw, 13px);
    line-height: 1.45;
    text-align: center;
  }
  .hero-image img {
    width: 100%;
    height: auto;
    aspect-ratio: 5 / 2;
    object-fit: contain;
  }
  .affiliate-disclosure {
    margin-top: 14px;
    padding: 12px 13px;
  }
  .affiliate-disclosure p {
    font-size: 13px;
    line-height: 1.65;
  }
}