/* Kulüp tanıtım sayfası (/kulup) */
.club-page{overflow-x:clip}
.club-page img{display:block;max-width:100%}

/* Giriş */
.cl-hero{background:#fff;border-bottom:1px solid var(--line)}
.cl-hero-copy{text-align:center;padding-top:56px;padding-bottom:28px}
.cl-hero-copy .eyebrow{margin-bottom:20px}
.cl-hero-copy h1{font-size:clamp(44px,6.4vw,88px);line-height:.98;letter-spacing:-.045em}
.cl-hero-copy h1 em{display:block;font-family:Georgia,'Times New Roman',serif;font-weight:400;font-style:italic;color:var(--red);letter-spacing:-.03em}
.cl-lead{font-family:Georgia,'Times New Roman',serif;font-size:clamp(19px,2vw,23px);color:var(--ink);margin:26px 0 4px}
.cl-hero-copy p.cl-sub{max-width:520px;margin:0 auto;font-size:16px}
.cl-actions{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:16px 30px;margin-top:30px}
.cl-link{display:inline-block;padding:6px 2px;border-bottom:1px solid var(--ink);font-size:14px;font-weight:500}
.cl-link:hover{color:var(--red);border-color:var(--red)}

.cl-band{position:relative;max-width:1440px;margin:0 auto;padding:0 2% 26px}
.cl-band picture img{width:100%;height:auto}
.cl-stage{position:relative}
.cl-card{position:absolute;right:3%;top:-4%;width:21%;pointer-events:none;filter:drop-shadow(0 16px 22px rgba(21,21,21,.18))}
.cl-card img{width:100%;height:auto}

/* Masaüstü: giriş alanı ekranın tamamına (başlık çubuğu hariç) sığar */
@media (min-width:761px){
  .cl-hero{height:calc(100svh - 93px);min-height:560px;display:flex;flex-direction:column}
  .cl-hero-copy{padding-top:clamp(18px,4vh,48px);padding-bottom:clamp(12px,2.4vh,26px)}
  .cl-hero-copy .eyebrow{margin-bottom:clamp(8px,1.6vh,20px)}
  .cl-hero-copy h1{font-size:clamp(40px,min(6.4vw,9vh),88px)}
  .cl-lead{margin:clamp(10px,2.2vh,26px) 0 4px}
  .cl-actions{margin-top:clamp(12px,2.6vh,30px)}
  .cl-band{flex:1;min-height:0;width:100%;padding-bottom:clamp(10px,2vh,26px)}
  .cl-stage{height:100%;aspect-ratio:2360/910;max-width:100%;margin:0 auto}
  .cl-band picture{display:block;height:100%}
  .cl-band picture img{height:100%;object-fit:contain;object-position:center bottom}
}

/* Özellikler: üç sütun, satırlar sütunlar arasında hizalı */
.cl-benefits{padding-top:70px;padding-bottom:80px}
.cl-benefits>header{position:static;background:none;border:0;margin-bottom:48px}
.cl-benefits>header .eyebrow{margin-bottom:12px}
.cl-benefits>header h2{font-size:clamp(30px,4vw,46px);letter-spacing:-.04em}
.cl-benefits>header p{margin:10px 0 0;font-size:16px}
.cl-cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(10,auto);column-gap:60px}
.cl-col{grid-row:span 10;display:grid;grid-template-rows:subgrid;position:relative}
.cl-col+.cl-col::before{content:"";position:absolute;left:-30px;top:0;bottom:0;border-left:1px solid var(--line)}
.cl-colhead svg{width:34px;height:34px;color:var(--red);margin-bottom:14px}
.cl-colhead h3{font-size:24px;letter-spacing:-.03em}
.cl-colhead p{margin:8px 0 0;font-size:15px}

.cl-feat{grid-row:span 3;display:grid;grid-template-rows:subgrid}
.cl-feat h4{font-size:15px;letter-spacing:-.01em;margin:40px 0 14px;display:flex;gap:12px;align-items:baseline}
.cl-feat h4 a:hover{color:var(--red)}
.cl-feat h4 b{color:var(--red);font-family:Jost,Arial,sans-serif;font-weight:500;min-width:20px}
.cl-feat>p{margin:14px 0 0;font-size:14px;line-height:1.55}

.cl-visual{position:relative;aspect-ratio:3/2;background:#fff;border:1px solid var(--line);overflow:hidden}
.cl-visual>img{width:100%;height:100%;object-fit:cover}

/* Görsel + yan panel (04, 06) */
.cl-split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.cl-split>img{min-height:0}
.cl-panel{margin:0;padding:12px 14px;list-style:none;border-left:1px solid var(--line);display:flex;flex-direction:column;justify-content:center;gap:10px;font-size:12.5px}
.cl-panel li{display:flex;align-items:center;gap:8px}
.cl-panel svg{width:14px;height:14px;flex:none}
.cl-check b{font-family:Archivo,Arial,sans-serif;font-size:12.5px}
.cl-check ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.cl-check li::before{content:"";width:12px;height:12px;border:1px solid var(--muted);flex:none}
.cl-check li.on::before{background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.6'/%3E%3C/svg%3E") center/10px no-repeat;border-color:var(--red)}

/* 05: haftanın günleri */
.cl-week{display:flex;flex-direction:column}
.cl-days{display:grid;grid-template-columns:repeat(7,1fr);font-size:10.5px;text-align:center;color:var(--muted);padding:8px 2% 0}
.cl-week>img{flex:1;min-height:0}

/* 07: kalp */
.cl-heart{position:absolute;right:12px;top:12px;width:34px;height:34px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 4px 12px rgba(0,0,0,.12)}
.cl-heart svg{width:16px;height:16px;color:var(--red)}

/* 08: kaydet işaretleri */
/* Görseldeki üç panelle hizalı (1536×1024 içinde 28px kenar ve aralık) */
.cl-marks{position:absolute;inset:2.73% 1.82%;display:grid;grid-template-columns:repeat(3,1fr);column-gap:1.86%;pointer-events:none}
.cl-marks i{justify-self:end;align-self:start;margin:8px;width:13px;height:17px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 17'%3E%3Cpath d='M1 1h11v15l-5.5-4L1 16Z' fill='%23fff' stroke='%23151515' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat}
.cl-marks i:first-child{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 13 17'%3E%3Cpath d='M1 1h11v15l-5.5-4L1 16Z' fill='%23C8102E' stroke='%23C8102E' stroke-width='1.3' stroke-linejoin='round'/%3E%3C/svg%3E")}

/* 09: duyuru anahtarları */
.cl-toggles-wrap{display:grid;place-items:center}
.cl-toggles{width:78%;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:14px;font-size:13px}
.cl-toggles li{display:flex;align-items:center;gap:10px}
.cl-toggles svg{width:15px;height:15px;flex:none}
.cl-toggles li span{flex:1}
.cl-toggles i{width:30px;height:16px;border-radius:9px;background:#d6d5cf;position:relative;flex:none}
.cl-toggles i::after{content:"";position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#fff}
.cl-toggles i.on{background:var(--red)}
.cl-toggles i.on::after{left:16px}

/* Tablet: her başlık bir satır, altında üç özellik yan yana */
@media (max-width:1100px){
  .cl-cols{grid-template-columns:1fr;grid-template-rows:none;gap:0}
  .cl-col{grid-row:auto;grid-template-rows:repeat(4,auto);grid-template-columns:repeat(3,minmax(0,1fr));column-gap:22px;padding-top:44px;margin-top:44px;border-top:1px solid var(--line)}
  .cl-col+.cl-col::before{display:none}
  .cl-col:first-child{margin-top:0;padding-top:0;border-top:0}
  .cl-colhead{grid-column:1/-1}
  .cl-feat{grid-row:2/span 3}
  .cl-feat h4{margin-top:26px}
  .cl-panel{padding:8px 10px;gap:7px;font-size:11px}
}
@media (max-width:760px){
  .cl-hero-copy{padding-top:38px;padding-bottom:24px}
  .cl-actions .btn{width:100%}
  .cl-band{max-width:420px;padding:0 18px 22px}
  .cl-card{display:none}
  .cl-benefits{padding-top:50px;padding-bottom:56px}
  .cl-col{grid-template-columns:1fr;grid-template-rows:none}
  .cl-feat{grid-row:auto;display:block}
}