*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow-x:hidden}
body{
  font-family:'Inter',sans-serif;
  background:#5E0000;
  color:#fff;
  min-height:100vh;
}

/* ── FULL SCREEN LAYOUT ───────────────────────────── */
.page{
  min-height:100vh;
  display:grid;
  grid-template-columns:1fr 1fr;
}
@media(max-width:860px){
  .page{grid-template-columns:1fr}
}

/* ── LEFT — PHOTO SIDE ───────────────────────────── */
.photo-side{
  position:relative;
  overflow:hidden;
  min-height:400px;
}
.photo-side img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
  filter:brightness(.85) contrast(1.05) saturate(1.1);
}
/* Gradient overlay on photo */
.photo-overlay{
  position:absolute;
  inset:0;
  background:linear-gradient(
    to right,
    rgba(13,0,0,.2) 0%,
    rgba(13,0,0,0) 40%,
    rgba(13,0,0,.7) 100%
  );
}
/* Mobile overlay — darken top */
@media(max-width:860px){
  .photo-overlay{
    background:linear-gradient(
      to bottom,
      rgba(13,0,0,0) 50%,
      rgba(13,0,0,.9) 100%
    );
  }
}

/* Photo caption strip */
.photo-caption{
  position:absolute;
  bottom:0;left:0;right:0;
  padding:1.5rem;
  background:linear-gradient(to top,rgba(0,0,0,.8),transparent);
}
.photo-name{
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:1.1rem;
  color:#fff;
  line-height:1.2;
  margin-bottom:.2rem;
}
.photo-title{
  font-size:.72rem;
  color:rgba(255,215,0,.8);
  font-weight:600;
  letter-spacing:.06em;
}
.photo-tamil{
  font-family:'Noto Sans Tamil',sans-serif;
  font-size:.75rem;
  color:rgba(255,255,255,.5);
  margin-top:.15rem;
}

/* ── RIGHT — CONTENT SIDE ─────────────────────────── */
.content-side{
  background:linear-gradient(160deg,#5E0000 0%,#5E0000 100%);
  padding:3rem 3rem 3rem 2.5rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  overflow:hidden;
}
/* Decorative watermark */
.content-side::before{
  content:'🚩';
  position:absolute;
  bottom:-40px;right:-30px;
  font-size:18rem;
  opacity:.03;
  pointer-events:none;
  line-height:1;
}
@media(max-width:860px){
  .content-side{
    padding:2rem 1.5rem;
  }
}

/* Site logo bar */
.logo-bar{
  display:flex;
  align-items:center;
  gap:.75rem;
  margin-bottom:2.5rem;
}
.logo-bar img{
  height:40px;
  width:40px;
  border-radius:8px;
  object-fit:contain;
}
.logo-name{
  font-family:'Montserrat',sans-serif;
  font-weight:800;
  font-size:.88rem;
  color:#fff;
}
.logo-tag{
  font-size:.58rem;
  font-weight:600;
  color:#800000;
  letter-spacing:.08em;
  margin-top:.1rem;
}

/* Coming Soon badge */
.cs-badge{
  display:inline-flex;
  align-items:center;
  gap:.45rem;
  background:rgba(128,0,0,.3);
  border:1px solid rgba(128,0,0,.5);
  border-radius:99px;
  padding:.3rem .9rem;
  font-size:.6rem;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(255,215,0,.8);
  margin-bottom:1rem;
}
.cs-dot{
  width:7px;height:7px;border-radius:50%;
  background:#800000;
  animation:pulse-r 2s infinite;
}
@keyframes pulse-r{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.5;transform:scale(1.4)}
}

/* Main heading */
.cs-title{
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:clamp(2.2rem,5vw,3.5rem);
  line-height:.95;
  color:#fff;
  margin-bottom:.6rem;
  letter-spacing:-.02em;
}
.cs-title span{color:#FFD700}
.cs-sub{
  font-size:.9rem;
  color:rgba(255,255,255,.5);
  line-height:1.75;
  max-width:440px;
  margin-bottom:2rem;
}

/* Countdown */
.countdown{
  display:flex;
  gap:1rem;
  margin-bottom:2rem;
  flex-wrap:wrap;
}
.cd-block{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  padding:.8rem 1.1rem;
  text-align:center;
  min-width:72px;
}
.cd-num{
  font-family:'Montserrat',sans-serif;
  font-weight:900;
  font-size:1.8rem;
  color:#FFD700;
  line-height:1;
  display:block;
}
.cd-label{
  font-size:.55rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:rgba(255,255,255,.3);
  display:block;
  margin-top:.25rem;
}

/* What's live section */
.live-section{
  margin-bottom:2rem;
}
.live-title{
  font-size:.6rem;
  font-weight:800;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:rgba(255,255,255,.3);
  margin-bottom:.75rem;
}
.live-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:.5rem;
}
.live-link{
  display:flex;
  align-items:center;
  gap:.5rem;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  border-radius:8px;
  padding:.6rem .8rem;
  text-decoration:none;
  color:rgba(255,255,255,.7);
  font-size:.75rem;
  font-weight:600;
  transition:all .15s;
}
.live-link:hover{
  background:rgba(128,0,0,.2);
  border-color:rgba(128,0,0,.4);
  color:#fff;
}
.live-link .dot{
  width:6px;height:6px;border-radius:50%;
  background:#8B0000;
  flex-shrink:0;
}

/* Coming items */
.coming-list{
  margin-bottom:2rem;
}
.coming-item{
  display:flex;
  align-items:center;
  gap:.6rem;
  padding:.45rem 0;
  border-bottom:1px solid rgba(255,255,255,.05);
  font-size:.78rem;
  color:rgba(255,255,255,.45);
}
.coming-item:last-child{border-bottom:none}
.coming-badge{
  font-size:.55rem;
  font-weight:700;
  padding:.12rem .45rem;
  border-radius:3px;
  flex-shrink:0;
}

/* Social buttons */
.social-row{
  display:flex;
  flex-wrap:wrap;
  gap:.6rem;
}
.soc-btn{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  padding:.5rem 1rem;
  border-radius:8px;
  font-family:'Montserrat',sans-serif;
  font-weight:700;
  font-size:.75rem;
  text-decoration:none;
  transition:all .15s;
}
.soc-btn:hover{opacity:.85;transform:translateY(-1px)}
.soc-home{background:#800000;color:#FFD700}
.soc-x{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.15);color:#fff}
.soc-wa{background:#25D366;color:#fff}
.soc-tg{background:#0088CC;color:#fff}
