/* Ana sayfa (halolives.com) — tasarım: tek ekranlık yoğun düzen */
.ana{--wrap:1470px;--r:6px;--edge:#2B3036;--tile:#14171B;font-family:Inter,system-ui,sans-serif}
.ana .wrap{width:min(var(--wrap),100% - 48px)}
.cond{font-family:"Barlow Condensed",sans-serif;font-weight:800;text-transform:uppercase;letter-spacing:.005em;line-height:1}
.ico{width:22px;height:22px;flex:none}
/* header */
.ana header{background:rgba(10,11,13,.86);border-bottom:1px solid #1C1F24}
.ana header .wrap{height:68px;gap:0}
.ana header .logo img{height:34px}
.ana header nav{margin-left:clamp(40px,8.5vw,128px);gap:0;height:100%}
.ana header nav a{position:relative;display:flex;align-items:center;height:100%;padding:0 27px;color:#D5D8DD;font-weight:500;font-size:16px}
.ana header nav a[aria-current]{color:#fff;font-weight:600}
.ana header nav a[aria-current]::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:3px;border-radius:2px;background:var(--g);box-shadow:0 0 12px rgba(83,252,24,.7)}
.ana .soc-h{margin-left:auto;display:flex;align-items:center;gap:6px;margin-right:22px}
.ana .soc-h a{display:grid;place-items:center;width:40px;height:40px;border-radius:8px;color:#E6E8EB;transition:color .15s,background .15s}
.ana .soc-h a:hover{color:var(--g);background:#15181C}
.ana .soc-h .ico{width:21px;height:21px}
.kbtn{display:inline-flex;align-items:center;gap:12px;height:50px;padding:0 26px 0 24px;border-radius:var(--r);background:var(--g);color:var(--ink);font-weight:700;font-size:17px;text-decoration:none;transition:background .15s,transform .15s;white-space:nowrap}
.kbtn:hover{background:#6BFF35;transform:translateY(-1px)}
.kbtn .ico{width:20px;height:20px}
.kbtn .ok{width:18px;height:18px;margin-left:14px}
.obtn{display:inline-flex;align-items:center;gap:14px;height:53px;padding:0 26px;border-radius:var(--r);border:1px solid #3A3F46;color:#fff;font-weight:600;font-size:17px;text-decoration:none;background:rgba(10,11,13,.4);transition:border-color .15s,background .15s}
.obtn:hover{border-color:#5A606A;background:#14171B}
.obtn .ico{width:28px;height:28px}
/* hero */
.ana .hero{position:relative;overflow:hidden;padding:20px 0 18px;border-bottom:1px solid #191C20}
.ana .hero::before{content:"";position:absolute;inset:-40px;right:auto;width:100%;top:-40px;background:url(/site/oda.webp) 20% 40%/cover;filter:blur(22px) saturate(.9);opacity:.22;pointer-events:none;border-radius:0}
.hero-bg{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(10,11,13,.92) 0%,rgba(10,11,13,.55) 45%,rgba(10,11,13,.2) 70%,transparent),linear-gradient(0deg,var(--bg),transparent 30%)}
.hero-bg .wm{position:absolute;left:38%;top:52%;width:120px;opacity:.06;transform:rotate(-8deg)}
.hero-bg .beam{position:absolute;right:-60px;top:62px;width:150px;height:6px;border-radius:3px;background:linear-gradient(90deg,transparent,var(--g));box-shadow:0 0 24px 6px rgba(83,252,24,.55);transform:rotate(-34deg);transform-origin:right center}
.hero-bg .beam.b2{top:170px;right:-90px;width:220px;opacity:.65}
.ana .hero .wrap{position:relative;display:grid;grid-template-columns:minmax(0,700fr) minmax(0,768fr);gap:40px;align-items:center}
.eyebrow{margin:0 0 10px;font-size:11.5px;font-weight:600;letter-spacing:.32em;color:#B8BCC3}
.ana .hero h1{margin:0;font:800 clamp(52px,5.4vw,82px)/1.02 Poppins,sans-serif;letter-spacing:-.025em;color:#fff;text-transform:none;white-space:nowrap}
.ana .hero h1 em{font-style:normal;color:var(--g)}
.ana .hero h1 .dot{display:inline-block;margin:0 .14em;transform:translateY(-.06em)}
.sub{margin:6px 0 40px;font-size:clamp(20px,1.75vw,27px);color:#C9CDD2;font-weight:400}
.ana .ctas{display:flex;gap:16px;flex-wrap:wrap}
.ana .ctas .kbtn{height:53px;font-size:19px;padding:0 26px}
.ana .ctas .kbtn .ico{width:24px;height:24px}
/* player */
.oynat{position:relative;aspect-ratio:768/296;border-radius:var(--r);overflow:hidden;border:1px solid #3A4048;background:#000;box-shadow:0 20px 60px rgba(0,0,0,.45)}
.oynat.canli{aspect-ratio:16/9;border-color:#2F5A1C}
.oynat iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.oynat>img.bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 46%}
.oynat .shade{position:absolute;inset:0;background:radial-gradient(ellipse 46% 60% at 47% 55%,rgba(0,0,0,.55),transparent 75%),linear-gradient(90deg,rgba(0,0,0,.25),transparent 60%)}
.oynat .msg{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:0 24px}
.oynat .msg img{width:96px;margin:0 auto 18px;opacity:.42}
.oynat .msg b{display:block;font-size:clamp(17px,1.5vw,22px);font-weight:600;color:#fff;letter-spacing:-.01em}
.oynat .msg small{display:block;margin-top:4px;font-size:clamp(13px,1vw,15px);color:#D2D5DA}
.durum{position:absolute;left:20px;top:18px;z-index:2;display:inline-flex;align-items:center;gap:8px;height:30px;padding:0 13px;border-radius:15px;background:rgba(30,33,38,.86);border:1px solid rgba(255,255,255,.07);font-size:11.5px;font-weight:700;letter-spacing:.04em;color:#E6E8EB;backdrop-filter:blur(6px)}
.durum .ico{width:15px;height:15px}
.durum.on{background:#E5252A;border-color:#E5252A;color:#fff}
.durum.on i{width:8px;height:8px;border-radius:50%;background:#fff;animation:nab2 1.4s infinite}
@keyframes nab2{50%{opacity:.35}}
/* row 2 */
.row2{display:grid;grid-template-columns:minmax(0,694fr) minmax(0,750fr);gap:25px;padding:18px 0 0}
.box{border-radius:var(--r);border:1px solid #23272D;background:#101215}
/* giveaway */
.gw2{position:relative;overflow:hidden;min-height:196px;display:flex;align-items:center;padding:14px 22px}
.gw2 .art{position:absolute;right:0;top:0;bottom:0;width:62%;overflow:hidden}
.gw2 .art img{width:100%;height:100%;object-fit:cover;object-position:60% 50%}
.gw2 .art.kod{background:url(/site/odul-kart.webp) 55% 50%/cover}
.gw2 .art .tut{position:absolute;left:52%;top:47%;transform:translate(-50%,-50%) rotate(-22deg);text-align:center;line-height:1;white-space:nowrap}
.gw2 .art .tut b{display:block;font:800 clamp(34px,3.2vw,50px)/1 "Barlow Condensed",sans-serif;color:#fff;text-shadow:0 0 22px rgba(83,252,24,.5)}
.gw2 .art .tut small{display:block;margin-top:5px;font:700 clamp(9px,.75vw,12px) Inter,sans-serif;letter-spacing:.14em;color:var(--g)}
.gw2::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0E1012 34%,rgba(14,16,18,.86) 46%,rgba(14,16,18,.1) 70%,transparent);z-index:1}
.gw2 .in{position:relative;z-index:2;max-width:340px}
.gw2 h2{margin:0;font-size:34px;color:#fff}
.gw2 h2 em{font-style:normal;color:var(--g)}
.gw2 .pz{display:flex;align-items:center;gap:9px;margin:4px 0 0;color:#E9EBEE;font-size:15px;font-weight:600;line-height:1.35}
.gw2 .pz .ico{width:18px;height:18px;color:var(--g);flex:none}
.cdn{display:flex;align-items:flex-start;gap:5px;margin-top:9px}
.cdn div{min-width:50px;padding:5px 6px 5px;border-radius:6px;background:rgba(22,25,29,.92);border:1px solid #2B3036;text-align:center}
.cdn b{display:block;font:800 25px/1 "Barlow Condensed",sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.cdn div:last-child b{color:var(--g)}
.cdn small{display:block;margin-top:3px;font:600 9.5px Inter,sans-serif;letter-spacing:.1em;color:#8D939B}
.cdn i{font-style:normal;font:800 20px/1 "Barlow Condensed",sans-serif;color:#4A5058;padding-top:8px}
.gw2 .alt{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:10px}
.gw2 .alt .wbtn{margin-top:0;height:40px}
.gw2 .kk{display:inline-flex;align-items:center;gap:8px;color:#C8CCD2;font-size:13.5px}
.gw2 .kk .ico{width:17px;height:17px}
.gw2 .kk a{color:var(--g);text-decoration:none;font-weight:600}
.wbtn{display:inline-flex;align-items:center;gap:22px;height:42px;margin-top:16px;padding:0 18px;border-radius:var(--r);background:#F2F3F5;color:#0B0C0E;font-weight:700;font-size:15px;text-decoration:none;transition:background .15s,transform .15s}
.wbtn:hover{background:#fff;transform:translateY(-1px)}
.wbtn .ico{width:16px;height:16px}
/* schedule */
.prog{padding:14px 16px 18px 18px}
.bh{display:flex;align-items:flex-start;gap:20px}
.bh>.ico{width:30px;height:30px;color:var(--g);margin-top:-1px}
.bh h2{margin:0;font-size:21px;color:#fff;letter-spacing:.01em}
.bh p{margin:3px 0 0;font-size:13.5px;color:#B5B9C0}
.bh .all{margin-left:auto;display:inline-flex;align-items:center;gap:12px;padding:6px 0;background:none;border:0;color:#E6E8EB;font:500 13.5px Inter,sans-serif;text-decoration:none;cursor:pointer;white-space:nowrap}
.bh .all:hover{color:var(--g)}
.bh .all .ico{width:15px;height:15px}
.days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;margin-top:16px}
.dy{position:relative;overflow:hidden;height:112px;border-radius:var(--r);border:1px solid #2A2F35;background:var(--tile);display:flex;flex-direction:column;justify-content:space-between;padding:10px 8px 10px 10px}
.dy img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 35%;transform:scale(1.12);filter:blur(1.6px) brightness(.5) saturate(.7)}
.dy::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,11,13,.6),rgba(10,11,13,.05) 42%,rgba(10,11,13,.9))}
.dy>*{position:relative;z-index:1}
.dy b{font-size:20px;color:#fff}
.dy .t{font:600 10.5px "IBM Plex Mono",monospace;color:#C8CCD2;margin-top:3px}
.dy small{font-size:12px;line-height:1.25;letter-spacing:-.01em;color:#E3E5E8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.dy.yok small{color:#6B7079}
.dy.bugun{border-color:var(--g);box-shadow:0 0 0 1px var(--g) inset}
.dy.bugun b{color:var(--g)}
/* clips */
.klp{padding:26px 0 18px}
.klp .bh{align-items:center;margin-bottom:12px}
.klp .bh>.ico{width:36px;height:36px;margin:0}
.klp .bh h2{font-size:22px}
.cl6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.cl{position:relative;border-radius:var(--r);overflow:hidden;border:1px solid #23272D;background:#15181C}
.cl a.th{position:relative;display:block;aspect-ratio:236/98;overflow:hidden;background:#000}
.cl a.th img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.cl:hover a.th img{transform:scale(1.04)}
.cl .sr{position:absolute;left:10px;top:9px;display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px 0 6px;border-radius:4px;background:rgba(10,11,13,.82);font:600 12px Inter,sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.cl .sr .ico{width:13px;height:13px}
.cl .ft{display:flex;align-items:center;gap:6px;height:36px;padding:0 4px 0 11px}
.cl .ft a{flex:1;min-width:0;color:#fff;font-weight:600;font-size:13.5px;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cl .ft button{display:grid;place-items:center;width:28px;height:28px;border:0;border-radius:4px;background:none;color:#D5D8DD;cursor:pointer}
.cl .ft button:hover{background:#23272D}
.cl .ft .ico{width:16px;height:16px}
.mn{position:absolute;right:6px;bottom:38px;z-index:3;min-width:180px;padding:6px;border-radius:8px;background:#1B1E23;border:1px solid #2E3339;box-shadow:0 12px 30px rgba(0,0,0,.5)}
.mn span{display:block;padding:6px 10px 4px;font:600 10.5px "IBM Plex Mono",monospace;color:#7D838C;letter-spacing:.04em}
.mn button,.mn a{display:block;width:100%;padding:8px 10px;border:0;border-radius:5px;background:none;color:#E6E8EB;font:500 13.5px Inter,sans-serif;text-align:left;text-decoration:none;cursor:pointer}
.mn button:hover,.mn a:hover{background:#262A30}
.bos{padding:26px;border-radius:var(--r);border:1px dashed #2A2F35;color:#9AA0A8;text-align:center;font-size:14px}
/* footer */
.ana footer{border-top:1px solid #1C1F24;padding:22px 0 24px;text-align:left}
.ana footer .wrap{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.ana footer .fl{display:flex;align-items:center;gap:26px;padding-right:32px;border-right:1px solid #2A2F35}
.ana footer .fl img{height:34px;margin:0}
.ana footer .fl p{margin:0;font-size:12.5px;line-height:1.55;color:#B5B9C0}
.fsoc{display:flex;flex-wrap:wrap;gap:12px 38px;flex:1}
.fsoc a{display:flex;align-items:center;gap:14px;text-decoration:none;color:#fff}
.fsoc .ico{width:24px;height:24px;color:#fff}
.fsoc a.kk .ico{color:var(--g)}
.fsoc b{display:block;font-size:12.5px;font-weight:600}
.fsoc small{display:block;font-size:12px;color:#A3A8B0}
.fsoc a:hover small{color:var(--g)}
/* program dialog */
dialog.pd{width:min(460px,100% - 32px);padding:0;border-radius:10px;border:1px solid #2A2F35;background:#121417;color:var(--text)}
dialog.pd::backdrop{background:rgba(0,0,0,.6)}
.pd .hd{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid #23272D}
.pd .hd h3{margin:0;font-size:22px}
.pd .hd button{width:34px;height:34px;border:0;border-radius:6px;background:#1B1E23;color:#fff;font-size:18px;cursor:pointer}
.pd ul{list-style:none;margin:0;padding:8px 18px 16px}
.pd li{display:grid;grid-template-columns:110px 60px minmax(0,1fr);gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid #1F2328;font-size:14.5px}
.pd li:last-child{border-bottom:0}
.pd li .s{font:600 13px "IBM Plex Mono",monospace;color:var(--g)}
.pd li.yok{color:#6B7079}.pd li.yok .s{color:#6B7079}
.pd li.bugun b{color:var(--g)}
/* responsive */
@media (max-width:1240px){.ana header nav a{padding:0 16px}.ana header nav{margin-left:36px}.cl6{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1100px){.ana .hero .wrap{grid-template-columns:minmax(0,1fr)}.row2{grid-template-columns:minmax(0,1fr)}.ana .soc-h{display:none}.ana header .kbtn{margin-left:auto}.ana footer .fl{border-right:0;padding-right:0}}
@media (max-width:760px){.ana .wrap{width:calc(100% - 32px)}.ana .hero h1{font-size:clamp(40px,12vw,64px)}.ana header nav{display:none}.ana header .logo img{height:28px}.ana header .kbtn{height:44px;padding:0 16px;font-size:15px;gap:9px}.ana header .kbtn .ok{display:none}
  .oynat{aspect-ratio:16/10}.oynat .msg img{width:72px;margin-bottom:12px}
  .gw2{min-height:420px;align-items:flex-end;padding:18px}.gw2 .art{width:100%;height:210px;bottom:auto}.gw2::before{background:linear-gradient(0deg,#0E1012 52%,rgba(14,16,18,0) 74%)}.gw2 .art .tut b{font-size:44px}.gw2 .art .tut small{font-size:11px}.cdn div{flex:1}
  .days{grid-template-columns:repeat(7,104px);overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px}.dy{scroll-snap-align:start}
  .bh .all span{display:none}
  .cl6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ana footer .fl{flex-direction:column;align-items:flex-start;gap:12px}.fsoc{gap:16px 24px}.fsoc a{width:calc(50% - 12px)}}
@media (max-width:420px){.ana .ctas a{flex:1;justify-content:center}.ana .ctas .kbtn .ok{margin-left:4px}}
@media (prefers-reduced-motion:reduce){.durum.on i{animation:none}.kbtn,.wbtn,.cl a.th img{transition:none}}