:root{
    --font-size:14px;
    --header-bg:#f5f7fa;
    --border:#d9e0ea;
    --accent:#ff6a00;
}

.table-wrap{
    width:100%;
    overflow-x:auto;
}

table{
    width:100%;
    border-collapse:collapse;
    min-width:900px;
}

th, td{
    border:1px solid #eceff1;
    padding:12px 10px;
    font-size:var(--font-size);
    text-align:center;
    vertical-align:middle;
}

th{
    background:var(--header-bg);
    font-weight:600;
}

th:first-child,
td:first-child{
    text-align:left;
    font-weight:600;
    width:22%;
}

.check{
    font-size:18px;
    color:#ff7a00;
    font-weight:bold;
}

.price{
    font-size:26px;
    font-weight:600;
}

.price small{
    font-size:16px;
    font-weight:600;
}

.btn{
    display:inline-block;
    margin-top:8px;
    padding:8px 18px;
    border:0px solid var(--accent);
    color:var(--accent);
    text-decoration:none;
    font-size:13px;
}

.guarantee{
    display:flex;
    align-items:center;
    gap:10px;
}

.coin{
    width:36px;
    height:36px;
    border-radius:50%;
    background:#ffb800;
    position:relative;
}

.coin:before,
.coin:after{
    content:"";
    position:absolute;
    width:36px;
    height:36px;
    border-radius:50%;
    background:#ffb800;
    top:-10px;
    left:0;
}

.coin:after{
    top:-20px;
}

@media(max-width:768px){
    table{
        min-width:700px;
    }
}
.currency-switch {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
}

.switch-box {
    display: flex;
    border: 0px solid #ffffff;
    border-radius: 7px;
    overflow: hidden;
    cursor: pointer;
}

.switch-box .option {
    padding: 0px 4px;
    background: #eceff1;
    color: #333;
    transition: all 0.25s ease;
    white-space: nowrap;
}

.switch-box .option.active {
    background: #263238;
    color: #ffffff;
}

.rate {
    color: #333;
    white-space: nowrap;
}
#currencyHeader {
    width: 100%;
    position: relative;
    z-index: 1000;
    transition: all 0.3s ease;
}

/* Sayfa aşağı inince eklenecek class */
#currencyHeader.fixed {
    position: fixed;
    top: 0px;
    left: 0;
	background-color:#f9f9f9;
}
.ai-only-border {
    border: 5px solid transparent;
    border-radius: 14px;

    background:
        linear-gradient(var(--card-bg, #fff), var(--card-bg, #fff)) padding-box,
        linear-gradient(
            90deg,
            #a855f7,
            #6366f1,
            #3b82f6,
            #06b6d4,
            #a855f7
        ) border-box;

    background-size: 100% 100%, 400% 400%;
    background-clip: padding-box, border-box;

    animation: aiBorderSnake 3s linear infinite;
}

/* 🔒 HOVER KİLİDİ */
.ai-only-border:hover,
.ai-only-border:focus,
.ai-only-border:active {
    background:
        linear-gradient(var(--card-bg, #fff), var(--card-bg, #fff)) padding-box,
        linear-gradient(
            90deg,
            #a855f7,
            #6366f1,
            #3b82f6,
            #06b6d4,
            #a855f7
        ) border-box;

    background-size: 100% 100%, 400% 400%;
    background-clip: padding-box, border-box;
}
.ai-button {
  display: inline-block;
  padding: 14px 34px;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.5px;
  color: #ffffff !important;
  text-decoration: none;
  border-radius: 10px;
  background: linear-gradient(
    135deg,
    #7c3aed,
    #2563eb,
    #06b6d4
  );
  box-shadow:
    0 0 0 rgba(124, 58, 237, 0),
    0 8px 24px rgba(37, 99, 235, 0.35);
  transition: all 0.35s ease;
  position: relative;
  overflow: hidden;
}

/* Işık geçiş efekti */
.ai-button::before {
  content: "";
  position: absolute;
  top: 0;
  left: -100%;
  width: 200%;
  height: 100%;
  transition: all 0.6s ease;
}

.ai-button:hover::before {
  left: 100%;
}

.ai-button:hover {
  transform: translateY(-2px);
  box-shadow:
    0 0 18px rgba(124, 58, 237, 0.8),
    0 14px 40px rgba(37, 99, 235, 0.45);
}
.domainbox {
    width: 55% !important;
    height: 50px !important;
    border: 0px solid #ffffff !important;
    border-radius: 7px !important;
    padding: 10px !important;
}
.domainbtn {
	width: 30% !important;
    background-color:#00796b !important;
    color:#ffffff !important;
    border-radius:7px !important;
    padding:14px 20px 13px 20px !important;
    border:0px solid #ffffff !important;
}
.demo-banner-wrapper {
    display: flex;
    gap: 20px;
    margin: 30px 0;
}

.demo-banner {
    border-radius: 14px;
    padding:0px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-height: 280px;
}

.demo-banner-left {
    flex: 2;
    background: #eceff1;
}

.demo-banner-right {
    flex: 1;
    background: #eceff1;
}

.demo-banner h3 {
    margin: 0 0 10px 0;
    font-size: 26px;
}

.demo-banner p {
    margin: 0;
    opacity: 0.8;
}

.demo-banner .demo-btn {
    align-self: flex-start;
    background: rgba(255,255,255,0.2);
    padding: 10px 18px;
    border-radius: 8px;
    font-size: 14px;
}

/* Responsive */
@media (max-width: 768px) {
    .demo-banner-wrapper {
        flex-direction: column;
    }

    .demo-banner {
        min-height: 220px;
    }
}

.homepage-container {
    max-width: 1140px;
    margin: 0 auto;
    padding: 0 15px;
}

.demo-banner-wrapper {
    display: flex;
    gap: 20px;
    margin: 30px 0;
}

.demo-banner {
    border-radius: 14px;
    overflow: hidden;
    position: relative;
}

.demo-banner-left {
    flex: 2;
}

.demo-banner-right {
    flex: 1;
}

.demo-banner img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* Responsive */
@media (max-width: 768px) {
    .demo-banner-wrapper {
        flex-direction: column;
    }

    .demo-banner {
        min-height: auto;
    }
}
/* HEADER */
.plan-header {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr 1fr 160px;
    padding: 5px 10px;
    font-weight: 500;
    color: #252525;
    max-width: 1200px;
    margin: auto;
}

/* ROW */
.plan-row {
    display: grid;
    grid-template-columns: 2fr 1fr 1fr 1fr 1fr 1fr 1fr 150px;
    border-radius: 10px;
    padding: 18px 20px;
    margin: 12px auto;
    max-width: 1200px;
	border: 1px dashed #d9e0ea;
    align-items: center;
    gap: 10px;
}

/* CELLS */
.plan-cell b {
    display: block;
    color: #252525;
	font-weight: 500;
}

.sub {
    font-size: 12px;
    color: #666;
}

/* PRICE */
.old-price {
    text-decoration: line-through;
    color: #666;
}

.new-price {
    font-weight: bold;
    font-size: 18px;
}

/* DISCOUNT */
.discount {
    color: #ff008a;
    font-size: 13px;
    margin-top: 4px;
}

/* BUTTON */
.btn {
    background: #33647e;
    border: 0px dashed #d9e0ea;
    padding: 12px 18px;
    border-radius: 6px;
    font-weight: 500;
    cursor: pointer;
	color: #ffffff;
	margin-top: 0px;
}

/* MOBILE */
@media(max-width:768px){

    .plan-header {
        display: none;
    }

    .plan-row {
        grid-template-columns: 1fr 1fr;
        row-gap: 15px;
    }

    .plan-cell {
        display: flex;
        flex-direction: column;
    }

    .btn {
        width: 100%;
    }
}
.copy-code {
    color: #0d6efd;
    font-weight: bold;
    cursor: pointer;
}

.copy-code:hover {
    text-decoration: none;
}