:root{
  --red:#d71920;
  --red2:#ef432a;
  --navy:#071936;
  --navy2:#102b55;
  --gold:#c9952e;
  --soft:#f4f7fb;
  --line:#e8edf5;
  --muted:#647188;
  --shadow:0 14px 34px rgba(7,25,54,.10);
}

*{box-sizing:border-box}

body{
  margin:0;
  font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--navy);
  background:
    radial-gradient(circle at 6% 10%,rgba(215,25,32,.08),transparent 26%),
    radial-gradient(circle at 96% 6%,rgba(201,149,46,.15),transparent 24%),
    linear-gradient(180deg,#fff 0%,#f4f6fa 62%,#edf2f8 100%);
}

a{text-decoration:none;color:inherit}

.wrap{
  width:min(1500px,calc(100% - 72px));
  margin:0 auto;
}

/* top demo */
.demo-bar{
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-weight:700;
  font-size:14px;
  background:linear-gradient(90deg,#071936,#4f304c,#d71920);
}

/* header compact like mockup */
.site-header{
  height:86px;
  background:rgba(255,255,255,.96);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:99;
  backdrop-filter:blur(14px);
}

.header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:285px;
}

.logo-mark{
  width:52px;
  height:52px;
  border-radius:16px;
  display:block;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 75% 20%,#ffd66b 0 11%,transparent 12%),
    linear-gradient(135deg,#d71920 0%,#f06d25 58%,#d9a23b 100%);
  box-shadow:0 14px 28px rgba(215,25,32,.24);
}

.logo-mark:after{
  content:"AG";
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#fff;
  font-weight:900;
  font-size:18px;
  letter-spacing:-1px;
}

.logo-mark.small{
  width:42px;
  height:42px;
  border-radius:13px;
}

.logo-mark.small:after{
  font-size:14px;
}

.brand-name strong{
  display:block;
  font-size:17px;
  line-height:1;
  letter-spacing:-.5px;
}

.brand-name small{
  display:block;
  margin-top:5px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

.nav{
  display:flex;
  align-items:center;
  gap:20px;
  color:#30394d;
  font-size:14px;
  font-weight:900;
  white-space:nowrap;
}

.nav a{
  position:relative;
  padding:10px 0;
}

.nav a.active,
.nav a:hover{
  color:var(--red);
}

.nav a.active:after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:3px;
  border-radius:99px;
  background:var(--red);
}

.header-actions{
  display:flex;
  gap:9px;
}

.header-actions button{
  height:44px;
  border:1px solid var(--line);
  background:#fff;
  border-radius:999px;
  padding:0 18px;
  color:var(--navy);
  font-size:14px;
  font-weight:900;
  box-shadow:0 8px 18px rgba(7,25,54,.04);
}

.header-actions .search{
  width:44px;
  padding:0;
}

/* HERO V4 - horizontal strip */
.hero-section{
  padding:34px 0 0;
}

.hero-card{
  position:relative;
  min-height:330px;
  overflow:hidden;
  border-radius:30px;
  display:grid;
  grid-template-columns:34% 45% 21%;
  align-items:center;
  background:
    radial-gradient(circle at 94% 8%,rgba(201,149,46,.24),transparent 24%),
    linear-gradient(135deg,#fff 0%,#fff8f4 50%,#edf5ff 100%);
  border:1px solid rgba(255,255,255,.95);
  box-shadow:0 26px 62px rgba(7,25,54,.13);
}

.hero-card:before{
  content:"";
  position:absolute;
  inset:0;
  opacity:.19;
  background-image:radial-gradient(circle,rgba(7,25,54,.15) 1.1px,transparent 1.5px);
  background-size:26px 26px;
  pointer-events:none;
}

.hero-copy{
  position:relative;
  z-index:4;
  padding:34px 18px 34px 48px;
}

.date-pill{
  display:inline-flex;
  background:#fff;
  color:var(--red);
  padding:9px 15px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  box-shadow:0 9px 22px rgba(7,25,54,.07);
  margin-bottom:14px;
}

.hero-copy h1{
  margin:0;
  color:var(--navy);
  font-size:48px;
  line-height:.94;
  letter-spacing:-3px;
  text-transform:uppercase;
}

.hero-copy h1 span{
  display:block;
  color:var(--red);
}

.hero-copy h3{
  margin:10px 0 12px;
  color:var(--gold);
  font-size:22px;
  line-height:1;
  font-weight:900;
  font-style:italic;
  letter-spacing:-.8px;
}

.hero-copy p{
  max-width:430px;
  margin:0 0 18px;
  color:#34425b;
  font-size:14px;
  line-height:1.55;
}

.hero-buttons{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.btn{
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  padding:0 18px;
  font-size:13px;
  font-weight:900;
}

.btn.primary{
  background:linear-gradient(135deg,var(--red),var(--red2));
  color:#fff;
  box-shadow:0 12px 20px rgba(215,25,32,.22);
}

.btn.secondary{
  background:#fff;
  color:var(--red);
  border:1px solid rgba(215,25,32,.24);
}

/* hero image must be long horizontal */
.hero-art{
  position:relative;
  z-index:4;
  min-height:250px;
  border-radius:24px;
  overflow:hidden;
  background:#f0f3f8;
}

.hero-art-image{
  background-image:url('../img/hero_art.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* hide old css-art layers */
.hero-art-image:before,
.hero-art-image:after,
.hero-art-image .rising-sun,
.hero-art-image .fuji,
.hero-art-image .nagoya-tower,
.hero-art-image .nagoya-castle,
.hero-art-image .person,
.hero-art-image .water-splash{
  display:none !important;
}

/* countdown overlay compact */
.countdown-box{
  position:relative;
  z-index:6;
  width:295px;
  max-width:calc(100% - 18px);
  justify-self:end;
  margin-right:28px;
  padding:20px 18px;
  border-radius:22px;
  color:#fff;
  background:
    radial-gradient(circle at top right,rgba(217,162,59,.22),transparent 35%),
    linear-gradient(135deg,#071936,#14315e);
  box-shadow:0 22px 48px rgba(7,25,54,.28);
}

.countdown-box small{
  display:block;
  text-align:center;
  color:#ffd766;
  font-size:11px;
  font-weight:900;
  margin-bottom:12px;
}

.timer{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}

.timer div{
  min-width:0;
  text-align:center;
  border-radius:13px;
  background:rgba(255,255,255,.09);
  padding:10px 4px;
}

.timer b{
  display:block;
  font-size:25px;
  line-height:1;
  letter-spacing:-1px;
}

.timer span{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.72);
  font-size:9px;
  font-weight:900;
}

.countdown-box p{
  margin:14px 0 10px;
  text-align:center;
  color:#ffd766;
  font-weight:900;
  font-size:15px;
}

.countdown-box em{
  display:block;
  border-top:1px solid rgba(255,255,255,.15);
  padding-top:10px;
  text-align:center;
  font-style:normal;
  color:rgba(255,255,255,.86);
  font-weight:800;
  font-size:14px;
  line-height:1.25;
}

/* Cards row: compact and close to hero */
.main-grid{
  display:grid;
  grid-template-columns:1fr 1fr 1.12fr;
  gap:18px;
  margin-top:16px;
}

.panel{
  background:#fff;
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:var(--shadow);
  padding:18px;
}

.panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  margin-bottom:12px;
}

.panel-head h2{
  margin:0;
  color:var(--navy);
  font-size:18px;
  line-height:1.05;
  letter-spacing:-.5px;
}

.panel-head a{
  color:var(--red);
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

/* schedule compact */
.schedule-list{
  display:grid;
  gap:0;
}

.schedule-item{
  display:grid;
  grid-template-columns:30px 1fr auto;
  gap:9px;
  align-items:center;
  min-height:49px;
  border-bottom:1px solid #edf0f6;
}

.schedule-item:last-child{
  border-bottom:0;
}

.schedule-item i{
  font-style:normal;
  font-size:16px;
}

.schedule-item b{
  display:block;
  margin-bottom:3px;
  color:var(--navy);
  font-size:12px;
  line-height:1.18;
}

.schedule-item span{
  display:block;
  color:var(--muted);
  font-size:11px;
  font-weight:800;
}

.schedule-item em{
  font-style:normal;
  background:#eef4fc;
  color:#31506f;
  padding:6px 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
}

/* medal compact */
table{
  width:100%;
  border-collapse:collapse;
  font-size:12px;
}

th{
  text-align:left;
  color:var(--muted);
  font-size:10px;
  text-transform:uppercase;
  padding:8px 6px;
  border-bottom:1px solid var(--line);
}

td{
  padding:8px 6px;
  border-bottom:1px solid #edf0f6;
  font-weight:800;
}

td:nth-child(n+3),
th:nth-child(n+3){
  text-align:center;
}

tr.ina td{
  color:#b6000a;
  background:#fff1f1;
}

/* news compact like mockup */
.news-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
  align-items:stretch;
}

.news-list article{
  display:flex;
  flex-direction:column;
  min-height:210px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:13px;
  background:#fff;
  box-shadow:0 9px 20px rgba(7,25,54,.055);
}

.news-img{
  height:78px;
  overflow:hidden;
  background:#eef2f8;
  border-bottom:1px solid #eef2f8;
}

.news-img:after{
  display:none !important;
}

.news-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}

.news-list span{
  display:inline-block;
  width:max-content;
  margin:10px 10px 5px;
  padding:5px 7px;
  border-radius:999px;
  color:var(--red);
  background:#fff1f1;
  font-size:8.5px;
  font-weight:900;
}

.news-list h3{
  margin:0 10px 8px;
  color:var(--navy);
  font-size:11.5px;
  line-height:1.24;
}

.news-list p{
  margin:auto 10px 11px;
  color:var(--muted);
  font-size:10.5px;
  font-weight:800;
}

/* Lower row compact */
.lower-grid{
  display:grid;
  grid-template-columns:1.25fr .95fr .88fr;
  gap:18px;
  margin-top:18px;
  margin-bottom:22px;
  align-items:start;
}

.sports-host{
  display:grid;
  grid-template-columns:1fr .96fr;
  gap:14px;
}

.sports-box h4{
  margin:0 0 9px;
  color:var(--navy);
  font-size:11px;
}

.sport-icons{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}

.sport-icons span{
  min-height:58px;
  border:1px solid var(--line);
  border-radius:13px;
  background:#f7f9fc;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
}

.sport-icons i{
  font-style:normal;
  font-size:17px;
}

.sport-icons b{
  color:var(--navy);
  font-size:9.5px;
  line-height:1.1;
  text-align:center;
}

/* host city card */
.host-card{
  position:relative;
  overflow:hidden;
  min-height:170px;
  border-radius:17px;
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  color:#fff;
}

.host-card-image{
  background-image:
    linear-gradient(180deg,rgba(7,25,54,.15),rgba(7,25,54,.70)),
    url('../img/venue.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

.host-card-image:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(7,25,54,.76),rgba(7,25,54,.25));
  pointer-events:none;
}

.host-card > *{
  position:relative;
  z-index:1;
}

.host-card small{
  margin-bottom:7px;
  color:#ffd766;
  font-size:9.5px;
  font-weight:900;
}

.host-card h3{
  max-width:250px;
  margin:0;
  color:#fff;
  font-size:18px;
  line-height:1.04;
}

.host-card p{
  margin:8px 0 10px;
  color:rgba(255,255,255,.84);
  font-size:11px;
  line-height:1.42;
}

.host-card a{
  color:#ffd766;
  font-size:11px;
  font-weight:900;
}

/* athlete cards */
.athlete-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.athlete-cards article{
  min-height:218px;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  box-shadow:0 9px 20px rgba(7,25,54,.055);
  display:flex;
  flex-direction:column;
}

.ath-img{
  height:82px;
  overflow:hidden;
  background:#eef2f8;
  border-bottom:1px solid #eef2f8;
}

.ath-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  display:block;
}

.athlete-cards b{
  display:block;
  margin:9px 9px 3px;
  color:var(--navy);
  font-size:11px;
  line-height:1.15;
}

.athlete-cards span{
  display:block;
  margin:0 9px 7px;
  color:var(--muted);
  font-size:9.5px;
  line-height:1.2;
  font-weight:800;
}

.athlete-cards em{
  display:block;
  margin:auto 9px 10px;
  color:#8a6214;
  font-size:9.5px;
  line-height:1.2;
  font-style:normal;
  font-weight:900;
}

/* sponsor compact */
.sponsor-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:10px;
}

.sponsor-grid span{
  height:43px;
  border:1px dashed #cbd3df;
  border-radius:12px;
  background:#fafbfe;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#738096;
  font-size:10.5px;
  font-weight:900;
}

/* footer short and dense */
.footer{
  color:#fff;
  padding:26px 0;
  background:
    radial-gradient(circle at 0% 100%,rgba(217,162,59,.23),transparent 26%),
    radial-gradient(circle at 100% 100%,rgba(217,162,59,.18),transparent 26%),
    linear-gradient(135deg,#071936,#040811);
}

.footer-grid{
  display:grid;
  grid-template-columns:1.3fr 1fr 1fr 1.3fr;
  gap:28px;
  align-items:start;
}

.footer-brand{
  display:flex;
  align-items:center;
  gap:12px;
}

.footer-brand b{
  font-size:17px;
}

.footer p,
.footer a{
  display:block;
  margin:5px 0;
  color:rgba(255,255,255,.68);
  font-size:12.5px;
  line-height:1.55;
}

.footer h4{
  margin:0 0 8px;
  color:#ffd766;
  font-size:13.5px;
}

/* responsive */
@media(max-width:1240px){
  .nav{display:none}
  .hero-card{
    grid-template-columns:1fr;
    min-height:auto;
  }
  .hero-copy{
    padding:32px;
  }
  .hero-art{
    margin:0 28px 18px;
    min-height:300px;
  }
  .countdown-box{
    justify-self:stretch;
    width:auto;
    max-width:none;
    margin:0 28px 28px;
  }
  .main-grid,
  .lower-grid{
    grid-template-columns:1fr;
  }
}

@media(max-width:760px){
  .wrap{
    width:calc(100% - 24px);
  }

  .site-header{
    height:auto;
  }

  .header-inner{
    padding:13px 0;
  }

  .brand{
    min-width:0;
  }

  .brand-name strong{
    font-size:14px;
  }

  .brand-name small{
    font-size:12px;
  }

  .header-actions button:first-child{
    display:none;
  }

  .hero-section{
    padding:18px 0 0;
  }

  .hero-card{
    border-radius:24px;
  }

  .hero-copy{
    padding:24px 20px;
  }

  .hero-copy h1{
    font-size:40px;
    letter-spacing:-2.5px;
  }

  .hero-copy h3{
    font-size:20px;
  }

  .hero-art{
    min-height:255px;
    margin:0 18px 18px;
  }

  .timer{
    grid-template-columns:repeat(2,1fr);
  }

  .news-list,
  .sports-host,
  .sport-icons,
  .athlete-cards,
  .footer-grid{
    grid-template-columns:1fr;
  }
}

/* ===== V4.1 HERO MASTER MOCKUP ALIGNMENT ===== */

/* hero jadi satu banner horizontal, bukan 3 kotak terpisah */
.hero-card{
  display:block !important;
  position:relative !important;
  min-height:390px !important;
  height:390px !important;
  padding:0 !important;
  overflow:hidden !important;
  border-radius:30px !important;
  background:
    radial-gradient(circle at 92% 8%, rgba(201,149,46,.24), transparent 24%),
    linear-gradient(135deg,#fff 0%,#fff8f4 48%,#edf5ff 100%) !important;
}

/* pattern tetap halus */
.hero-card:before{
  z-index:0 !important;
}

/* teks kiri dibuat seperti mockup */
.hero-copy{
  position:absolute !important;
  z-index:5 !important;
  left:52px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:36% !important;
  padding:0 !important;
}

.date-pill{
  margin-bottom:16px !important;
  padding:10px 18px !important;
  font-size:13px !important;
}

.hero-copy h1{
  font-size:54px !important;
  line-height:.92 !important;
  letter-spacing:-3.4px !important;
}

.hero-copy h3{
  font-size:24px !important;
  margin:12px 0 14px !important;
}

.hero-copy p{
  max-width:440px !important;
  font-size:15px !important;
  line-height:1.55 !important;
  margin-bottom:20px !important;
}

.hero-buttons .btn{
  height:43px !important;
  border-radius:11px !important;
  padding:0 20px !important;
}

/* gambar hero tidak lagi kotak card, tapi jadi visual memanjang menyatu */
.hero-art{
  position:absolute !important;
  z-index:3 !important;
  right:205px !important;
  top:0 !important;
  bottom:0 !important;
  width:58% !important;
  height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  box-shadow:none !important;
  background-color:transparent !important;
  overflow:visible !important;
}

/* pakai asset hero sebagai background horizontal besar */
.hero-art-image{
  background-image:url('../img/hero_art.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* hilangkan kesan tepi kotak gambar dengan overlay kiri-kanan */
.hero-art-image:before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  inset:0 !important;
  z-index:2 !important;
  pointer-events:none !important;
  background:
    linear-gradient(90deg,
      rgba(255,248,244,1) 0%,
      rgba(255,248,244,.78) 4%,
      rgba(255,248,244,0) 14%,
      rgba(255,248,244,0) 82%,
      rgba(237,245,255,.42) 100%) !important;
}

/* countdown jadi overlay di kanan, seperti mockup */
.countdown-box{
  position:absolute !important;
  z-index:8 !important;
  right:34px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:300px !important;
  max-width:300px !important;
  margin:0 !important;
  padding:21px 18px !important;
  border-radius:22px !important;
}

.timer b{
  font-size:27px !important;
}

.countdown-box p{
  font-size:16px !important;
}

.countdown-box em{
  font-size:14px !important;
}

/* kasih ornamen Jepang halus supaya mendekati mockup */
.hero-card:after{
  content:"";
  position:absolute;
  z-index:1;
  right:-80px;
  top:-80px;
  width:360px;
  height:360px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(215,25,32,.13) 0 44%, transparent 45%);
  pointer-events:none;
}

/* posisi grid bawah sedikit naik dan rapat seperti mockup */
.main-grid{
  margin-top:14px !important;
}

/* responsive aman */
@media(max-width:1240px){
  .hero-card{
    height:auto !important;
    min-height:auto !important;
    display:block !important;
    padding:28px !important;
  }

  .hero-copy{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    padding:0 !important;
  }

  .hero-art{
    position:relative !important;
    right:auto !important;
    top:auto !important;
    bottom:auto !important;
    width:100% !important;
    height:320px !important;
    margin-top:22px !important;
    border-radius:22px !important;
    overflow:hidden !important;
  }

  .countdown-box{
    position:relative !important;
    right:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:none !important;
    margin-top:20px !important;
  }
}

@media(max-width:760px){
  .hero-card{
    padding:22px !important;
  }

  .hero-copy h1{
    font-size:40px !important;
    letter-spacing:-2.5px !important;
  }

  .hero-copy h3{
    font-size:20px !important;
  }

  .hero-art{
    height:250px !important;
  }
}

/* ===== HERO MASTER FINAL ===== */

.hero-card{
  position:relative !important;
  min-height:390px !important;
  height:390px !important;
  overflow:hidden !important;
  border-radius:30px !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.08)),
    url('../img/hero_master_mockup.png') center center / cover no-repeat !important;
  box-shadow:0 24px 60px rgba(7,25,54,.12) !important;
}

/* titik/pattern lama dimatikan */
.hero-card:before,
.hero-card:after{
  display:none !important;
}

/* hero visual lama dimatikan */
.hero-art{
  display:none !important;
}

/* teks kiri overlay di area kosong hero */
.hero-copy{
  position:absolute !important;
  z-index:5 !important;
  left:54px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:34% !important;
  padding:0 !important;
}

.date-pill{
  margin-bottom:16px !important;
}

.hero-copy h1{
  font-size:54px !important;
  line-height:.92 !important;
  letter-spacing:-3px !important;
  margin:0 !important;
}

.hero-copy h3{
  font-size:24px !important;
  margin:12px 0 14px !important;
}

.hero-copy p{
  font-size:15px !important;
  line-height:1.55 !important;
  max-width:430px !important;
  margin:0 0 20px !important;
}

.hero-buttons .btn{
  height:44px !important;
  padding:0 20px !important;
  border-radius:11px !important;
}

/* countdown box overlay kanan */
.countdown-box{
  position:absolute !important;
  z-index:7 !important;
  right:34px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  width:305px !important;
  max-width:305px !important;
  margin:0 !important;
  border-radius:22px !important;
  padding:22px 18px !important;
}

/* responsive */
@media(max-width:1240px){
  .hero-card{
    min-height:auto !important;
    height:auto !important;
    padding:28px !important;
    background-position:center center !important;
    background-size:cover !important;
  }

  .hero-copy{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    padding:0 !important;
  }

  .countdown-box{
    position:relative !important;
    right:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:none !important;
    margin-top:22px !important;
  }
}

@media(max-width:760px){
  .hero-copy h1{
    font-size:40px !important;
    letter-spacing:-2.4px !important;
  }

  .hero-copy h3{
    font-size:20px !important;
  }
}

/* ===== HERO MASTER V5.1 — closer to mockup ===== */

.hero-section{
  padding:28px 0 0 !important;
}

.hero-card{
  height:345px !important;
  min-height:345px !important;
  background-position:center center !important;
  background-size:cover !important;
}

/* beri area aman untuk teks kiri */
.hero-card::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:2 !important;
  inset:0 !important;
  background:linear-gradient(90deg,
    rgba(255,255,255,.96) 0%,
    rgba(255,255,255,.90) 22%,
    rgba(255,255,255,.42) 37%,
    rgba(255,255,255,0) 50%,
    rgba(255,255,255,0) 100%) !important;
  pointer-events:none !important;
}

.hero-copy{
  z-index:6 !important;
  left:58px !important;
  width:32% !important;
}

.date-pill{
  padding:8px 16px !important;
  font-size:12.5px !important;
  margin-bottom:12px !important;
}

.hero-copy h1{
  font-size:45px !important;
  line-height:.94 !important;
  letter-spacing:-2.8px !important;
}

.hero-copy h3{
  font-size:21px !important;
  margin:9px 0 12px !important;
}

.hero-copy p{
  max-width:400px !important;
  font-size:13.5px !important;
  line-height:1.5 !important;
  margin-bottom:17px !important;
}

.hero-buttons .btn{
  height:39px !important;
  padding:0 18px !important;
  font-size:12.5px !important;
}

.countdown-box{
  right:34px !important;
  width:285px !important;
  max-width:285px !important;
  padding:18px 16px !important;
}

.countdown-box small{
  font-size:10.5px !important;
  margin-bottom:11px !important;
}

.timer{
  gap:7px !important;
}

.timer div{
  padding:9px 4px !important;
  border-radius:12px !important;
}

.timer b{
  font-size:24px !important;
}

.timer span{
  font-size:8.5px !important;
}

.countdown-box p{
  font-size:14.5px !important;
  margin:13px 0 9px !important;
}

.countdown-box em{
  font-size:13px !important;
  padding-top:9px !important;
}

/* grid bawah lebih dekat ke hero */
.main-grid{
  margin-top:14px !important;
}

/* ===== HERO MASTER V5.2 — text safe area ===== */

/* geser background sedikit ke kanan agar atlet tidak tabrak teks */
.hero-card{
  background-position:58% center !important;
}

/* area putih kiri diperkuat dan diperlebar */
.hero-card::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  z-index:2 !important;
  inset:0 !important;
  background:linear-gradient(90deg,
    rgba(255,255,255,.98) 0%,
    rgba(255,255,255,.96) 20%,
    rgba(255,255,255,.88) 31%,
    rgba(255,255,255,.55) 39%,
    rgba(255,255,255,.15) 47%,
    rgba(255,255,255,0) 56%,
    rgba(255,255,255,0) 100%) !important;
  pointer-events:none !important;
}

/* teks kiri dibuat lebih compact seperti mockup */
.hero-copy{
  left:54px !important;
  width:31% !important;
}

.hero-copy h1{
  font-size:42px !important;
  line-height:.94 !important;
  letter-spacing:-2.5px !important;
  max-width:460px !important;
}

.hero-copy h3{
  font-size:20px !important;
  margin:9px 0 11px !important;
}

.hero-copy p{
  max-width:390px !important;
  font-size:13.5px !important;
  line-height:1.48 !important;
}

/* countdown sedikit lebih kecil dan agak kanan */
.countdown-box{
  right:30px !important;
  width:280px !important;
  max-width:280px !important;
  padding:17px 15px !important;
}

.timer b{
  font-size:23px !important;
}

/* desktop besar: hero jangan terlalu turun */
.hero-section{
  padding-top:24px !important;
}

/* card bawah lebih nempel */
.main-grid{
  margin-top:12px !important;
}

/* ===== HERO MASTER V5.3 — fix head crop ===== */

/* turunkan komposisi hero supaya kepala atlet tidak kepotong */
.hero-card{
  background-position: 60% 56% !important;
  background-size: 103% auto !important;
}

/* desktop besar: sedikit lebih turun lagi */
@media(min-width:1400px){
  .hero-card{
    background-position: 60% 58% !important;
    background-size: 102% auto !important;
  }
}

/* ===== HERO MASTER V5.4 — fix head crop properly ===== */

/* override final: kecilkan zoom + turunkan komposisi */
.hero-card{
  background-size: 100% auto !important;
  background-position: 60% 66% !important;
}

/* hapus efek override desktop lama yang bisa bikin naik lagi */
@media(min-width:1400px){
  .hero-card{
    background-size: 100% auto !important;
    background-position: 60% 68% !important;
  }
}

/* layar sangat lebar: turunkan sedikit lagi */
@media(min-width:1700px){
  .hero-card{
    background-size: 100% auto !important;
    background-position: 60% 70% !important;
  }
}

/* FIX HERO HEAD CROP FINAL */
.hero-card{
  background-size: 100% auto !important;
  background-position: 60% 70% !important;
}

/* FIX HERO HEAD CROP FINAL TRUE */
.hero-card{
  background-size: 100% auto !important;
  background-position: 60% 10% !important;
}

/* ===== LOWER SECTION V6 — main cards closer to mockup ===== */

/* jarak card dari hero dibuat lebih rapat */
.main-grid{
  margin-top:12px !important;
  gap:16px !important;
  align-items:stretch !important;
}

/* semua panel utama lebih compact */
.main-grid .panel{
  min-height:245px !important;
  max-height:255px !important;
  padding:18px 18px 16px !important;
  border-radius:18px !important;
  overflow:hidden !important;
}

/* judul card lebih dekat ke mockup */
.main-grid .panel-head{
  margin-bottom:10px !important;
}

.main-grid .panel-head h2{
  font-size:18px !important;
  line-height:1.05 !important;
}

.main-grid .panel-head a{
  font-size:11px !important;
}

/* JADWAL */
.schedule-item{
  min-height:43px !important;
  grid-template-columns:28px 1fr auto !important;
}

.schedule-item i{
  font-size:15px !important;
}

.schedule-item b{
  font-size:11.5px !important;
  line-height:1.15 !important;
}

.schedule-item span{
  font-size:10.5px !important;
}

.schedule-item em{
  font-size:9.5px !important;
  padding:5px 8px !important;
}

/* MEDALI */
.medal-panel table{
  font-size:11.5px !important;
}

.medal-panel th{
  font-size:9.5px !important;
  padding:6px 5px !important;
}

.medal-panel td{
  padding:7px 5px !important;
}

/* BERITA */
.news-panel{
  padding-bottom:14px !important;
}

.news-list{
  gap:10px !important;
}

.news-list article{
  min-height:185px !important;
  max-height:190px !important;
  border-radius:13px !important;
}

/* gambar berita dibuat rapi seperti thumbnail mockup */
.news-img{
  height:74px !important;
  border-bottom:1px solid #edf0f6 !important;
}

.news-img img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  transform:none !important;
}

/* crop per gambar supaya tidak kelihatan screenshot dobel */
.img-city img{
  object-position:center top !important;
}

.img-athlete img{
  object-position:center top !important;
}

.img-ceremony img{
  object-position:center top !important;
}

.news-list span{
  margin:9px 9px 5px !important;
  padding:4px 7px !important;
  font-size:8.5px !important;
}

.news-list h3{
  margin:0 9px 6px !important;
  font-size:11px !important;
  line-height:1.22 !important;
}

.news-list p{
  margin:auto 9px 10px !important;
  font-size:10px !important;
}

/* responsive safety */
@media(max-width:1240px){
  .main-grid .panel{
    min-height:auto !important;
    max-height:none !important;
  }

  .news-list article{
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== V6.3 clean heading icons + CSS flags ===== */

.panel-head h2.with-icon{
  display:flex !important;
  align-items:center !important;
  gap:7px !important;
}

.panel-head h2.with-icon > span:last-child{
  display:inline-block;
}

.head-icon{
  width:20px !important;
  height:20px !important;
  border-radius:6px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 20px !important;
  margin-right:1px !important;
}

.head-icon svg{
  width:15px;
  height:15px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.head-icon.calendar{
  background:#fff1f1 !important;
  color:#d71920 !important;
  border:1px solid rgba(215,25,32,.18) !important;
}

.head-icon.medal{
  background:#fff7e5 !important;
  color:#c9952e !important;
  border:1px solid rgba(201,149,46,.22) !important;
}

/* Reset flag lama */
.flag{
  display:inline-block !important;
  width:15px !important;
  height:10px !important;
  margin-right:7px !important;
  border-radius:2px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.10) !important;
  vertical-align:-1px !important;
  font-size:0 !important;
  line-height:0 !important;
  overflow:hidden !important;
  flex:0 0 auto !important;
}

/* CSS flags sederhana */
.flag.jp{
  background:
    radial-gradient(circle at center, #d71920 0 32%, transparent 34%),
    #fff;
}

.flag.cn{
  background:
    radial-gradient(circle at 28% 28%, #ffde59 0 10%, transparent 11%),
    #de2910;
}

.flag.kr{
  background:
    radial-gradient(circle at center, #d71920 0 22%, transparent 23%),
    linear-gradient(135deg, transparent 0 49%, #164b9b 50% 62%, transparent 63%),
    #fff;
}

.flag.in{
  background:linear-gradient(180deg,#ff9933 0 33%,#fff 33% 66%,#138808 66% 100%);
}

.flag.id{
  background:linear-gradient(180deg,#d71920 0 50%,#fff 50% 100%);
}

.medal-panel td:nth-child(2){
  white-space:nowrap !important;
}

.medal-panel td:nth-child(2){
  display:table-cell !important;
}

/* ===== FIX BROKEN ICON PATCH ===== */

/* matikan SVG icon lama yang kebaca besar */
.head-icon,
.head-icon svg,
.panel-head h2.with-icon svg{
  display:none !important;
  width:0 !important;
  height:0 !important;
  max-width:0 !important;
  max-height:0 !important;
}

/* heading balik rapi */
.panel-head h2{
  display:flex !important;
  align-items:center !important;
  gap:6px !important;
}

.mini-head-icon{
  width:18px;
  height:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 18px;
  border-radius:5px;
  font-size:12px;
  line-height:1;
}

.mini-head-icon.calendar{
  background:#fff1f1;
  border:1px solid rgba(215,25,32,.16);
}

.mini-head-icon.medal{
  background:#fff7e5;
  border:1px solid rgba(201,149,46,.22);
}

/* bendera negara kecil */
.flag{
  display:inline-block !important;
  width:16px !important;
  height:11px !important;
  margin-right:7px !important;
  border-radius:2px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.12) !important;
  vertical-align:-1px !important;
  font-size:0 !important;
  line-height:0 !important;
  overflow:hidden !important;
}

.flag.jp{
  background:
    radial-gradient(circle at center, #d71920 0 32%, transparent 34%),
    #fff;
}

.flag.cn{
  background:
    radial-gradient(circle at 28% 28%, #ffde59 0 10%, transparent 11%),
    #de2910;
}

.flag.kr{
  background:
    radial-gradient(circle at 52% 50%, #d71920 0 22%, transparent 23%),
    linear-gradient(135deg, transparent 0 48%, #164b9b 49% 62%, transparent 63%),
    #fff;
}

.flag.in{
  background:linear-gradient(180deg,#ff9933 0 33%,#fff 33% 66%,#138808 66% 100%);
}

.flag.id{
  background:linear-gradient(180deg,#d71920 0 50%,#fff 50% 100%);
}

.medal-panel td:nth-child(2){
  white-space:nowrap !important;
}

/* ===== V6.4 medal table restore + better icon spacing ===== */

/* jarak icon heading */
.panel-head h2{
  gap:10px !important;
}

.mini-head-icon{
  margin-right:4px !important;
}

/* reset bendera baru, tidak bentrok dengan flag lama */
.country-flag{
  display:inline-block !important;
  width:16px !important;
  height:11px !important;
  margin-right:7px !important;
  border-radius:2px !important;
  vertical-align:-1px !important;
  box-shadow:0 0 0 1px rgba(0,0,0,.16) !important;
  overflow:hidden !important;
  background:#ddd;
}

/* Jepang */
.country-flag.flag-jp{
  background:
    radial-gradient(circle at center, #bc002d 0 32%, transparent 34%),
    #fff !important;
}

/* Tiongkok */
.country-flag.flag-cn{
  background:
    radial-gradient(circle at 30% 30%, #ffde00 0 10%, transparent 11%),
    #de2910 !important;
}

/* Korea Selatan simplified */
.country-flag.flag-kr{
  background:
    radial-gradient(circle at 50% 50%, #cd2e3a 0 22%, transparent 23%),
    linear-gradient(135deg, transparent 0 49%, #0047a0 50% 63%, transparent 64%),
    #fff !important;
}

/* India */
.country-flag.flag-in{
  background:linear-gradient(180deg,#ff9933 0 33%,#fff 33% 66%,#138808 66% 100%) !important;
}

/* Indonesia */
.country-flag.flag-id{
  background:linear-gradient(180deg,#ce1126 0 50%,#fff 50% 100%) !important;
}

.medal-panel td:nth-child(2){
  white-space:nowrap !important;
}

/* ===== V6.5 icon spacing + bottom links ===== */

/* heading icon jangan nempel */
.panel-head h2{
  gap:12px !important;
}

.mini-head-icon{
  margin-right:6px !important;
}

/* khusus Jadwal & Medali: link kanan atas disembunyikan agar sesuai mockup bawah */
.schedule-panel > .panel-head > a,
.medal-panel > .panel-head > a{
  display:none !important;
}

/* panel dibuat layout vertikal supaya link bawah duduk di bawah */
.schedule-panel,
.medal-panel{
  display:flex !important;
  flex-direction:column !important;
}

/* link bawah seperti mockup */
.panel-bottom-link{
  display:inline-flex !important;
  align-items:center !important;
  margin-top:auto !important;
  padding-top:9px !important;
  color:#15539a !important;
  font-size:10.5px !important;
  font-weight:900 !important;
  line-height:1 !important;
}

/* jadwal/medali diberi ruang supaya link bawah tidak hilang */
.schedule-list{
  margin-bottom:4px !important;
}

.medal-panel table{
  margin-bottom:4px !important;
}

/* kalau tinggi card terlalu sempit, longgarkan sedikit */
.main-grid .panel{
  height:235px !important;
  min-height:235px !important;
  max-height:235px !important;
}

/* ===== FIX MAIN CARDS CLEAN V6.6 ===== */

/* Sembunyikan link kanan atas khusus Jadwal dan Medali */
.main-grid > .panel:nth-child(1) > .panel-head > a,
.main-grid > .panel:nth-child(2) > .panel-head > a{
  display:none !important;
}

/* Card dibuat stabil */
.main-grid .panel{
  position:relative !important;
  height:238px !important;
  min-height:238px !important;
  max-height:238px !important;
  padding:16px 18px 34px !important;
  overflow:hidden !important;
}

/* Header card tetap normal */
.main-grid .panel-head{
  margin-bottom:8px !important;
}

.main-grid .panel-head h2{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  font-size:16px !important;
}

/* Ikon heading diberi jarak natural */
.mini-head-icon{
  margin-right:3px !important;
  transform:translateY(0) !important;
}

/* Jadwal compact */
.schedule-item{
  min-height:36px !important;
  grid-template-columns:26px 1fr auto !important;
}

.schedule-item b{
  font-size:10.8px !important;
}

.schedule-item span{
  font-size:9.8px !important;
}

.schedule-item em{
  font-size:8.5px !important;
  padding:4px 8px !important;
}

/* Tabel medali compact */
.medal-panel table{
  font-size:10.8px !important;
  margin-bottom:0 !important;
}

.medal-panel th{
  font-size:8.8px !important;
  padding:5px 5px !important;
}

.medal-panel td{
  padding:5.5px 5px !important;
}

/* Link bawah hanya untuk Jadwal dan Medali, kecil dan di bawah */
.schedule-panel .panel-bottom-link,
.medal-panel .panel-bottom-link{
  position:absolute !important;
  left:18px !important;
  bottom:13px !important;
  display:inline-flex !important;
  padding:0 !important;
  margin:0 !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#15539a !important;
}

/* Jangan pakai flex auto yang bikin posisi aneh */
.schedule-panel,
.medal-panel{
  display:block !important;
}

/* Card berita tidak ikut berubah */
.news-panel{
  padding:16px 18px 12px !important;
}

/* Mobile/tablet jangan dikunci */
@media(max-width:1240px){
  .main-grid .panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
    padding-bottom:16px !important;
  }

  .schedule-panel .panel-bottom-link,
  .medal-panel .panel-bottom-link{
    position:static !important;
    margin-top:10px !important;
  }
}

/* ===== FIX SCHEDULE BOTTOM LINK ===== */

.schedule-panel{
  position:relative !important;
  padding-bottom:34px !important;
}

.schedule-panel .schedule-bottom-link{
  position:absolute !important;
  left:18px !important;
  bottom:13px !important;
  display:inline-flex !important;
  color:#15539a !important;
  font-size:10px !important;
  font-weight:900 !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
}

/* ===== LOWER SECTION V7 — Sports, Athlete, Sponsor closer to mockup ===== */

/* jarak dari 3 card utama ke section bawah */
.lower-grid{
  margin-top:16px !important;
  gap:16px !important;
  align-items:stretch !important;
}

/* semua card bawah dibuat sejajar dan compact */
.lower-grid .panel{
  height:230px !important;
  min-height:230px !important;
  max-height:230px !important;
  padding:16px 18px !important;
  border-radius:18px !important;
  overflow:hidden !important;
  box-shadow:0 10px 24px rgba(7,25,54,.09) !important;
}

/* heading section bawah */
.lower-grid .panel-head{
  margin-bottom:11px !important;
}

.lower-grid .panel-head h2{
  font-size:17px !important;
  line-height:1.05 !important;
  letter-spacing:-.4px !important;
}

.lower-grid .panel-head a{
  font-size:10.5px !important;
  font-weight:900 !important;
}

/* SPORTS & HOST CITIES */
.sports-host{
  grid-template-columns:1fr .92fr !important;
  gap:14px !important;
}

.sports-box h4{
  font-size:10.5px !important;
  margin:0 0 8px !important;
}

.sport-icons{
  grid-template-columns:repeat(4,1fr) !important;
  gap:7px !important;
}

.sport-icons span{
  min-height:50px !important;
  border-radius:12px !important;
  gap:3px !important;
}

.sport-icons i{
  font-size:16px !important;
}

.sport-icons b{
  font-size:8.8px !important;
  line-height:1.05 !important;
}

/* Host Guide */
.host-card{
  min-height:150px !important;
  height:150px !important;
  border-radius:16px !important;
  padding:14px !important;
}

.host-card small{
  font-size:8.8px !important;
  margin-bottom:6px !important;
}

.host-card h3{
  font-size:17px !important;
  max-width:220px !important;
  line-height:1.05 !important;
}

.host-card p{
  font-size:10.3px !important;
  line-height:1.35 !important;
  margin:7px 0 8px !important;
}

.host-card a{
  font-size:10px !important;
}

/* PROFIL ATLET */
.athlete-cards{
  gap:9px !important;
}

.athlete-cards article{
  min-height:175px !important;
  max-height:178px !important;
  border-radius:13px !important;
}

.ath-img{
  height:70px !important;
}

.ath-img img{
  object-fit:cover !important;
  object-position:center top !important;
}

.athlete-cards b{
  margin:8px 8px 3px !important;
  font-size:10.3px !important;
  line-height:1.15 !important;
}

.athlete-cards span{
  margin:0 8px 6px !important;
  font-size:8.8px !important;
  line-height:1.15 !important;
}

.athlete-cards em{
  margin:auto 8px 9px !important;
  font-size:8.8px !important;
  line-height:1.15 !important;
}

/* SPONSOR */
.sponsor-grid{
  gap:8px !important;
}

.sponsor-grid span{
  height:38px !important;
  border-radius:11px !important;
  font-size:9.5px !important;
}

/* Footer lebih pendek seperti mockup */
.footer{
  padding:24px 0 !important;
}

.footer-grid{
  gap:24px !important;
}

.footer-brand b{
  font-size:16px !important;
}

.footer p,
.footer a{
  font-size:11.8px !important;
  line-height:1.5 !important;
  margin:4px 0 !important;
}

.footer h4{
  font-size:13px !important;
  margin-bottom:7px !important;
}

/* responsive safety */
@media(max-width:1240px){
  .lower-grid .panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .host-card{
    height:auto !important;
    min-height:160px !important;
  }

  .athlete-cards article{
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== LOWER SECTION V7.1 — host card clean + athlete polish ===== */

/* Host card: kurangi teks bayangan dari background */
.host-card-image{
  background-image:
    linear-gradient(90deg, rgba(7,25,54,.94) 0%, rgba(7,25,54,.80) 42%, rgba(7,25,54,.38) 100%),
    url('../img/venue.png') !important;
  background-size:155% auto !important;
  background-position:right center !important;
  background-repeat:no-repeat !important;
}

.host-card-image:before{
  background:linear-gradient(90deg,
    rgba(7,25,54,.92) 0%,
    rgba(7,25,54,.72) 48%,
    rgba(7,25,54,.30) 100%) !important;
}

.host-card h3{
  max-width:235px !important;
  font-size:16.5px !important;
}

.host-card p{
  max-width:245px !important;
}

/* Athlete cards dibuat lebih padat */
.athlete-cards article{
  min-height:168px !important;
  max-height:170px !important;
}

.ath-img{
  height:64px !important;
}

.athlete-cards b{
  margin-top:7px !important;
}

.athlete-cards em{
  margin-bottom:8px !important;
}

/* Sponsor grid sedikit lebih premium */
.sponsor-grid span{
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
  border-color:#d7deea !important;
  letter-spacing:.2px !important;
}

/* Card bawah sedikit lebih pendek */
.lower-grid .panel{
  height:220px !important;
  min-height:220px !important;
  max-height:220px !important;
}

/* ===== LOWER SECTION V7.2 — fix sponsor crop ===== */

/* card sponsor perlu sedikit lebih tinggi agar grid tidak kepotong */
.sponsor-panel{
  height:242px !important;
  min-height:242px !important;
  max-height:242px !important;
}

/* sports dan atlet tetap compact */
.sports-panel,
.athlete-panel{
  height:220px !important;
  min-height:220px !important;
  max-height:220px !important;
}

/* sponsor grid dirapikan */
.sponsor-grid{
  gap:9px !important;
}

.sponsor-grid span{
  height:40px !important;
}

/* beri jarak footer agar tidak terasa menabrak */
.footer{
  margin-top:8px !important;
}

/* mobile/tablet aman */
@media(max-width:1240px){
  .sponsor-panel,
  .sports-panel,
  .athlete-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== FIX SPONSOR CROP REAL OVERRIDE ===== */

/* selector dibuat lebih kuat dari .lower-grid .panel */
.lower-grid > .panel.sponsor-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  overflow:hidden !important;
  padding:16px 18px !important;
}

/* sports dan atlet ikut disamakan biar row bawah sejajar */
.lower-grid > .panel.sports-panel,
.lower-grid > .panel.athlete-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
}

/* sponsor grid diperkecil agar semua 8 item masuk */
.lower-grid > .panel.sponsor-panel .sponsor-grid{
  display:grid !important;
  grid-template-columns:repeat(2,1fr) !important;
  gap:8px !important;
}

.lower-grid > .panel.sponsor-panel .sponsor-grid span{
  height:35px !important;
  min-height:35px !important;
  border-radius:11px !important;
  font-size:9.3px !important;
}

/* heading sponsor jangan makan tinggi terlalu banyak */
.lower-grid > .panel.sponsor-panel .panel-head{
  margin-bottom:10px !important;
}

/* mobile/tablet tetap fleksibel */
@media(max-width:1240px){
  .lower-grid > .panel.sponsor-panel,
  .lower-grid > .panel.sports-panel,
  .lower-grid > .panel.athlete-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== FOOTER V8 — premium compact footer ===== */

.footer{
  position:relative !important;
  overflow:hidden !important;
  margin-top:18px !important;
  padding:26px 0 24px !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 0% 100%, rgba(217,162,59,.28), transparent 25%),
    radial-gradient(circle at 100% 100%, rgba(217,162,59,.24), transparent 25%),
    linear-gradient(135deg,#071936 0%,#051226 48%,#11100d 100%) !important;
}

.footer:before,
.footer:after{
  content:"";
  position:absolute;
  bottom:-42px;
  width:190px;
  height:190px;
  border-radius:50%;
  opacity:.58;
  pointer-events:none;
  background:
    repeating-radial-gradient(circle,
      rgba(217,162,59,.85) 0 2px,
      transparent 2px 10px);
}

.footer:before{
  left:-54px;
}

.footer:after{
  right:-54px;
}

.footer-grid{
  position:relative;
  z-index:2;
  display:grid !important;
  grid-template-columns:1.35fr .82fr .82fr 1.6fr !important;
  gap:34px !important;
  align-items:start !important;
}

.footer-brand{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin-bottom:10px !important;
}

.footer-brand b{
  display:block !important;
  font-size:17px !important;
  line-height:1 !important;
  color:#fff !important;
}

.footer-brand small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:800;
}

.footer-about p{
  max-width:310px;
}

.footer h4{
  margin:0 0 9px !important;
  color:#ffd766 !important;
  font-size:13.5px !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block;
  margin:4px 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:12px !important;
  line-height:1.55 !important;
  font-weight:700 !important;
}

.socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}

.socials a{
  width:24px;
  height:24px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  color:#fff !important;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:12px !important;
  margin:0 !important;
}

.footer-copy{
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:14px;
  margin-top:6px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.62);
  font-size:11.5px;
  font-weight:700;
}

.footer-copy a{
  display:inline !important;
  font-size:11.5px !important;
  color:rgba(255,255,255,.76) !important;
  margin:0 !important;
}

@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .footer-copy{
    flex-direction:column;
  }
}

@media(max-width:640px){
  .footer-grid{
    grid-template-columns:1fr !important;
  }
}
EOFcat >> assets/css/style.css <<'EOF'

/* ===== FOOTER V8 — premium compact footer ===== */

.footer{
  position:relative !important;
  overflow:hidden !important;
  margin-top:18px !important;
  padding:26px 0 24px !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 0% 100%, rgba(217,162,59,.28), transparent 25%),
    radial-gradient(circle at 100% 100%, rgba(217,162,59,.24), transparent 25%),
    linear-gradient(135deg,#071936 0%,#051226 48%,#11100d 100%) !important;
}

.footer:before,
.footer:after{
  content:"";
  position:absolute;
  bottom:-42px;
  width:190px;
  height:190px;
  border-radius:50%;
  opacity:.58;
  pointer-events:none;
  background:
    repeating-radial-gradient(circle,
      rgba(217,162,59,.85) 0 2px,
      transparent 2px 10px);
}

.footer:before{
  left:-54px;
}

.footer:after{
  right:-54px;
}

.footer-grid{
  position:relative;
  z-index:2;
  display:grid !important;
  grid-template-columns:1.35fr .82fr .82fr 1.6fr !important;
  gap:34px !important;
  align-items:start !important;
}

.footer-brand{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin-bottom:10px !important;
}

.footer-brand b{
  display:block !important;
  font-size:17px !important;
  line-height:1 !important;
  color:#fff !important;
}

.footer-brand small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:800;
}

.footer-about p{
  max-width:310px;
}

.footer h4{
  margin:0 0 9px !important;
  color:#ffd766 !important;
  font-size:13.5px !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block;
  margin:4px 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:12px !important;
  line-height:1.55 !important;
  font-weight:700 !important;
}

.socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}

.socials a{
  width:24px;
  height:24px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  color:#fff !important;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:12px !important;
  margin:0 !important;
}

.footer-copy{
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:14px;
  margin-top:6px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.62);
  font-size:11.5px;
  font-weight:700;
}

.footer-copy a{
  display:inline !important;
  font-size:11.5px !important;
  color:rgba(255,255,255,.76) !important;
  margin:0 !important;
}

@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .footer-copy{
    flex-direction:column;
  }
}

@media(max-width:640px){
  .footer-grid{
    grid-template-columns:1fr !important;
  }
}
EOFcat >> assets/css/style.css <<'EOF'

/* ===== FOOTER V8 — premium compact footer ===== */

.footer{
  position:relative !important;
  overflow:hidden !important;
  margin-top:18px !important;
  padding:26px 0 24px !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 0% 100%, rgba(217,162,59,.28), transparent 25%),
    radial-gradient(circle at 100% 100%, rgba(217,162,59,.24), transparent 25%),
    linear-gradient(135deg,#071936 0%,#051226 48%,#11100d 100%) !important;
}

.footer:before,
.footer:after{
  content:"";
  position:absolute;
  bottom:-42px;
  width:190px;
  height:190px;
  border-radius:50%;
  opacity:.58;
  pointer-events:none;
  background:
    repeating-radial-gradient(circle,
      rgba(217,162,59,.85) 0 2px,
      transparent 2px 10px);
}

.footer:before{
  left:-54px;
}

.footer:after{
  right:-54px;
}

.footer-grid{
  position:relative;
  z-index:2;
  display:grid !important;
  grid-template-columns:1.35fr .82fr .82fr 1.6fr !important;
  gap:34px !important;
  align-items:start !important;
}

.footer-brand{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin-bottom:10px !important;
}

.footer-brand b{
  display:block !important;
  font-size:17px !important;
  line-height:1 !important;
  color:#fff !important;
}

.footer-brand small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:800;
}

.footer-about p{
  max-width:310px;
}

.footer h4{
  margin:0 0 9px !important;
  color:#ffd766 !important;
  font-size:13.5px !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block;
  margin:4px 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:12px !important;
  line-height:1.55 !important;
  font-weight:700 !important;
}

.socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}

.socials a{
  width:24px;
  height:24px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  color:#fff !important;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:12px !important;
  margin:0 !important;
}

.footer-copy{
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:14px;
  margin-top:6px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.62);
  font-size:11.5px;
  font-weight:700;
}

.footer-copy a{
  display:inline !important;
  font-size:11.5px !important;
  color:rgba(255,255,255,.76) !important;
  margin:0 !important;
}

@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .footer-copy{
    flex-direction:column;
  }
}

@media(max-width:640px){
  .footer-grid{
    grid-template-columns:1fr !important;
  }
}
EOFcat >> assets/css/style.css <<'EOF'

/* ===== FOOTER V8 — premium compact footer ===== */

.footer{
  position:relative !important;
  overflow:hidden !important;
  margin-top:18px !important;
  padding:26px 0 24px !important;
  color:#fff !important;
  background:
    radial-gradient(circle at 0% 100%, rgba(217,162,59,.28), transparent 25%),
    radial-gradient(circle at 100% 100%, rgba(217,162,59,.24), transparent 25%),
    linear-gradient(135deg,#071936 0%,#051226 48%,#11100d 100%) !important;
}

.footer:before,
.footer:after{
  content:"";
  position:absolute;
  bottom:-42px;
  width:190px;
  height:190px;
  border-radius:50%;
  opacity:.58;
  pointer-events:none;
  background:
    repeating-radial-gradient(circle,
      rgba(217,162,59,.85) 0 2px,
      transparent 2px 10px);
}

.footer:before{
  left:-54px;
}

.footer:after{
  right:-54px;
}

.footer-grid{
  position:relative;
  z-index:2;
  display:grid !important;
  grid-template-columns:1.35fr .82fr .82fr 1.6fr !important;
  gap:34px !important;
  align-items:start !important;
}

.footer-brand{
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  margin-bottom:10px !important;
}

.footer-brand b{
  display:block !important;
  font-size:17px !important;
  line-height:1 !important;
  color:#fff !important;
}

.footer-brand small{
  display:block;
  margin-top:4px;
  color:rgba(255,255,255,.72);
  font-size:12px;
  font-weight:800;
}

.footer-about p{
  max-width:310px;
}

.footer h4{
  margin:0 0 9px !important;
  color:#ffd766 !important;
  font-size:13.5px !important;
  font-weight:900 !important;
}

.footer p,
.footer a{
  display:block;
  margin:4px 0 !important;
  color:rgba(255,255,255,.72) !important;
  font-size:12px !important;
  line-height:1.55 !important;
  font-weight:700 !important;
}

.socials{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:12px;
}

.socials a{
  width:24px;
  height:24px;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  color:#fff !important;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.14);
  font-size:12px !important;
  margin:0 !important;
}

.footer-copy{
  grid-column:1 / -1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding-top:14px;
  margin-top:6px;
  border-top:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.62);
  font-size:11.5px;
  font-weight:700;
}

.footer-copy a{
  display:inline !important;
  font-size:11.5px !important;
  color:rgba(255,255,255,.76) !important;
  margin:0 !important;
}

@media(max-width:900px){
  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .footer-copy{
    flex-direction:column;
  }
}

@media(max-width:640px){
  .footer-grid{
    grid-template-columns:1fr !important;
  }
}

/* ===== FOOTER V8.1 — match compact mockup ===== */

.footer{
  width:min(1500px, calc(100% - 72px)) !important;
  margin:10px auto 0 !important;
  padding:18px 28px 16px !important;
  min-height:112px !important;
  max-height:124px !important;
  overflow:hidden !important;
  border-radius:0 0 18px 18px !important;
  color:#fff !important;
  background:
    linear-gradient(135deg,#071936 0%,#082044 55%,#061327 100%) !important;
  box-shadow:0 -8px 22px rgba(7,25,54,.08) !important;
}

/* ornamen dibuat kecil seperti mockup, bukan lingkaran besar */
.footer:before,
.footer:after{
  content:"" !important;
  position:absolute !important;
  bottom:-70px !important;
  width:155px !important;
  height:155px !important;
  border-radius:50% !important;
  opacity:.42 !important;
  pointer-events:none !important;
  background:
    repeating-radial-gradient(circle,
      rgba(217,162,59,.90) 0 2px,
      transparent 2px 9px) !important;
}

.footer:before{
  left:-42px !important;
}

.footer:after{
  right:-42px !important;
}

/* grid jadi satu baris seperti mockup */
.footer-grid{
  width:100% !important;
  display:grid !important;
  grid-template-columns:1.35fr .9fr .82fr 1.45fr 1.25fr !important;
  gap:28px !important;
  align-items:start !important;
  position:relative !important;
  z-index:2 !important;
}

/* brand kiri */
.footer-brand{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  margin:0 0 10px !important;
}

.footer-brand .logo-mark.small{
  width:40px !important;
  height:40px !important;
  border-radius:13px !important;
}

.footer-brand b{
  font-size:15.5px !important;
  line-height:1 !important;
  color:#fff !important;
}

.footer-brand small{
  margin-top:3px !important;
  font-size:11px !important;
  color:rgba(255,255,255,.72) !important;
}

/* hapus paragraf deskripsi panjang kalau masih ada */
.footer-about > p{
  display:none !important;
}

/* social icon kecil */
.socials{
  margin-top:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  padding-left:48px !important;
}

.socials a{
  width:20px !important;
  height:20px !important;
  font-size:10px !important;
  border-radius:999px !important;
  background:rgba(255,255,255,.11) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  color:#fff !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  margin:0 !important;
}

/* teks footer lebih kecil dan padat */
.footer h4{
  margin:0 0 6px !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  color:#ffd766 !important;
  text-transform:uppercase !important;
}

.footer p,
.footer a{
  margin:3px 0 !important;
  font-size:10.5px !important;
  line-height:1.38 !important;
  color:rgba(255,255,255,.72) !important;
  font-weight:700 !important;
}

/* copyright jadi kolom kanan, bukan baris bawah */
.footer-copy{
  grid-column:auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 !important;
  border-top:0 !important;
  color:rgba(255,255,255,.70) !important;
  font-size:10.5px !important;
  line-height:1.4 !important;
  font-weight:700 !important;
}

.footer-copy span{
  display:block !important;
}

.footer-copy a{
  display:inline !important;
  font-size:10.5px !important;
  margin:0 !important;
}

/* responsive tetap aman */
@media(max-width:1100px){
  .footer{
    max-height:none !important;
    border-radius:18px !important;
  }

  .footer-grid{
    grid-template-columns:1fr 1fr !important;
  }

  .footer-copy{
    grid-column:1 / -1 !important;
  }
}

@media(max-width:640px){
  .footer{
    width:calc(100% - 24px) !important;
    padding:22px !important;
  }

  .footer-grid{
    grid-template-columns:1fr !important;
  }

  .socials{
    padding-left:0 !important;
  }
}

/* ===== FOOTER V8.2 — batik corner motif like mockup ===== */

/* ganti ornamen bulat menjadi motif batik sudut */
.footer:before,
.footer:after{
  content:"" !important;
  position:absolute !important;
  bottom:0 !important;
  width:245px !important;
  height:118px !important;
  border-radius:0 !important;
  opacity:.92 !important;
  pointer-events:none !important;
  background:none !important;
  background-image:url("data:image/svg+xml,%3Csvg width='260' height='130' viewBox='0 0 260 130' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' stroke='%23d8a33a' stroke-width='2.2' opacity='.95'%3E%3Cpath d='M-10 130 C20 90 48 58 88 42 C124 28 164 28 206 12'/%3E%3Cpath d='M-6 118 C22 82 54 54 94 40 C132 27 172 27 224 8'/%3E%3Cpath d='M-8 104 C18 76 50 50 86 36 C118 23 158 21 202 6'/%3E%3Cpath d='M0 130 C20 110 44 92 76 82 C112 70 150 72 190 52 C220 38 238 18 254 0'/%3E%3Cpath d='M28 130 C46 108 66 94 94 86 C134 74 174 80 214 54 C234 42 250 24 264 8'/%3E%3Cpath d='M58 130 C78 106 100 96 130 92 C168 88 198 74 230 44 C244 30 254 18 264 6'/%3E%3C/g%3E%3Cg fill='none' stroke='%23d8a33a' stroke-width='1.5' opacity='.75'%3E%3Cpath d='M14 128 q28-42 70-50 q42-8 72-42'/%3E%3Cpath d='M42 128 q26-34 64-40 q46-8 82-44'/%3E%3Cpath d='M74 128 q22-26 54-30 q46-6 84-40'/%3E%3Cpath d='M106 128 q20-20 48-24 q40-6 78-34'/%3E%3C/g%3E%3Cg fill='%23d8a33a' opacity='.90'%3E%3Ccircle cx='36' cy='112' r='3'/%3E%3Ccircle cx='66' cy='92' r='2.5'/%3E%3Ccircle cx='102' cy='76' r='2.5'/%3E%3Ccircle cx='142' cy='66' r='2.5'/%3E%3Ccircle cx='188' cy='38' r='2.5'/%3E%3C/g%3E%3Cg fill='none' stroke='%23d8a33a' stroke-width='1.2' opacity='.70'%3E%3Cpath d='M0 126 h260'/%3E%3Cpath d='M10 118 h210'/%3E%3Cpath d='M28 110 h166'/%3E%3Cpath d='M52 102 h126'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size:100% 100% !important;
  background-repeat:no-repeat !important;
}

.footer:before{
  left:0 !important;
  right:auto !important;
  transform:none !important;
}

.footer:after{
  right:0 !important;
  left:auto !important;
  transform:scaleX(-1) !important;
}

/* supaya motif tidak menutupi teks */
.footer-grid{
  position:relative !important;
  z-index:2 !important;
}

/* footer tetap pendek seperti mockup */
.footer{
  min-height:112px !important;
  max-height:124px !important;
}

/* ===== FOOTER V8.3 — use real batik corner PNG ===== */

.footer:before,
.footer:after{
  content:"" !important;
  position:absolute !important;
  bottom:0 !important;
  width:255px !important;
  height:124px !important;
  opacity:1 !important;
  border-radius:0 !important;
  pointer-events:none !important;
  background-size:contain !important;
  background-repeat:no-repeat !important;
  background-position:bottom left !important;
}

.footer:before{
  left:0 !important;
  right:auto !important;
  transform:none !important;
  background-image:url('../img/footer_batik_left.png') !important;
}

.footer:after{
  right:0 !important;
  left:auto !important;
  transform:none !important;
  background-image:url('../img/footer_batik_right.png') !important;
  background-position:bottom right !important;
}

.footer-grid{
  position:relative !important;
  z-index:2 !important;
}

/* ===== FOOTER V8.4 — batik motif nempel ke ujung ===== */

.footer{
  overflow:hidden !important;
}

/* dorong ornamen ke sudut footer */
.footer:before,
.footer:after{
  width:290px !important;
  height:140px !important;
  bottom:-2px !important;
  background-size:100% 100% !important;
}

/* kiri benar-benar nempel */
.footer:before{
  left:-6px !important;
  background-position:left bottom !important;
}

/* kanan benar-benar nempel */
.footer:after{
  right:-6px !important;
  background-position:right bottom !important;
}

/* kalau masih terasa masuk, ini bantu ruang konten tetap aman */
.footer-grid{
  padding-left:6px !important;
  padding-right:6px !important;
}

/* ===== FOOTER V8.5 — force batik to footer edges ===== */

.footer{
  overflow:hidden !important;
}

/* motif dibesarkan karena file PNG ada area transparan */
.footer:before,
.footer:after{
  width:390px !important;
  height:145px !important;
  bottom:-4px !important;
  background-size:100% 100% !important;
  background-repeat:no-repeat !important;
}

/* kiri ditarik keluar */
.footer:before{
  left:-115px !important;
  right:auto !important;
  background-position:left bottom !important;
}

/* kanan ditarik keluar */
.footer:after{
  right:-115px !important;
  left:auto !important;
  background-position:right bottom !important;
}

/* konten tetap aman di atas motif */
.footer-grid{
  position:relative !important;
  z-index:3 !important;
}

/* ===== FOOTER V8.6 — move brand away from batik ===== */

/* beri ruang kiri supaya logo tidak ketiban motif batik */
.footer-about{
  padding-left:185px !important;
}

/* social ikut sejajar dengan logo */
.socials{
  padding-left:48px !important;
}

/* motif kiri tetap nempel */
.footer:before{
  left:-115px !important;
}

/* tablet/mobile jangan digeser */
@media(max-width:1100px){
  .footer-about{
    padding-left:0 !important;
  }

  .socials{
    padding-left:0 !important;
  }
}

/* ===== FOOTER V8.7 — batik left tighter, logo safe ===== */

/* kecilkan dan tarik batik kiri ke sudut */
.footer:before{
  width:330px !important;
  height:124px !important;
  left:-105px !important;
  bottom:0 !important;
  background-size:100% 100% !important;
  background-position:left bottom !important;
}

/* batik kanan tetap aman */
.footer:after{
  width:330px !important;
  height:124px !important;
  right:-105px !important;
  bottom:0 !important;
  background-size:100% 100% !important;
  background-position:right bottom !important;
}

/* logo jangan terlalu jauh, tapi tetap bebas dari batik */
.footer-about{
  padding-left:205px !important;
}

/* social sejajar di bawah logo */
.socials{
  padding-left:48px !important;
}

/* ===== FOOTER V8.8 — final brand spacing ===== */

/* batik kiri sedikit lebih pendek supaya tidak ganggu logo */
.footer:before{
  width:305px !important;
  height:118px !important;
  left:-102px !important;
}

/* kanan disamakan */
.footer:after{
  width:305px !important;
  height:118px !important;
  right:-102px !important;
}

/* brand geser sedikit kanan, tapi tidak terlalu jauh */
.footer-about{
  padding-left:230px !important;
}

/* sosial tetap sejajar dengan teks brand */
.socials{
  padding-left:48px !important;
}

/* ===== FOOTER V8.9 — corner batik full edge like mockup ===== */

/* footer dibikin benar-benar memotong isi pseudo element */
.footer{
  overflow:hidden !important;
  position:relative !important;
  padding-bottom:14px !important;
}

/* motif sudut kiri/kanan harus full sampai ujung dan bawah */
.footer:before,
.footer:after{
  content:"" !important;
  position:absolute !important;
  bottom:-1px !important;
  width:360px !important;
  height:150px !important;
  opacity:1 !important;
  pointer-events:none !important;
  background-repeat:no-repeat !important;
  background-size:100% 100% !important;
  z-index:1 !important;
}

/* kiri: tarik lebih keluar supaya tidak ada gap sisi kiri */
.footer:before{
  left:-132px !important;
  right:auto !important;
  background-image:url('../img/footer_batik_left.png') !important;
  background-position:left bottom !important;
}

/* kanan: samakan dengan mockup */
.footer:after{
  right:-132px !important;
  left:auto !important;
  background-image:url('../img/footer_batik_right.png') !important;
  background-position:right bottom !important;
}

/* semua isi footer harus berada di atas motif */
.footer-grid{
  position:relative !important;
  z-index:3 !important;
}

/* brand kiri tetap aman, tapi jangan terlalu jauh */
.footer-about{
  padding-left:220px !important;
}

/* ikon sosial tetap sejajar */
.socials{
  padding-left:48px !important;
}

/* ===== FOOTER V8.10 — remove bottom gap ===== */

.footer{
  padding-bottom:0 !important;
  margin-bottom:0 !important;
  border-bottom:0 !important;
  overflow:hidden !important;
}

/* turunkan ornamen sedikit supaya nutup gap bawah */
.footer:before,
.footer:after{
  bottom:-8px !important;
  height:158px !important;
}

/* jangan ada jarak bawah dari isi footer */
.footer-grid,
.footer-about,
.footer-copy{
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== FOOTER V8.10 — remove bottom gap ===== */

.footer{
  padding-bottom:0 !important;
  margin-bottom:0 !important;
  border-bottom:0 !important;
  overflow:hidden !important;
}

/* turunkan ornamen sedikit supaya nutup gap bawah */
.footer:before,
.footer:after{
  bottom:-8px !important;
  height:158px !important;
}

/* jangan ada jarak bawah dari isi footer */
.footer-grid,
.footer-about,
.footer-copy{
  margin-bottom:0 !important;
  padding-bottom:0 !important;
}

/* ===== FOOTER V8.11 — final remove bottom hairline ===== */

.footer{
  margin-bottom:-2px !important;
  padding-bottom:2px !important;
  border-bottom:0 !important;
  box-shadow:none !important;
}

/* tutup garis bawah dengan overlay navy */
.footer::marker{
  display:none !important;
}

.footer:before,
.footer:after{
  bottom:-14px !important;
  height:166px !important;
}

/* tambahkan cover tipis di bawah footer */
.footer .footer-grid:after{
  content:"";
  position:absolute;
  left:-40px;
  right:-40px;
  bottom:-18px;
  height:18px;
  background:#071936;
  z-index:-1;
}

/* ===== FOOTER V8.12 — rollback v8.11 and keep batik down ===== */

/* batalkan efek v8.11 yang bikin footer naik */
.footer{
  margin-bottom:0 !important;
  padding-bottom:0 !important;
  border-bottom:0 !important;
  box-shadow:0 -8px 22px rgba(7,25,54,.08) !important;
  overflow:hidden !important;
}

/* matikan cover tambahan dari v8.11 */
.footer .footer-grid:after{
  display:none !important;
  content:none !important;
}

/* turunkan lagi motif supaya nempel bawah */
.footer:before,
.footer:after{
  bottom:-6px !important;
  width:360px !important;
  height:150px !important;
  background-size:100% 100% !important;
}

/* kiri kanan tetap nempel */
.footer:before{
  left:-132px !important;
  background-position:left bottom !important;
}

.footer:after{
  right:-132px !important;
  background-position:right bottom !important;
}

/* brand tetap aman */
.footer-about{
  padding-left:220px !important;
}

/* ===== FOOTER V8.13 — hide bottom hairline only ===== */

.footer{
  border-bottom:2px solid #071936 !important;
}

/* ===== FOOTER V8.14 — samakan batik kiri & kanan ===== */

/* pakai sumber gambar yang sama */
.footer:before,
.footer:after{
  width:360px !important;
  height:150px !important;
  bottom:-6px !important;
  background-image:url('../img/footer_batik_left.png') !important;
  background-repeat:no-repeat !important;
  background-size:100% 100% !important;
}

/* kiri normal */
.footer:before{
  left:-132px !important;
  right:auto !important;
  transform:none !important;
  background-position:left bottom !important;
}

/* kanan = gambar kiri yang dibalik */
.footer:after{
  right:-132px !important;
  left:auto !important;
  transform:scaleX(-1) !important;
  transform-origin:center center !important;
  background-position:left bottom !important;
}

/* ===== FOOTER V8.15 — final footer polish ===== */

/* footer compact dan bersih */
.footer{
  width:min(1500px, calc(100% - 72px)) !important;
  margin:10px auto 0 !important;
  padding:18px 28px 0 !important;
  min-height:112px !important;
  max-height:124px !important;
  overflow:hidden !important;
  border-radius:0 0 18px 18px !important;
  border-bottom:2px solid #071936 !important;
  background:linear-gradient(135deg,#071936 0%,#082044 55%,#061327 100%) !important;
}

/* pakai motif kiri yang sama untuk kiri dan kanan */
.footer:before,
.footer:after{
  content:"" !important;
  position:absolute !important;
  bottom:-6px !important;
  width:360px !important;
  height:150px !important;
  opacity:1 !important;
  pointer-events:none !important;
  background-image:url('../img/footer_batik_left.png') !important;
  background-repeat:no-repeat !important;
  background-size:100% 100% !important;
  z-index:1 !important;
}

/* kiri normal */
.footer:before{
  left:-132px !important;
  right:auto !important;
  transform:none !important;
  background-position:left bottom !important;
}

/* kanan mirror dari gambar kiri */
.footer:after{
  right:-132px !important;
  left:auto !important;
  transform:scaleX(-1) !important;
  transform-origin:center center !important;
  background-position:left bottom !important;
}

/* konten selalu di atas batik */
.footer-grid{
  position:relative !important;
  z-index:3 !important;
}

/* brand aman dari motif kiri */
.footer-about{
  padding-left:220px !important;
}

/* social sejajar */
.socials{
  padding-left:48px !important;
}

/* kalau layar kecil, layout tetap aman */
@media(max-width:1100px){
  .footer{
    width:calc(100% - 24px) !important;
    max-height:none !important;
    border-radius:18px !important;
    padding:22px !important;
  }

  .footer-about{
    padding-left:0 !important;
  }

  .socials{
    padding-left:0 !important;
  }

  .footer:before,
  .footer:after{
    opacity:.35 !important;
  }
}

/* ===== ATHLETE PROFILE V9 — closer to mockup ===== */

/* panel atlet sedikit lebih lega */
.lower-grid > .panel.athlete-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
}

/* card atlet lebih mirip mockup */
.athlete-cards article{
  min-height:205px !important;
  max-height:208px !important;
  border-radius:13px !important;
  overflow:hidden !important;
  background:#fff !important;
}

/* gambar atlet dibuat lebih tinggi agar kepala tidak kepotong */
.ath-img{
  height:96px !important;
  background:#c91520 !important;
  border-bottom:1px solid #edf0f6 !important;
}

/* reset semua crop/zoom lama */
.ath-img img,
.ath-img.a1 img,
.ath-img.a2 img,
.ath-img.a3 img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  transform:none !important;
  display:block !important;
}

/* teks nama atlet dibuat seperti mockup */
.athlete-cards b{
  margin:10px 10px 3px !important;
  font-size:11px !important;
  line-height:1.15 !important;
  color:#071936 !important;
}

/* cabor/negara */
.athlete-cards span{
  margin:0 10px 8px !important;
  font-size:9.5px !important;
  line-height:1.2 !important;
  color:#647188 !important;
  font-weight:800 !important;
}

/* medali dibuat seperti blok bawah mockup */
.athlete-cards em{
  position:relative !important;
  display:block !important;
  margin:auto 10px 10px !important;
  padding-left:20px !important;
  color:#8a6214 !important;
  font-size:9.5px !important;
  line-height:1.18 !important;
  font-style:normal !important;
  font-weight:900 !important;
}

/* icon medali kecil di kiri teks */
.athlete-cards em:before{
  content:"★";
  position:absolute;
  left:0;
  top:0;
  width:15px;
  height:15px;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  background:#f5b932;
  color:#fff;
  font-size:8px;
  line-height:1;
}

/* khusus mobile tetap aman */
@media(max-width:1240px){
  .lower-grid > .panel.athlete-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .athlete-cards article{
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== ATHLETE PROFILE V9.1 — hide embedded text in image ===== */

/* panel atlet jangan terlalu tinggi */
.lower-grid > .panel.athlete-panel{
  height:238px !important;
  min-height:238px !important;
  max-height:238px !important;
}

/* card atlet proporsional */
.athlete-cards article{
  min-height:190px !important;
  max-height:192px !important;
  overflow:hidden !important;
}

/* area gambar dibuat crop ketat supaya teks bawaan gambar hilang */
.ath-img{
  height:78px !important;
  overflow:hidden !important;
  background:#b80f1b !important;
}

/* zoom gambar untuk buang bagian bawah yang ada teks */
.ath-img img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  transform-origin:center top !important;
  display:block !important;
}

/* crop tiap atlet */
.ath-img.a1 img{
  transform:scale(1.42) translateY(-2px) !important;
}

.ath-img.a2 img{
  transform:scale(1.42) translateY(-2px) !important;
}

.ath-img.a3 img{
  transform:scale(1.34) translateY(-1px) !important;
}

/* teks bawah dirapikan lagi */
.athlete-cards b{
  margin:9px 9px 3px !important;
  font-size:10.8px !important;
}

.athlete-cards span{
  margin:0 9px 7px !important;
  font-size:9.2px !important;
}

.athlete-cards em{
  margin:auto 9px 9px !important;
  padding-left:19px !important;
  font-size:9.2px !important;
}

/* ===== ATHLETE PROFILE V9.2 — final crop balance ===== */

/* panel tetap compact */
.lower-grid > .panel.athlete-panel{
  height:232px !important;
  min-height:232px !important;
  max-height:232px !important;
}

/* card sedikit lebih pendek */
.athlete-cards article{
  min-height:184px !important;
  max-height:186px !important;
}

/* foto dibuat sedikit lebih tinggi agar kepala aman */
.ath-img{
  height:82px !important;
}

/* crop foto lebih natural */
.ath-img.a1 img{
  transform:scale(1.30) translateY(3px) !important;
}

.ath-img.a2 img{
  transform:scale(1.30) translateY(3px) !important;
}

.ath-img.a3 img{
  transform:scale(1.24) translateY(2px) !important;
}

/* teks dibuat sedikit lebih rapat */
.athlete-cards b{
  margin:8px 9px 2px !important;
  font-size:10.6px !important;
}

.athlete-cards span{
  margin:0 9px 6px !important;
  font-size:9px !important;
}

.athlete-cards em{
  margin:auto 9px 8px !important;
  font-size:9px !important;
  line-height:1.15 !important;
}

/* ===== ATHLETE PROFILE V9.3 — remove top strip ===== */

.ath-img{
  height:82px !important;
  background:#b80f1b !important;
  overflow:hidden !important;
}

/* crop naik sedikit supaya strip merah/putih atas hilang */
.ath-img.a1 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a2 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a3 img{
  transform:scale(1.28) translateY(-2px) !important;
}

/* card tetap compact */
.lower-grid > .panel.athlete-panel{
  height:232px !important;
  min-height:232px !important;
  max-height:232px !important;
}

.athlete-cards article{
  min-height:184px !important;
  max-height:186px !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== ATHLETE PROFILE V9.3 — remove top strip ===== */

.ath-img{
  height:82px !important;
  background:#b80f1b !important;
  overflow:hidden !important;
}

/* crop naik sedikit supaya strip merah/putih atas hilang */
.ath-img.a1 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a2 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a3 img{
  transform:scale(1.28) translateY(-2px) !important;
}

/* card tetap compact */
.lower-grid > .panel.athlete-panel{
  height:232px !important;
  min-height:232px !important;
  max-height:232px !important;
}

.athlete-cards article{
  min-height:184px !important;
  max-height:186px !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== ATHLETE PROFILE V9.3 — remove top strip ===== */

.ath-img{
  height:82px !important;
  background:#b80f1b !important;
  overflow:hidden !important;
}

/* crop naik sedikit supaya strip merah/putih atas hilang */
.ath-img.a1 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a2 img{
  transform:scale(1.35) translateY(-3px) !important;
}

.ath-img.a3 img{
  transform:scale(1.28) translateY(-2px) !important;
}

/* card tetap compact */
.lower-grid > .panel.athlete-panel{
  height:232px !important;
  min-height:232px !important;
  max-height:232px !important;
}

.athlete-cards article{
  min-height:184px !important;
  max-height:186px !important;
}

/* ===== ATHLETE PROFILE V9.4 — hard crop screenshot strip ===== */

.ath-img{
  position:relative !important;
  height:82px !important;
  overflow:hidden !important;
  background:#b80f1b !important;
}

/* paksa gambar keluar ke atas, jadi strip bawaan screenshot hilang */
.ath-img img{
  position:absolute !important;
  left:0 !important;
  top:-18px !important;
  width:100% !important;
  height:112px !important;
  object-fit:cover !important;
  object-position:center top !important;
  transform:none !important;
  display:block !important;
}

/* atlet 1 dan 2 perlu crop agak kuat */
.ath-img.a1 img{
  top:-20px !important;
  height:116px !important;
}

.ath-img.a2 img{
  top:-20px !important;
  height:116px !important;
}

/* atlet 3 cukup sedikit */
.ath-img.a3 img{
  top:-14px !important;
  height:108px !important;
}

/* jaga card tetap rapi */
.athlete-cards article{
  overflow:hidden !important;
}

/* ===== ATHLETE PROFILE V9.5 — rollback hard crop, stable version ===== */

/* batalkan absolute crop v9.4 */
.ath-img{
  position:relative !important;
  height:82px !important;
  overflow:hidden !important;
  background:#b80f1b !important;
}

.ath-img img,
.ath-img.a1 img,
.ath-img.a2 img,
.ath-img.a3 img{
  position:static !important;
  left:auto !important;
  top:auto !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
}

/* balik ke crop yang lebih aman */
.ath-img.a1 img{
  transform:scale(1.30) translateY(3px) !important;
}

.ath-img.a2 img{
  transform:scale(1.30) translateY(3px) !important;
}

.ath-img.a3 img{
  transform:scale(1.24) translateY(2px) !important;
}

/* panel dan card stabil */
.lower-grid > .panel.athlete-panel{
  height:232px !important;
  min-height:232px !important;
  max-height:232px !important;
}

.athlete-cards article{
  min-height:184px !important;
  max-height:186px !important;
  overflow:hidden !important;
}

.athlete-cards b{
  margin:8px 9px 2px !important;
  font-size:10.6px !important;
}

.athlete-cards span{
  margin:0 9px 6px !important;
  font-size:9px !important;
}

.athlete-cards em{
  margin:auto 9px 8px !important;
  font-size:9px !important;
  line-height:1.15 !important;
}

/* ===== ATHLETE PROFILE V10 — clean new portrait assets ===== */

.lower-grid > .panel.athlete-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
}

.athlete-cards article{
  min-height:205px !important;
  max-height:208px !important;
  border-radius:13px !important;
  overflow:hidden !important;
  background:#fff !important;
}

.ath-img{
  position:relative !important;
  height:96px !important;
  overflow:hidden !important;
  background:#b80f1b !important;
  border-bottom:1px solid #edf0f6 !important;
}

.ath-img img,
.ath-img.a1 img,
.ath-img.a2 img,
.ath-img.a3 img{
  position:static !important;
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center 42% !important;
  transform:none !important;
  display:block !important;
}

.athlete-cards b{
  margin:10px 10px 3px !important;
  font-size:11px !important;
  line-height:1.15 !important;
}

.athlete-cards span{
  margin:0 10px 8px !important;
  font-size:9.5px !important;
  line-height:1.2 !important;
}

.athlete-cards em{
  margin:auto 10px 10px !important;
  padding-left:20px !important;
  font-size:9.5px !important;
  line-height:1.18 !important;
}

/* ===== HEADER OFFICIAL LOGO ICON ===== */

.logo-mark.official-logo{
  width:56px !important;
  height:56px !important;
  border-radius:16px !important;
  background:#fff !important;
  background-image:none !important;
  box-shadow:0 10px 22px rgba(7,25,54,.10) !important;
  border:1px solid #eef2f7 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:4px !important;
}

.logo-mark.official-logo:after{
  display:none !important;
  content:none !important;
}

.logo-mark.official-logo img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
}

/* ===== FOOTER OFFICIAL LOGO ===== */

.footer .logo-mark.footer-official-logo{
  width:44px !important;
  height:44px !important;
  border-radius:13px !important;
  background:#fff !important;
  background-image:none !important;
  box-shadow:0 8px 18px rgba(0,0,0,.16) !important;
  border:1px solid rgba(255,255,255,.22) !important;
  padding:4px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
}

.footer .logo-mark.footer-official-logo:after{
  display:none !important;
  content:none !important;
}

.footer .logo-mark.footer-official-logo img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
}

/* sedikit rapikan jarak brand footer setelah logo berubah */
.footer-brand{
  gap:11px !important;
}

/* ===== HOST CITY CARD V11 — clean city background ===== */

/* ganti background host guide agar tidak ada teks ghost */
.host-card-image{
  background-image:
    linear-gradient(90deg, rgba(7,25,54,.92) 0%, rgba(7,25,54,.68) 48%, rgba(7,25,54,.30) 100%),
    url('../img/news1.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  background-repeat:no-repeat !important;
}

/* matikan overlay lama yang bikin ghost makin kelihatan */
.host-card-image:before{
  background:
    linear-gradient(90deg,
      rgba(7,25,54,.80) 0%,
      rgba(7,25,54,.54) 48%,
      rgba(7,25,54,.18) 100%) !important;
}

/* teks host card dibuat lebih rapi */
.host-card small{
  color:#ffd766 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.35) !important;
}

.host-card h3{
  color:#fff !important;
  text-shadow:0 2px 4px rgba(0,0,0,.38) !important;
}

.host-card p{
  color:rgba(255,255,255,.90) !important;
  text-shadow:0 1px 2px rgba(0,0,0,.25) !important;
}

.host-card a{
  color:#ffd766 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.32) !important;
}

/* ===== HOST CITY CARD V11.1 — final polish ===== */

.sports-host{
  grid-template-columns:.92fr 1.08fr !important;
  gap:15px !important;
}

/* host card sedikit lebih lebar dan terang */
.host-card{
  height:158px !important;
  min-height:158px !important;
  padding:15px 16px !important;
}

.host-card-image{
  background-image:
    linear-gradient(90deg, rgba(7,25,54,.92) 0%, rgba(7,25,54,.62) 52%, rgba(7,25,54,.18) 100%),
    url('../img/news1.png') !important;
  background-position:center center !important;
}

/* teks lebih compact */
.host-card small{
  font-size:8.5px !important;
  margin-bottom:6px !important;
}

.host-card h3{
  max-width:250px !important;
  font-size:16px !important;
  line-height:1.02 !important;
  letter-spacing:-.25px !important;
}

.host-card p{
  max-width:260px !important;
  font-size:10px !important;
  line-height:1.32 !important;
  margin:7px 0 8px !important;
}

.host-card a{
  font-size:10px !important;
}

/* ===== SPONSOR V12 — premium placeholder logos ===== */

.lower-grid > .panel.sponsor-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
}

.sponsor-grid{
  display:grid !important;
  grid-template-columns:repeat(2,1fr) !important;
  gap:8px !important;
}

.sponsor-grid span{
  height:39px !important;
  border-radius:11px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  background:linear-gradient(180deg,#fff,#f8fafc) !important;
  border:1px dashed #d5deeb !important;
  color:#647188 !important;
  font-weight:900 !important;
  text-align:left !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.8) !important;
}

.sponsor-grid span i{
  width:20px !important;
  height:20px !important;
  border-radius:999px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:#edf3fb !important;
  color:#0b2a57 !important;
  font-size:10px !important;
  font-style:normal !important;
  flex:0 0 20px !important;
}

.sponsor-grid span b{
  display:block !important;
  font-size:8.7px !important;
  line-height:1.05 !important;
  text-transform:uppercase !important;
  letter-spacing:.15px !important;
}

/* hover kecil biar terasa hidup */
.sponsor-grid span:hover{
  border-color:#c3cfdf !important;
  background:#fff !important;
}

/* ===== SPONSOR V13 — mockup style clickable cards ===== */

.lower-grid > .panel.sponsor-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

.sponsor-panel .panel-head{
  margin-bottom:11px !important;
}

.sponsor-card-grid{
  display:grid !important;
  grid-template-columns:repeat(4,1fr) !important;
  gap:9px !important;
}

.sponsor-card-grid .sponsor-card{
  height:76px !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #dfe6ef !important;
  box-shadow:0 5px 12px rgba(7,25,54,.055) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  text-decoration:none !important;
  color:#071936 !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.sponsor-card-grid .sponsor-card:hover{
  transform:translateY(-2px) !important;
  border-color:#cdd7e5 !important;
  box-shadow:0 9px 18px rgba(7,25,54,.10) !important;
}

.sponsor-card-grid .sponsor-card b{
  display:block !important;
  font-size:8.5px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:.25px !important;
}

/* generic logo icon */
.sponsor-card-grid .sp{
  width:30px !important;
  height:30px !important;
  display:block !important;
  position:relative !important;
  background:#0b2348 !important;
  flex:0 0 30px !important;
}

/* 1: triangular mark */
.sp-1{
  clip-path:polygon(50% 0, 96% 84%, 68% 84%, 50% 54%, 32% 84%, 4% 84%) !important;
}

/* 2: shield split */
.sp-2{
  clip-path:polygon(14% 8%, 50% 0, 86% 8%, 80% 66%, 50% 100%, 20% 66%) !important;
}
.sp-2:after{
  content:"";
  position:absolute;
  inset:8px 11px;
  background:#fff;
  transform:rotate(45deg);
}

/* 3: wings */
.sp-3{
  background:transparent !important;
}
.sp-3:before,
.sp-3:after{
  content:"";
  position:absolute;
  top:7px;
  width:19px;
  height:16px;
  background:#0b2348;
}
.sp-3:before{
  left:0;
  clip-path:polygon(0 0,100% 40%,0 100%,18% 50%);
}
.sp-3:after{
  right:0;
  clip-path:polygon(100% 0,0 40%,100% 100%,82% 50%);
}

/* 4: hex lightning */
.sp-4{
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%) !important;
}
.sp-4:after{
  content:"";
  position:absolute;
  inset:7px 11px;
  background:#fff;
  clip-path:polygon(60% 0,100% 0,54% 48%,90% 48%,30% 100%,46% 58%,10% 58%);
}

/* 5: wing star */
.sp-5{
  background:transparent !important;
}
.sp-5:before,
.sp-5:after{
  content:"";
  position:absolute;
  top:6px;
  width:22px;
  height:17px;
  background:#0b2348;
}
.sp-5:before{
  left:-1px;
  clip-path:polygon(0 0,100% 50%,0 100%,15% 50%);
}
.sp-5:after{
  right:-1px;
  clip-path:polygon(100% 0,0 50%,100% 100%,85% 50%);
}
.sp-5{
  box-shadow:inset 0 -12px 0 transparent;
}

/* 6: swirl */
.sp-6{
  border-radius:50% !important;
  background:
    radial-gradient(circle at center, #fff 0 34%, transparent 35%),
    conic-gradient(from 0deg,#0b2348 0 22%, transparent 22% 30%, #0b2348 30% 52%, transparent 52% 60%, #0b2348 60% 82%, transparent 82% 90%, #0b2348 90% 100%) !important;
}

/* 7: diamond knot */
.sp-7{
  transform:rotate(45deg) !important;
  background:#0b2348 !important;
}
.sp-7:after{
  content:"";
  position:absolute;
  inset:8px;
  border:4px solid #fff;
}

/* 8: lotus */
.sp-8{
  background:transparent !important;
}
.sp-8:before{
  content:"";
  position:absolute;
  left:3px;
  top:2px;
  width:24px;
  height:26px;
  background:#0b2348;
  clip-path:polygon(50% 0,64% 35%,100% 28%,73% 62%,88% 100%,50% 76%,12% 100%,27% 62%,0 28%,36% 35%);
}

/* responsive safety */
@media(max-width:1240px){
  .lower-grid > .panel.sponsor-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .sponsor-card-grid{
    grid-template-columns:repeat(2,1fr) !important;
  }
}

/* ===== SPONSOR V13.1 — compact mockup card fix ===== */

/* panel sponsor tetap cukup tinggi */
.lower-grid > .panel.sponsor-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

/* paksa jadi 4 kolom seperti grid logo, bukan 2 kolom besar */
.sponsor-panel .sponsor-card-grid{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:8px !important;
}

/* card sponsor dibuat kotak compact */
.sponsor-panel .sponsor-card-grid .sponsor-card{
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  border-radius:12px !important;
  padding:8px 4px !important;
  background:#fff !important;
  border:1px solid #dfe6ef !important;
  box-shadow:0 5px 12px rgba(7,25,54,.055) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
}

/* icon logo lebih kecil dan rapi */
.sponsor-panel .sponsor-card-grid .sp{
  width:26px !important;
  height:26px !important;
  flex:0 0 26px !important;
  background:#0b2348 !important;
}

/* label */
.sponsor-panel .sponsor-card-grid .sponsor-card b{
  font-size:8px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:.2px !important;
}

/* override media lama yang memaksa 2 kolom */
@media(max-width:1240px){
  .sponsor-panel .sponsor-card-grid{
    grid-template-columns:repeat(4, 1fr) !important;
  }
}

/* baru di layar HP kecil turun jadi 2 kolom */
@media(max-width:640px){
  .sponsor-panel .sponsor-card-grid{
    grid-template-columns:repeat(2, 1fr) !important;
  }
}

/* ===== SPONSOR CLEAN FINAL V14 ===== */

/* panel sponsor dibuat mirip mockup kecil */
.lower-grid > .sponsor-clean-panel.panel,
.lower-grid > .panel.sponsor-panel.sponsor-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
  border-radius:18px !important;
}

/* heading */
.lower-grid > .sponsor-clean-panel .panel-head{
  margin:0 0 12px !important;
}

.lower-grid > .sponsor-clean-panel .panel-head h2{
  font-size:17px !important;
  line-height:1.05 !important;
  letter-spacing:-.35px !important;
}

/* grid 4 kolom x 2 baris, paksa menang dari CSS lama */
.lower-grid > .sponsor-clean-panel .sponsor-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  grid-template-rows:repeat(2, 72px) !important;
  gap:9px !important;
  width:100% !important;
  height:auto !important;
}

/* card sponsor seperti mockup */
.lower-grid > .sponsor-clean-panel .sponsor-clean-grid > a.sponsor-clean-card{
  height:72px !important;
  min-height:72px !important;
  max-height:72px !important;
  width:100% !important;
  padding:8px 4px !important;
  border-radius:12px !important;
  border:1px solid #dfe6ef !important;
  background:#fff !important;
  box-shadow:0 5px 12px rgba(7,25,54,.055) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  text-decoration:none !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}

/* label */
.lower-grid > .sponsor-clean-panel .sponsor-clean-card b{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:.25px !important;
  color:#071936 !important;
}

/* logo icon dasar */
.lower-grid > .sponsor-clean-panel .sp-logo{
  position:relative !important;
  display:block !important;
  width:28px !important;
  height:28px !important;
  flex:0 0 28px !important;
  margin:0 !important;
  padding:0 !important;
  background:#0b2348 !important;
}

/* 1 */
.sp-logo-1{
  clip-path:polygon(50% 0,92% 90%,68% 90%,50% 50%,32% 90%,8% 90%) !important;
}

/* 2 */
.sp-logo-2{
  clip-path:polygon(15% 8%,50% 0,85% 8%,78% 65%,50% 100%,22% 65%) !important;
}
.sp-logo-2:after{
  content:"";
  position:absolute;
  inset:8px 11px;
  background:#fff;
  transform:rotate(45deg);
}

/* 3 wings */
.sp-logo-3{
  background:transparent !important;
}
.sp-logo-3:before,
.sp-logo-3:after{
  content:"";
  position:absolute;
  top:7px;
  width:19px;
  height:15px;
  background:#0b2348;
}
.sp-logo-3:before{
  left:0;
  clip-path:polygon(0 0,100% 48%,0 100%,20% 50%);
}
.sp-logo-3:after{
  right:0;
  clip-path:polygon(100% 0,0 48%,100% 100%,80% 50%);
}

/* 4 hex lightning */
.sp-logo-4{
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%) !important;
}
.sp-logo-4:after{
  content:"";
  position:absolute;
  inset:7px 11px;
  background:#fff;
  clip-path:polygon(60% 0,100% 0,55% 48%,88% 48%,30% 100%,45% 58%,10% 58%);
}

/* 5 swirl */
.sp-logo-5{
  border-radius:50% !important;
  background:
    radial-gradient(circle at center, #fff 0 34%, transparent 35%),
    conic-gradient(from 0deg,#0b2348 0 22%, transparent 22% 30%, #0b2348 30% 52%, transparent 52% 60%, #0b2348 60% 82%, transparent 82% 90%, #0b2348 90% 100%) !important;
}

/* 6 diamond */
.sp-logo-6{
  transform:rotate(45deg) !important;
}
.sp-logo-6:after{
  content:"";
  position:absolute;
  inset:8px;
  border:4px solid #fff;
}

/* 7 compass */
.sp-logo-7{
  border-radius:50% !important;
  background:
    radial-gradient(circle at center,#0b2348 0 28%, transparent 29%),
    conic-gradient(#0b2348 0 12%, transparent 12% 25%, #0b2348 25% 37%, transparent 37% 50%, #0b2348 50% 62%, transparent 62% 75%, #0b2348 75% 87%, transparent 87%) !important;
}

/* 8 lotus */
.sp-logo-8{
  background:transparent !important;
}
.sp-logo-8:before{
  content:"";
  position:absolute;
  left:3px;
  top:2px;
  width:24px;
  height:26px;
  background:#0b2348;
  clip-path:polygon(50% 0,64% 35%,100% 28%,73% 62%,88% 100%,50% 76%,12% 100%,27% 62%,0 28%,36% 35%);
}

/* responsif */
@media(max-width:1240px){
  .lower-grid > .sponsor-clean-panel .sponsor-clean-grid{
    grid-template-columns:repeat(4, 1fr) !important;
  }
}

@media(max-width:640px){
  .lower-grid > .sponsor-clean-panel.panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .lower-grid > .sponsor-clean-panel .sponsor-clean-grid{
    grid-template-columns:repeat(2, 1fr) !important;
    grid-template-rows:auto !important;
  }
}

/* ===== SPONSOR V14.2 — refine plain icons ===== */

/* icon 3: leaf/wing */
.sp-logo-3{
  background:transparent !important;
}
.sp-logo-3:before,
.sp-logo-3:after{
  content:"";
  position:absolute;
  top:7px;
  width:20px;
  height:16px;
  background:#0b2348;
}
.sp-logo-3:before{
  left:0;
  clip-path:polygon(0 0,100% 45%,0 100%,18% 50%);
}
.sp-logo-3:after{
  right:0;
  clip-path:polygon(100% 0,0 45%,100% 100%,82% 50%);
}

/* icon 5: swirl lebih jelas */
.sp-logo-5{
  border-radius:50% !important;
  background:
    radial-gradient(circle at center, #fff 0 34%, transparent 35%),
    conic-gradient(from 20deg,
      #0b2348 0 24%,
      transparent 24% 32%,
      #0b2348 32% 56%,
      transparent 56% 64%,
      #0b2348 64% 88%,
      transparent 88% 100%) !important;
}

/* icon 7: compass/star */
.sp-logo-7{
  background:transparent !important;
  border-radius:50% !important;
}
.sp-logo-7:before{
  content:"";
  position:absolute;
  inset:2px;
  border-radius:50%;
  border:5px solid #0b2348;
}
.sp-logo-7:after{
  content:"";
  position:absolute;
  inset:7px;
  background:#0b2348;
  clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);
}

/* icon 8: lotus/flower, bukan kotak */
.sp-logo-8{
  background:transparent !important;
}
.sp-logo-8:before{
  content:"";
  position:absolute;
  left:2px;
  top:1px;
  width:24px;
  height:27px;
  background:#0b2348;
  clip-path:polygon(
    50% 0,
    63% 34%,
    100% 27%,
    74% 58%,
    88% 100%,
    50% 76%,
    12% 100%,
    26% 58%,
    0 27%,
    37% 34%
  );
}

/* sedikit kecilkan card agar makin mirip mockup */
section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card{
  height:70px !important;
  min-height:70px !important;
  max-height:70px !important;
}

/* ===== SPONSOR V15 — inline SVG logos final ===== */

section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:9px !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card{
  height:70px !important;
  min-height:70px !important;
  max-height:70px !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #dfe6ef !important;
  box-shadow:0 5px 12px rgba(7,25,54,.055) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:7px !important;
  text-decoration:none !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-svg{
  width:30px !important;
  height:30px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  flex:0 0 30px !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-svg svg{
  width:30px !important;
  height:30px !important;
  display:block !important;
  fill:#0b2348 !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card b{
  font-size:8px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:.25px !important;
  color:#071936 !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 9px 18px rgba(7,25,54,.10) !important;
}

/* ===== SPONSOR V16 — more link heading ===== */

section.lower-grid .panel.sponsor-clean-panel .sponsor-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
  margin:0 0 12px !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-head h2{
  margin:0 !important;
  font-size:17px !important;
  line-height:1.05 !important;
  letter-spacing:-.35px !important;
  white-space:nowrap !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-more{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  flex:0 0 auto !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#d71920 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

section.lower-grid .panel.sponsor-clean-panel .sponsor-more:hover{
  text-decoration:underline !important;
}

/* ===== ATHLETE V17 — clickable cards ===== */

.athlete-cards a.athlete-link-card,
.athlete-cards .athlete-link-card{
  display:block !important;
  text-decoration:none !important;
  color:inherit !important;
  cursor:pointer !important;
}

.athlete-cards a.athlete-link-card h3,
.athlete-cards a.athlete-link-card p,
.athlete-cards a.athlete-link-card .ath-badge{
  text-decoration:none !important;
}

.athlete-cards a.athlete-link-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 20px rgba(7,25,54,.12) !important;
}

.athlete-cards a.athlete-link-card:hover h3{
  color:#d71920 !important;
}

/* ===== ATHLETE CLEAN CLICKABLE FINAL V18 ===== */

.lower-grid > .athlete-clean-panel .athlete-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
  display:flex !important;
  flex-direction:column !important;
  position:relative !important;
  z-index:3 !important;
  pointer-events:auto !important;
  text-decoration:none !important;
  color:inherit !important;
  cursor:pointer !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card *{
  pointer-events:none !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 22px rgba(7,25,54,.14) !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover h3{
  color:#d71920 !important;
}

.lower-grid > .athlete-clean-panel .panel-head a.section-more{
  position:relative !important;
  z-index:5 !important;
  pointer-events:auto !important;
}

/* ===== ATHLETE V18.1 — restore clickable card layout ===== */

.lower-grid > .athlete-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

.lower-grid > .athlete-clean-panel .panel-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  margin:0 0 12px !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  height:200px !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
  height:200px !important;
  min-height:200px !important;
  max-height:200px !important;
  display:block !important;
  position:relative !important;
  overflow:hidden !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #dde6f0 !important;
  box-shadow:0 5px 12px rgba(7,25,54,.06) !important;
  text-decoration:none !important;
  color:#071936 !important;
  cursor:pointer !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card .ath-img{
  height:92px !important;
  width:100% !important;
  overflow:hidden !important;
  border-radius:12px 12px 0 0 !important;
  background:#b80010 !important;
  display:block !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card .ath-img img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card h3{
  margin:10px 12px 2px !important;
  font-size:13px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card p{
  margin:0 12px !important;
  font-size:11px !important;
  line-height:1.12 !important;
  font-weight:800 !important;
  color:#5d6b82 !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card .ath-badge{
  position:absolute !important;
  left:12px !important;
  right:10px !important;
  bottom:10px !important;
  margin:0 !important;
  font-size:10px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  color:#9a6100 !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 22px rgba(7,25,54,.14) !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover h3{
  color:#d71920 !important;
}

/* ===== ATHLETE V18.2 — clickable but compact like original ===== */

.lower-grid > .athlete-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 10px !important;
  overflow:hidden !important;
}

.lower-grid > .athlete-clean-panel .panel-head{
  height:24px !important;
  margin:0 0 10px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

.lower-grid > .athlete-clean-panel .panel-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
}

.lower-grid > .athlete-clean-panel .panel-head .section-more{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#d71920 !important;
  text-decoration:none !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  height:200px !important;
  overflow:hidden !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
  height:200px !important;
  min-height:200px !important;
  max-height:200px !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #dde6f0 !important;
  box-shadow:0 5px 12px rgba(7,25,54,.06) !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  text-decoration:none !important;
  color:#071936 !important;
  cursor:pointer !important;
  position:relative !important;
}

/* foto dibuat lebih pendek supaya text dan badge tidak numpuk */
.lower-grid > .athlete-clean-panel .athlete-link-card .ath-img{
  height:82px !important;
  min-height:82px !important;
  max-height:82px !important;
  width:100% !important;
  overflow:hidden !important;
  border-radius:12px 12px 0 0 !important;
  background:#b80010 !important;
  display:block !important;
  flex:0 0 82px !important;
}

.lower-grid > .athlete-clean-panel .athlete-link-card .ath-img img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
}

/* nama atlet */
.lower-grid > .athlete-clean-panel .athlete-link-card h3{
  margin:9px 10px 2px !important;
  font-size:12px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
}

/* cabang/negara */
.lower-grid > .athlete-clean-panel .athlete-link-card p{
  margin:0 10px !important;
  font-size:10px !important;
  line-height:1.08 !important;
  font-weight:800 !important;
  color:#5d6b82 !important;
}

/* badge dibuat kecil dan turun pas */
.lower-grid > .athlete-clean-panel .athlete-link-card .ath-badge{
  position:absolute !important;
  left:10px !important;
  right:8px !important;
  bottom:10px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:9px !important;
  line-height:1.03 !important;
  font-weight:950 !important;
  color:#9a6100 !important;
  letter-spacing:-.1px !important;
}

/* hover tetap clickable */
.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 22px rgba(7,25,54,.14) !important;
}

.lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card:hover h3{
  color:#d71920 !important;
}

/* ===== SPORTS V19 — clickable separated cards ===== */

.lower-grid > .sports-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

.lower-grid > .sports-clean-panel .sports-head{
  height:24px !important;
  margin:0 0 10px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

.lower-grid > .sports-clean-panel .sports-head h2{
  margin:0 !important;
  font-size:18px !important;
  line-height:1 !important;
}

.lower-grid > .sports-clean-panel .sports-head .section-more{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#d71920 !important;
  text-decoration:none !important;
}

.lower-grid > .sports-clean-panel .sports-clean-wrap{
  display:grid !important;
  grid-template-columns:300px 1fr !important;
  gap:18px !important;
  align-items:start !important;
  height:200px !important;
}

.lower-grid > .sports-clean-panel .sports-list h3{
  margin:0 0 10px !important;
  font-size:11px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#071936 !important;
}

.lower-grid > .sports-clean-panel .sport-link-grid{
  display:grid !important;
  grid-template-columns:repeat(4, 1fr) !important;
  gap:9px !important;
}

.lower-grid > .sports-clean-panel .sport-link-card{
  height:56px !important;
  border-radius:12px !important;
  background:#f8fbff !important;
  border:1px solid #dfe6ef !important;
  box-shadow:0 4px 10px rgba(7,25,54,.035) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  text-decoration:none !important;
  color:#071936 !important;
  cursor:pointer !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.lower-grid > .sports-clean-panel .sport-link-card span{
  display:block !important;
  font-size:16px !important;
  line-height:1 !important;
}

.lower-grid > .sports-clean-panel .sport-link-card b{
  display:block !important;
  font-size:9px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  text-align:center !important;
  color:#071936 !important;
}

.lower-grid > .sports-clean-panel .sport-link-card:hover{
  transform:translateY(-2px) !important;
  border-color:#cdd7e5 !important;
  box-shadow:0 9px 18px rgba(7,25,54,.10) !important;
}

/* Host city card juga jadi link sendiri */
.lower-grid > .sports-clean-panel .host-link-card{
  height:164px !important;
  border-radius:16px !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  text-decoration:none !important;
  color:#fff !important;
  cursor:pointer !important;
  position:relative !important;
  padding:0 22px !important;
  background-image:
    linear-gradient(90deg, rgba(7,25,54,.94) 0%, rgba(7,25,54,.72) 58%, rgba(7,25,54,.25) 100%),
    url('../img/news1.png') !important;
  background-size:cover !important;
  background-position:center center !important;
  box-shadow:0 8px 18px rgba(7,25,54,.11) !important;
  transition:transform .18s ease, box-shadow .18s ease !important;
}

.lower-grid > .sports-clean-panel .host-link-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px rgba(7,25,54,.16) !important;
}

.lower-grid > .sports-clean-panel .host-link-card small{
  display:block !important;
  margin-bottom:8px !important;
  font-size:9px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#ffd21e !important;
}

.lower-grid > .sports-clean-panel .host-link-card h3{
  margin:0 0 8px !important;
  max-width:320px !important;
  font-size:18px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  color:#fff !important;
}

.lower-grid > .sports-clean-panel .host-link-card p{
  margin:0 0 12px !important;
  max-width:320px !important;
  font-size:11px !important;
  line-height:1.25 !important;
  font-weight:800 !important;
  color:#fff !important;
}

.lower-grid > .sports-clean-panel .host-link-card strong{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:950 !important;
  color:#ffd21e !important;
}

/* mobile safety */
@media(max-width:900px){
  .lower-grid > .sports-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .lower-grid > .sports-clean-panel .sports-clean-wrap{
    grid-template-columns:1fr !important;
    height:auto !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(4, 1fr) !important;
  }
}

@media(max-width:560px){
  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(2, 1fr) !important;
  }
}

/* ===== NEWS V20 — clickable separated cards ===== */

.main-grid > .news-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-head{
  height:24px !important;
  margin:0 0 10px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

.main-grid > .news-clean-panel .news-head h2{
  margin:0 !important;
  font-size:18px !important;
  line-height:1 !important;
  color:#071936 !important;
}

.main-grid > .news-clean-panel .news-head .section-more{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#d71920 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

.main-grid > .news-clean-panel .news-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  height:200px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-link-card{
  height:200px !important;
  min-height:200px !important;
  max-height:200px !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
  border-radius:12px !important;
  background:#fff !important;
  border:1px solid #dde6f0 !important;
  box-shadow:0 5px 12px rgba(7,25,54,.06) !important;
  text-decoration:none !important;
  color:#071936 !important;
  cursor:pointer !important;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.main-grid > .news-clean-panel .news-link-card:hover{
  transform:translateY(-2px) !important;
  border-color:#cdd7e5 !important;
  box-shadow:0 10px 22px rgba(7,25,54,.14) !important;
}

.main-grid > .news-clean-panel .news-thumb{
  height:82px !important;
  min-height:82px !important;
  max-height:82px !important;
  width:100% !important;
  overflow:hidden !important;
  border-radius:12px 12px 0 0 !important;
  background:#dbe5f1 !important;
  flex:0 0 82px !important;
}

.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 10px !important;
  display:block !important;
}

.main-grid > .news-clean-panel .news-body span{
  display:inline-flex !important;
  margin:0 0 5px !important;
  padding:3px 7px !important;
  border-radius:999px !important;
  background:#fff3d5 !important;
  color:#9a6100 !important;
  font-size:8px !important;
  line-height:1 !important;
  font-weight:950 !important;
  text-transform:uppercase !important;
  letter-spacing:.2px !important;
}

.main-grid > .news-clean-panel .news-body h3{
  margin:0 0 5px !important;
  font-size:12px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
}

.main-grid > .news-clean-panel .news-body p{
  margin:0 !important;
  font-size:9.5px !important;
  line-height:1.25 !important;
  font-weight:750 !important;
  color:#5d6b82 !important;
}

.main-grid > .news-clean-panel .news-link-card:hover h3{
  color:#d71920 !important;
}

/* mobile safety */
@media(max-width:900px){
  .main-grid > .news-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .main-grid > .news-clean-panel .news-clean-grid{
    grid-template-columns:1fr !important;
    height:auto !important;
  }

  .main-grid > .news-clean-panel .news-link-card{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }
}

/* ===== NEWS V20.1 — image path fixed + compact text ===== */

.main-grid > .news-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 10px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-clean-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  height:200px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-link-card{
  height:200px !important;
  min-height:200px !important;
  max-height:200px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-thumb{
  height:82px !important;
  min-height:82px !important;
  max-height:82px !important;
  background:#dbe5f1 !important;
}

.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

.main-grid > .news-clean-panel .news-body h3{
  font-size:11px !important;
  line-height:1.08 !important;
  margin:0 0 5px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-body p{
  font-size:9px !important;
  line-height:1.2 !important;
  display:-webkit-box !important;
  -webkit-line-clamp:2 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

/* ===== NEWS V20.2 — homepage news title only ===== */

.main-grid > .news-clean-panel .news-link-card{
  height:200px !important;
  min-height:200px !important;
  max-height:200px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-thumb{
  height:105px !important;
  min-height:105px !important;
  max-height:105px !important;
  flex:0 0 105px !important;
}

.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

.main-grid > .news-clean-panel .news-body{
  padding:10px 11px 12px !important;
}

.main-grid > .news-clean-panel .news-body span{
  margin:0 0 7px !important;
  padding:3px 8px !important;
  font-size:8px !important;
  line-height:1 !important;
}

.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  font-size:12px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  color:#071936 !important;

  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

/* homepage cukup judul, excerpt disembunyikan */
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* ===== NEWS V20.3 — final compact title only ===== */

.main-grid > .news-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-clean-grid{
  height:188px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  overflow:hidden !important;
  align-items:start !important;
}

.main-grid > .news-clean-panel .news-link-card{
  height:188px !important;
  min-height:188px !important;
  max-height:188px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* gambar diturunkan tingginya supaya judul naik */
.main-grid > .news-clean-panel .news-thumb{
  height:96px !important;
  min-height:96px !important;
  max-height:96px !important;
  flex:0 0 96px !important;
}

.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

/* body lebih rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 10px !important;
}

/* homepage berita cukup judul saja */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:12px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;

  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-link-card:hover h3{
  color:#d71920 !important;
}

/* ===== MAIN CARD HEADING ALIGN FINAL V21 ===== */

/* Samakan semua heading card utama */
.main-grid > .panel .panel-head,
.main-grid > .panel .news-head{
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  margin:0 0 10px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

.main-grid > .panel .panel-head h2,
.main-grid > .panel .news-head h2,
.main-grid > .news-clean-panel .news-head h2{
  margin:0 !important;
  padding:0 !important;
  font-size:18px !important;
  line-height:1 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* Samakan link kanan */
.main-grid > .panel .section-more,
.main-grid > .news-clean-panel .news-head .section-more{
  font-size:11px !important;
  line-height:1 !important;
  font-weight:900 !important;
  color:#d71920 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}

/* ===== NEWS CARD COMPACT FINAL V21 ===== */

.main-grid > .news-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-clean-grid{
  height:178px !important;
  max-height:178px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  overflow:hidden !important;
  align-items:start !important;
}

.main-grid > .news-clean-panel .news-link-card{
  height:178px !important;
  min-height:178px !important;
  max-height:178px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* gambar sedang, biar judul tidak turun */
.main-grid > .news-clean-panel .news-thumb{
  height:92px !important;
  min-height:92px !important;
  max-height:92px !important;
  flex:0 0 92px !important;
}

.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center center !important;
  display:block !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* Homepage berita: sembunyikan kategori dan excerpt */
.main-grid > .news-clean-panel .news-link-card .news-body span,
.main-grid > .news-clean-panel .news-link-card .news-body p{
  display:none !important;
  visibility:hidden !important;
  height:0 !important;
  max-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
}

/* judul saja */
.main-grid > .news-clean-panel .news-link-card .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:12px !important;
  line-height:1.12 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;

  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

.main-grid > .news-clean-panel .news-link-card:hover h3{
  color:#d71920 !important;
}

/* ===== MAIN GRID V22 — align news panel height with schedule & medal ===== */

/* samakan tinggi semua panel atas */
.main-grid > .panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

/* samakan posisi heading */
.main-grid > .panel .panel-head,
.main-grid > .news-clean-panel .news-head{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* heading font sama */
.main-grid > .panel .panel-head h2,
.main-grid > .news-clean-panel .news-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* khusus berita: isi dinaikkan dan dipendekkan */
.main-grid > .news-clean-panel .news-clean-grid{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* card berita jangan terlalu tinggi */
.main-grid > .news-clean-panel .news-link-card{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* thumbnail dipendekkan */
.main-grid > .news-clean-panel .news-thumb{
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  flex:0 0 86px !important;
  overflow:hidden !important;
}

/* crop gambar */
.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center top !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* homepage berita hanya judul */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* judul dibuat cukup 4 baris */
.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== MAIN GRID V22 — align news panel height with schedule & medal ===== */

/* samakan tinggi semua panel atas */
.main-grid > .panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

/* samakan posisi heading */
.main-grid > .panel .panel-head,
.main-grid > .news-clean-panel .news-head{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* heading font sama */
.main-grid > .panel .panel-head h2,
.main-grid > .news-clean-panel .news-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* khusus berita: isi dinaikkan dan dipendekkan */
.main-grid > .news-clean-panel .news-clean-grid{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* card berita jangan terlalu tinggi */
.main-grid > .news-clean-panel .news-link-card{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* thumbnail dipendekkan */
.main-grid > .news-clean-panel .news-thumb{
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  flex:0 0 86px !important;
  overflow:hidden !important;
}

/* crop gambar */
.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center top !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* homepage berita hanya judul */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* judul dibuat cukup 4 baris */
.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== MAIN GRID V22 — align news panel height with schedule & medal ===== */

/* samakan tinggi semua panel atas */
.main-grid > .panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

/* samakan posisi heading */
.main-grid > .panel .panel-head,
.main-grid > .news-clean-panel .news-head{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* heading font sama */
.main-grid > .panel .panel-head h2,
.main-grid > .news-clean-panel .news-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* khusus berita: isi dinaikkan dan dipendekkan */
.main-grid > .news-clean-panel .news-clean-grid{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* card berita jangan terlalu tinggi */
.main-grid > .news-clean-panel .news-link-card{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* thumbnail dipendekkan */
.main-grid > .news-clean-panel .news-thumb{
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  flex:0 0 86px !important;
  overflow:hidden !important;
}

/* crop gambar */
.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center top !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* homepage berita hanya judul */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* judul dibuat cukup 4 baris */
.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}
EOFcd /www/wwwroot/games.infobssn.com

cat >> assets/css/style.css <<'EOF'

/* ===== MAIN GRID V22 — align news panel height with schedule & medal ===== */

/* samakan tinggi semua panel atas */
.main-grid > .panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

/* samakan posisi heading */
.main-grid > .panel .panel-head,
.main-grid > .news-clean-panel .news-head{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* heading font sama */
.main-grid > .panel .panel-head h2,
.main-grid > .news-clean-panel .news-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* khusus berita: isi dinaikkan dan dipendekkan */
.main-grid > .news-clean-panel .news-clean-grid{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* card berita jangan terlalu tinggi */
.main-grid > .news-clean-panel .news-link-card{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* thumbnail dipendekkan */
.main-grid > .news-clean-panel .news-thumb{
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  flex:0 0 86px !important;
  overflow:hidden !important;
}

/* crop gambar */
.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center top !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* homepage berita hanya judul */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* judul dibuat cukup 4 baris */
.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

/* ===== MAIN GRID V22 — align news panel height with schedule & medal ===== */

/* samakan tinggi semua panel atas */
.main-grid > .panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px 12px !important;
  overflow:hidden !important;
}

/* samakan posisi heading */
.main-grid > .panel .panel-head,
.main-grid > .news-clean-panel .news-head{
  height:26px !important;
  min-height:26px !important;
  max-height:26px !important;
  margin:0 0 8px !important;
  padding:0 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
}

/* heading font sama */
.main-grid > .panel .panel-head h2,
.main-grid > .news-clean-panel .news-head h2{
  font-size:18px !important;
  line-height:1 !important;
  margin:0 !important;
  padding:0 !important;
  font-weight:950 !important;
  letter-spacing:-.35px !important;
  color:#071936 !important;
}

/* khusus berita: isi dinaikkan dan dipendekkan */
.main-grid > .news-clean-panel .news-clean-grid{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:start !important;
  overflow:hidden !important;
}

/* card berita jangan terlalu tinggi */
.main-grid > .news-clean-panel .news-link-card{
  height:176px !important;
  min-height:176px !important;
  max-height:176px !important;
  overflow:hidden !important;
  border-radius:12px !important;
}

/* thumbnail dipendekkan */
.main-grid > .news-clean-panel .news-thumb{
  height:86px !important;
  min-height:86px !important;
  max-height:86px !important;
  flex:0 0 86px !important;
  overflow:hidden !important;
}

/* crop gambar */
.main-grid > .news-clean-panel .news-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  object-position:center top !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center top !important;
}

/* body rapat */
.main-grid > .news-clean-panel .news-body{
  padding:9px 10px 8px !important;
}

/* homepage berita hanya judul */
.main-grid > .news-clean-panel .news-body span,
.main-grid > .news-clean-panel .news-body p{
  display:none !important;
}

/* judul dibuat cukup 4 baris */
.main-grid > .news-clean-panel .news-body h3{
  margin:0 !important;
  padding:0 !important;
  font-size:11.5px !important;
  line-height:1.1 !important;
  font-weight:950 !important;
  color:#071936 !important;
  letter-spacing:-.15px !important;
  display:-webkit-box !important;
  -webkit-line-clamp:4 !important;
  -webkit-box-orient:vertical !important;
  overflow:hidden !important;
}

/* ===== MOBILE RESPONSIVE FINAL CHECK V1 ===== */

@media(max-width:900px){

  body{
    overflow-x:hidden !important;
  }

  .wrap,
  .container{
    width:calc(100% - 28px) !important;
    max-width:100% !important;
  }

  /* header */
  .topbar{
    font-size:11px !important;
    line-height:1.3 !important;
    padding:6px 12px !important;
    height:auto !important;
    text-align:center !important;
  }

  .nav{
    height:auto !important;
    padding:10px 0 !important;
  }

  .nav .wrap{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
  }

  .brand-text b{
    font-size:15px !important;
    line-height:1.05 !important;
  }

  .brand-text small{
    font-size:10px !important;
  }

  .menu{
    display:none !important;
  }

  .nav-actions{
    margin-left:auto !important;
    gap:7px !important;
  }

  .lang-pill{
    height:34px !important;
    padding:0 11px !important;
    font-size:11px !important;
  }

  .search-btn{
    width:34px !important;
    height:34px !important;
  }

  /* hero */
  .hero-section{
    padding:14px 0 0 !important;
  }

  .hero-card{
    height:auto !important;
    min-height:520px !important;
    padding:22px !important;
    border-radius:18px !important;
    background-size:auto 100% !important;
    background-position:center top !important;
  }

  .hero-copy{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
    z-index:5 !important;
  }

  .hero-copy h1{
    font-size:38px !important;
    line-height:.95 !important;
    letter-spacing:-2px !important;
  }

  .hero-copy h3{
    font-size:18px !important;
    line-height:1.05 !important;
  }

  .hero-copy p{
    font-size:13px !important;
    max-width:100% !important;
  }

  .hero-buttons{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:9px !important;
  }

  .hero-buttons a{
    height:38px !important;
    padding:0 14px !important;
    font-size:12px !important;
  }

  .countdown-box{
    position:absolute !important;
    left:18px !important;
    right:18px !important;
    bottom:18px !important;
    top:auto !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    z-index:6 !important;
  }

  /* grid utama jadi 1 kolom */
  .main-grid,
  .lower-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
    margin-top:14px !important;
  }

  .main-grid > .panel,
  .lower-grid > .panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
    overflow:hidden !important;
  }

  /* jadwal & klasemen */
  .schedule-list,
  .medal-table{
    width:100% !important;
  }

  /* berita */
  .main-grid > .news-clean-panel .news-clean-grid{
    grid-template-columns:1fr !important;
    height:auto !important;
    max-height:none !important;
  }

  .main-grid > .news-clean-panel .news-link-card{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .main-grid > .news-clean-panel .news-thumb{
    height:150px !important;
    min-height:150px !important;
    max-height:150px !important;
  }

  /* sports */
  .lower-grid > .sports-clean-panel .sports-clean-wrap{
    grid-template-columns:1fr !important;
    height:auto !important;
    gap:14px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(4, 1fr) !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card{
    height:180px !important;
  }

  /* atlet */
  .lower-grid > .athlete-clean-panel .athlete-clean-grid{
    grid-template-columns:1fr !important;
    height:auto !important;
    max-height:none !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
    height:220px !important;
    max-height:220px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-img{
    height:110px !important;
    flex:0 0 110px !important;
  }

  /* sponsor */
  section.lower-grid .panel.sponsor-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  /* footer */
  .footer{
    width:calc(100% - 28px) !important;
    max-height:none !important;
    min-height:auto !important;
    padding:22px 18px !important;
    border-radius:18px !important;
  }

  .footer-grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .footer-about{
    padding-left:0 !important;
  }

  .socials{
    padding-left:0 !important;
  }
}

@media(max-width:560px){

  .hero-card{
    min-height:560px !important;
  }

  .hero-copy h1{
    font-size:32px !important;
  }

  .hero-copy h3{
    font-size:16px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(2, 1fr) !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  .main-grid > .panel .panel-head h2,
  .lower-grid > .panel .panel-head h2{
    font-size:17px !important;
  }

  .section-more{
    font-size:10px !important;
  }
}

/* ===== MOBILE FIX V2 — 414px cleanup ===== */

@media(max-width:900px){

  body{
    overflow-x:hidden !important;
  }

  .wrap,
  .container{
    width:calc(100% - 28px) !important;
    max-width:100% !important;
  }

  /* ===== HERO MOBILE CLEAN ===== */

  .hero-card{
    min-height:650px !important;
    height:650px !important;
    padding:24px 18px !important;
    border-radius:18px !important;
    overflow:hidden !important;
    background-size:cover !important;
    background-position:center top !important;
  }

  .hero-card::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background:linear-gradient(
      180deg,
      rgba(255,255,255,.90) 0%,
      rgba(255,255,255,.62) 34%,
      rgba(255,255,255,.18) 60%,
      rgba(7,25,54,.08) 100%
    ) !important;
    z-index:1 !important;
    pointer-events:none !important;
  }

  .hero-copy{
    position:relative !important;
    z-index:3 !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    width:100% !important;
    max-width:100% !important;
  }

  .hero-copy .eyebrow{
    font-size:13px !important;
    padding:10px 20px !important;
    margin-bottom:14px !important;
  }

  .hero-copy h1{
    font-size:34px !important;
    line-height:.95 !important;
    letter-spacing:-2px !important;
    margin-bottom:8px !important;
  }

  .hero-copy h3{
    font-size:18px !important;
    line-height:1.05 !important;
    margin-bottom:10px !important;
  }

  .hero-copy p{
    max-width:310px !important;
    font-size:13px !important;
    line-height:1.45 !important;
    margin-bottom:18px !important;
  }

  .hero-buttons{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-start !important;
    gap:10px !important;
  }

  .hero-buttons a{
    height:44px !important;
    padding:0 20px !important;
    font-size:14px !important;
  }

  .countdown-box{
    position:absolute !important;
    left:18px !important;
    right:18px !important;
    bottom:18px !important;
    top:auto !important;
    width:auto !important;
    max-width:none !important;
    z-index:4 !important;
    transform:none !important;
    padding:18px 16px !important;
    border-radius:18px !important;
  }

  .countdown-box h4{
    font-size:12px !important;
    margin-bottom:12px !important;
  }

  .count-grid{
    grid-template-columns:repeat(2,1fr) !important;
    gap:9px !important;
  }

  .count-item{
    height:78px !important;
  }

  .count-item b{
    font-size:30px !important;
  }

  /* ===== MAIN CARDS MOBILE ===== */

  .main-grid,
  .lower-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
    margin-top:14px !important;
  }

  .main-grid > .panel,
  .lower-grid > .panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
    padding:20px 18px !important;
    border-radius:18px !important;
    overflow:hidden !important;
  }

  .main-grid > .panel .panel-head,
  .lower-grid > .panel .panel-head,
  .main-grid > .news-clean-panel .news-head{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 14px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
  }

  .main-grid > .panel .panel-head h2,
  .lower-grid > .panel .panel-head h2,
  .main-grid > .news-clean-panel .news-head h2{
    font-size:20px !important;
    line-height:1.05 !important;
  }

  .section-more{
    font-size:11px !important;
    white-space:nowrap !important;
  }

  /* Jadwal supaya link bawah tidak nabrak */
  .schedule-list{
    padding-bottom:8px !important;
  }

  .schedule-link,
  .panel > a:last-child{
    display:inline-flex !important;
    margin-top:12px !important;
  }

  /* ===== BERITA MOBILE ===== */

  .main-grid > .news-clean-panel .news-clean-grid{
    grid-template-columns:1fr !important;
    height:auto !important;
    max-height:none !important;
    gap:12px !important;
  }

  .main-grid > .news-clean-panel .news-link-card{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .main-grid > .news-clean-panel .news-thumb{
    height:150px !important;
    min-height:150px !important;
    max-height:150px !important;
  }

  .main-grid > .news-clean-panel .news-body h3{
    font-size:14px !important;
    line-height:1.15 !important;
    -webkit-line-clamp:3 !important;
  }

  /* ===== SPORTS MOBILE FIX ===== */

  .lower-grid > .sports-clean-panel .sports-clean-wrap{
    display:block !important;
    height:auto !important;
  }

  .lower-grid > .sports-clean-panel .sports-list h3{
    font-size:12px !important;
    margin-bottom:12px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card{
    height:70px !important;
    min-height:70px !important;
    max-height:70px !important;
    padding:8px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:5px !important;
    text-align:center !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card span{
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    display:block !important;
    font-size:20px !important;
    line-height:1 !important;
    position:static !important;
    transform:none !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card b{
    display:block !important;
    margin:0 !important;
    font-size:10px !important;
    line-height:1.05 !important;
    text-align:center !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card{
    margin-top:16px !important;
    height:190px !important;
    padding:0 18px !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card h3{
    font-size:18px !important;
  }

  /* ===== ATHLETE MOBILE FIX ===== */

  .lower-grid > .athlete-clean-panel .athlete-clean-grid{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
    height:250px !important;
    min-height:250px !important;
    max-height:250px !important;
    overflow:hidden !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-img{
    height:145px !important;
    min-height:145px !important;
    max-height:145px !important;
    flex:0 0 145px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-img img{
    object-fit:cover !important;
    object-position:center top !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card h3{
    font-size:15px !important;
    margin:11px 13px 2px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card p{
    font-size:12px !important;
    margin:0 13px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-badge{
    left:13px !important;
    right:13px !important;
    bottom:12px !important;
    font-size:10px !important;
    line-height:1.08 !important;
  }

  /* ===== SPONSOR MOBILE FIX ===== */

  section.lower-grid .panel.sponsor-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
    overflow:hidden !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
    height:auto !important;
    max-height:none !important;
    overflow:visible !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card{
    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg,
  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg svg{
    width:28px !important;
    height:28px !important;
  }

  /* ===== FOOTER MOBILE ===== */

  .footer{
    width:calc(100% - 28px) !important;
    max-height:none !important;
    min-height:auto !important;
    padding:22px 18px !important;
    border-radius:18px !important;
  }

  .footer-grid{
    grid-template-columns:1fr !important;
    gap:16px !important;
  }

  .footer-about{
    padding-left:0 !important;
  }

  .socials{
    padding-left:0 !important;
  }
}

@media(max-width:480px){

  .hero-card{
    height:680px !important;
    min-height:680px !important;
  }

  .hero-copy h1{
    font-size:31px !important;
  }

  .hero-copy h3{
    font-size:16px !important;
  }

  .hero-copy p{
    font-size:13px !important;
  }

  .count-item{
    height:72px !important;
  }

  .main-grid > .panel .panel-head h2,
  .lower-grid > .panel .panel-head h2,
  .main-grid > .news-clean-panel .news-head h2{
    font-size:19px !important;
  }
}

/* ===== SPORTS DESKTOP RESTORE V19.1 ===== */

/* panel sports desktop tetap rapi */
.lower-grid > .sports-clean-panel{
  height:250px !important;
  min-height:250px !important;
  max-height:250px !important;
  padding:16px 18px !important;
  overflow:hidden !important;
}

/* layout kiri sport + kanan host city */
.lower-grid > .sports-clean-panel .sports-clean-wrap{
  display:grid !important;
  grid-template-columns:300px 1fr !important;
  gap:18px !important;
  align-items:start !important;
  height:200px !important;
}

/* grid cabang olahraga */
.lower-grid > .sports-clean-panel .sport-link-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:9px !important;
}

/* card sport */
.lower-grid > .sports-clean-panel .sport-link-card{
  height:56px !important;
  min-height:56px !important;
  max-height:56px !important;
  padding:6px 4px !important;
  border-radius:12px !important;
  background:#f8fbff !important;
  border:1px solid #dfe6ef !important;
  box-shadow:0 4px 10px rgba(7,25,54,.035) !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  text-align:center !important;
  text-decoration:none !important;
  color:#071936 !important;
  overflow:hidden !important;
}

/* INI FIX UTAMA: icon jangan jadi kapsul/pill */
.lower-grid > .sports-clean-panel .sport-link-card span{
  position:static !important;
  transform:none !important;
  display:block !important;
  width:auto !important;
  height:auto !important;
  min-width:0 !important;
  min-height:0 !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  font-size:17px !important;
  line-height:1 !important;
  text-align:center !important;
}

/* label sport */
.lower-grid > .sports-clean-panel .sport-link-card b{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  font-size:9px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  text-align:center !important;
  color:#071936 !important;
}

/* host city desktop tetap seperti sebelumnya */
.lower-grid > .sports-clean-panel .host-link-card{
  height:164px !important;
  min-height:164px !important;
  max-height:164px !important;
  margin-top:0 !important;
}

/* mobile tetap 2 kolom */
@media(max-width:900px){
  .lower-grid > .sports-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
  }

  .lower-grid > .sports-clean-panel .sports-clean-wrap{
    display:block !important;
    height:auto !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card{
    height:70px !important;
    min-height:70px !important;
    max-height:70px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card span{
    font-size:20px !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card{
    margin-top:16px !important;
    height:190px !important;
    min-height:190px !important;
    max-height:190px !important;
  }
}

/* ===== MOBILE COMPACT V3 — Samsung A34 real mobile polish ===== */

@media(max-width:600px){

  .wrap,
  .container{
    width:calc(100% - 28px) !important;
  }

  /* ===== HEADER ===== */

  .topbar{
    font-size:11px !important;
    padding:5px 10px !important;
  }

  .nav{
    padding:10px 0 !important;
  }

  .brand{
    gap:10px !important;
  }

  .brand .logo-mark,
  .brand .official-logo{
    width:54px !important;
    height:54px !important;
    flex:0 0 54px !important;
    border-radius:14px !important;
  }

  .brand-text b{
    font-size:16px !important;
    line-height:1.05 !important;
  }

  .brand-text small{
    font-size:12px !important;
  }

  .search-btn{
    width:42px !important;
    height:42px !important;
  }

  .lang-pill{
    height:34px !important;
    padding:0 10px !important;
    font-size:11px !important;
  }

  /* ===== HERO lebih pendek ===== */

  .hero-card{
    height:560px !important;
    min-height:560px !important;
    max-height:560px !important;
    padding:22px 18px !important;
    background-size:cover !important;
    background-position:center top !important;
  }

  .hero-copy .eyebrow{
    font-size:12px !important;
    padding:9px 16px !important;
    margin-bottom:12px !important;
  }

  .hero-copy h1{
    font-size:30px !important;
    line-height:.96 !important;
    letter-spacing:-1.7px !important;
    margin-bottom:8px !important;
  }

  .hero-copy h3{
    font-size:15px !important;
    line-height:1.08 !important;
    margin-bottom:9px !important;
  }

  .hero-copy p{
    max-width:310px !important;
    font-size:12px !important;
    line-height:1.35 !important;
    margin-bottom:14px !important;
  }

  .hero-buttons{
    gap:8px !important;
  }

  .hero-buttons a{
    height:40px !important;
    padding:0 17px !important;
    font-size:13px !important;
    border-radius:12px !important;
  }

  .countdown-box{
    left:18px !important;
    right:18px !important;
    bottom:16px !important;
    padding:15px 14px !important;
    border-radius:16px !important;
  }

  .countdown-box h4{
    font-size:11px !important;
    margin-bottom:10px !important;
  }

  .count-grid{
    gap:8px !important;
  }

  .count-item{
    height:62px !important;
    border-radius:12px !important;
  }

  .count-item b{
    font-size:25px !important;
  }

  .count-item span{
    font-size:9px !important;
  }

  .count-date{
    font-size:17px !important;
    margin-top:11px !important;
    padding-top:10px !important;
  }

  .count-range{
    font-size:13px !important;
  }

  /* ===== PANEL umum ===== */

  .main-grid,
  .lower-grid{
    gap:14px !important;
    margin-top:14px !important;
  }

  .main-grid > .panel,
  .lower-grid > .panel{
    padding:18px 16px !important;
    border-radius:18px !important;
  }

  .main-grid > .panel .panel-head,
  .lower-grid > .panel .panel-head,
  .main-grid > .news-clean-panel .news-head{
    margin-bottom:13px !important;
    gap:10px !important;
  }

  .main-grid > .panel .panel-head h2,
  .lower-grid > .panel .panel-head h2,
  .main-grid > .news-clean-panel .news-head h2{
    font-size:22px !important;
    line-height:1.05 !important;
    letter-spacing:-.7px !important;
  }

  .section-more{
    font-size:12px !important;
    line-height:1 !important;
  }

  /* ===== JADWAL ===== */

  .schedule-item{
    gap:10px !important;
    padding:8px 0 !important;
  }

  .schedule-item .sport-ico{
    font-size:21px !important;
  }

  .schedule-item h3{
    font-size:14px !important;
    line-height:1.15 !important;
  }

  .schedule-item time{
    font-size:12px !important;
  }

  .venue-pill{
    font-size:10px !important;
    padding:6px 10px !important;
  }

  /* ===== KLASEMEN ===== */

  .medal-table{
    font-size:12px !important;
  }

  .medal-table th,
  .medal-table td{
    padding:8px 6px !important;
  }

  /* ===== BERITA MOBILE lebih compact ===== */

  .main-grid > .news-clean-panel .news-clean-grid{
    grid-template-columns:1fr !important;
    gap:12px !important;
  }

  .main-grid > .news-clean-panel .news-link-card{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    border-radius:14px !important;
  }

  .main-grid > .news-clean-panel .news-thumb{
    height:145px !important;
    min-height:145px !important;
    max-height:145px !important;
  }

  .main-grid > .news-clean-panel .news-thumb img{
    transform:scale(1.06) !important;
    object-position:center top !important;
  }

  .main-grid > .news-clean-panel .news-body{
    padding:11px 12px 13px !important;
  }

  .main-grid > .news-clean-panel .news-body h3{
    font-size:15px !important;
    line-height:1.15 !important;
    -webkit-line-clamp:3 !important;
  }

  /* ===== SPORTS MOBILE lebih compact ===== */

  .lower-grid > .sports-clean-panel .sport-link-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card{
    height:76px !important;
    min-height:76px !important;
    max-height:76px !important;
    border-radius:14px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card span{
    font-size:22px !important;
  }

  .lower-grid > .sports-clean-panel .sport-link-card b{
    font-size:12px !important;
    line-height:1.05 !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card{
    height:230px !important;
    min-height:230px !important;
    max-height:230px !important;
    margin-top:16px !important;
    border-radius:18px !important;
    padding:0 20px !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card small{
    font-size:11px !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card h3{
    font-size:24px !important;
    line-height:1.05 !important;
  }

  .lower-grid > .sports-clean-panel .host-link-card p{
    font-size:14px !important;
    line-height:1.25 !important;
  }

  /* ===== ATLET MOBILE compact ===== */

  .lower-grid > .athlete-clean-panel .athlete-clean-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-clean-grid > a.athlete-link-card{
    height:310px !important;
    min-height:310px !important;
    max-height:310px !important;
    border-radius:16px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-img{
    height:185px !important;
    min-height:185px !important;
    max-height:185px !important;
    flex:0 0 185px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card h3{
    font-size:20px !important;
    line-height:1.05 !important;
    margin:14px 16px 3px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card p{
    font-size:14px !important;
    margin:0 16px !important;
  }

  .lower-grid > .athlete-clean-panel .athlete-link-card .ath-badge{
    left:16px !important;
    right:16px !important;
    bottom:14px !important;
    font-size:12px !important;
  }

  /* ===== SPONSOR MOBILE heading jangan kepotong ===== */

  section.lower-grid .panel.sponsor-clean-panel .sponsor-head,
  section.lower-grid .panel.sponsor-clean-panel .panel-head{
    align-items:flex-start !important;
    gap:8px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-head h2,
  section.lower-grid .panel.sponsor-clean-panel .panel-head h2{
    font-size:20px !important;
    line-height:1.05 !important;
    max-width:58% !important;
    white-space:normal !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-more{
    font-size:11px !important;
    line-height:1.1 !important;
    max-width:42% !important;
    white-space:normal !important;
    text-align:right !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card{
    height:100px !important;
    min-height:100px !important;
    max-height:100px !important;
    border-radius:14px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg,
  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg svg{
    width:34px !important;
    height:34px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card b{
    font-size:10px !important;
  }

  /* ===== FOOTER MOBILE compact ===== */

  .footer{
    width:calc(100% - 28px) !important;
    padding:26px 22px !important;
    border-radius:18px !important;
  }

  .footer-grid{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }

  .footer-brand{
    gap:12px !important;
  }

  .footer-official-logo{
    width:58px !important;
    height:58px !important;
    flex:0 0 58px !important;
  }

  .footer-brand b{
    font-size:20px !important;
  }

  .footer-brand small{
    font-size:13px !important;
  }

  .footer h4{
    font-size:13px !important;
    margin-bottom:10px !important;
  }

  .footer a,
  .footer p{
    font-size:13px !important;
    line-height:1.45 !important;
  }
}

/* ===== SPONSOR MOBILE FIX V4 — stop cutting bottom cards ===== */

@media(max-width:600px){

  section.lower-grid .panel.sponsor-clean-panel{
    height:auto !important;
    min-height:auto !important;
    max-height:none !important;
    overflow:visible !important;
    padding:18px 16px 22px !important;
    margin-bottom:16px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-head,
  section.lower-grid .panel.sponsor-clean-panel .panel-head{
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:8px !important;
    margin:0 0 14px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-head h2,
  section.lower-grid .panel.sponsor-clean-panel .panel-head h2{
    font-size:20px !important;
    line-height:1.05 !important;
    max-width:58% !important;
    white-space:normal !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-more{
    font-size:11px !important;
    line-height:1.1 !important;
    max-width:42% !important;
    white-space:normal !important;
    text-align:right !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    gap:10px !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    overflow:visible !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card{
    height:88px !important;
    min-height:88px !important;
    max-height:88px !important;
    border-radius:14px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg,
  section.lower-grid .panel.sponsor-clean-panel .sponsor-svg svg{
    width:30px !important;
    height:30px !important;
    flex:0 0 30px !important;
  }

  section.lower-grid .panel.sponsor-clean-panel .sponsor-clean-card b{
    font-size:9px !important;
  }
}

/* ===== SPONSOR MOBILE FIX V5 — force 8 sponsors visible ===== */

@media(max-width:600px){

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel,
  body section.lower-grid .panel.sponsor-panel.sponsor-clean-panel{
    height:520px !important;
    min-height:520px !important;
    max-height:none !important;
    overflow:visible !important;
    padding:18px 16px 24px !important;
    margin-bottom:22px !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .panel-head,
  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-head{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 0 16px !important;
    padding:0 !important;
    display:flex !important;
    align-items:flex-start !important;
    justify-content:space-between !important;
    gap:10px !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .panel-head h2,
  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-head h2{
    font-size:20px !important;
    line-height:1.05 !important;
    max-width:56% !important;
    white-space:normal !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-more{
    font-size:11px !important;
    line-height:1.1 !important;
    max-width:44% !important;
    white-space:normal !important;
    text-align:right !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-clean-grid{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    grid-template-rows:repeat(4, 82px) !important;
    gap:10px !important;
    height:auto !important;
    min-height:358px !important;
    max-height:none !important;
    overflow:visible !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-clean-card{
    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;
    border-radius:14px !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-svg,
  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-svg svg{
    width:28px !important;
    height:28px !important;
    flex:0 0 28px !important;
  }

  body .lower-grid > .panel.sponsor-panel.sponsor-clean-panel .sponsor-clean-card b{
    font-size:9px !important;
  }
}

/* ===== FOOTER MOBILE FINAL SAFE BOTTOM ===== */

@media(max-width:600px){
  .footer{
    margin-bottom:26px !important;
    padding-bottom:70px !important;
    overflow:visible !important;
  }

  .footer-bottom,
  .copyright{
    display:block !important;
    margin-top:22px !important;
    padding-bottom:10px !important;
    font-size:11px !important;
    line-height:1.45 !important;
  }
}

/* ===== LANGUAGE + SEARCH FINAL ===== */

.lang-switch{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
}

.lang-switch a{
  color:#071936 !important;
  text-decoration:none !important;
  font-weight:950 !important;
}

.lang-switch a.active{
  color:#071936 !important;
}

.lang-switch a:not(.active){
  color:#d71920 !important;
}

.lang-switch em{
  font-style:normal !important;
  color:#071936 !important;
  opacity:.65 !important;
}

.search-btn{
  cursor:pointer !important;
}

/* search modal */
.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

.search-modal.is-open{
  display:flex !important;
}

.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
}

.search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, 100%) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
}

.search-box h2{
  margin:0 0 8px !important;
  font-size:26px !important;
  line-height:1.05 !important;
  color:#071936 !important;
  font-weight:950 !important;
}

.search-box p{
  margin:0 0 20px !important;
  font-size:14px !important;
  line-height:1.45 !important;
  color:#5d6b82 !important;
  font-weight:700 !important;
}

.search-close{
  position:absolute !important;
  right:18px !important;
  top:14px !important;
  width:36px !important;
  height:36px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:24px !important;
  line-height:1 !important;
  cursor:pointer !important;
}

.search-form{
  display:flex !important;
  gap:10px !important;
}

.search-form input{
  flex:1 !important;
  height:48px !important;
  border-radius:14px !important;
  border:1px solid #dfe6ef !important;
  padding:0 15px !important;
  font-size:14px !important;
  font-weight:700 !important;
  outline:none !important;
}

.search-form input:focus{
  border-color:#d71920 !important;
  box-shadow:0 0 0 4px rgba(215,25,32,.10) !important;
}

.search-form button{
  height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  padding:0 20px !important;
  background:#d71920 !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

@media(max-width:600px){
  .search-box{
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .search-box h2{
    font-size:22px !important;
  }

  .search-form{
    flex-direction:column !important;
  }

  .search-form input,
  .search-form button{
    width:100% !important;
  }
}

/* ===== LANG + SEARCH CLICK FIX V2 ===== */

.nav-actions,
.lang-switch,
.search-btn{
  position:relative !important;
  z-index:50 !important;
  pointer-events:auto !important;
}

.lang-switch{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  cursor:pointer !important;
}

.lang-switch .lang-option{
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
  color:#071936 !important;
  font:inherit !important;
  font-weight:950 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
}

.lang-switch .lang-option.active{
  color:#071936 !important;
}

.lang-switch .lang-option:not(.active){
  color:#d71920 !important;
}

.lang-switch em{
  font-style:normal !important;
  color:#071936 !important;
  opacity:.6 !important;
}

.search-btn{
  cursor:pointer !important;
}

/* modal */
.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:99999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

.search-modal.is-open{
  display:flex !important;
}

.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
}

.search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, 100%) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
}

.search-box h2{
  margin:0 0 8px !important;
  font-size:26px !important;
  line-height:1.05 !important;
  color:#071936 !important;
  font-weight:950 !important;
}

.search-box p{
  margin:0 0 20px !important;
  font-size:14px !important;
  line-height:1.45 !important;
  color:#5d6b82 !important;
  font-weight:700 !important;
}

.search-close{
  position:absolute !important;
  right:18px !important;
  top:14px !important;
  width:36px !important;
  height:36px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:24px !important;
  line-height:1 !important;
  cursor:pointer !important;
}

.search-form{
  display:flex !important;
  gap:10px !important;
}

.search-form input{
  flex:1 !important;
  height:48px !important;
  border-radius:14px !important;
  border:1px solid #dfe6ef !important;
  padding:0 15px !important;
  font-size:14px !important;
  font-weight:700 !important;
  outline:none !important;
}

.search-form button{
  height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  padding:0 20px !important;
  background:#d71920 !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

@media(max-width:600px){
  .search-box{
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .search-box h2{
    font-size:22px !important;
  }

  .search-form{
    flex-direction:column !important;
  }

  .search-form input,
  .search-form button{
    width:100% !important;
  }
}

/* ===== HEADER LANG SEARCH FORCE V3 ===== */

.lang-search-actions{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  position:relative !important;
  z-index:100 !important;
  pointer-events:auto !important;
}

.lang-switch{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  height:42px !important;
  padding:0 16px !important;
  border-radius:999px !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
}

.lang-option{
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  margin:0 !important;
  font-weight:950 !important;
  color:#d71920 !important;
  cursor:pointer !important;
}

.lang-option.active{
  color:#071936 !important;
}

.lang-switch em{
  font-style:normal !important;
  opacity:.6 !important;
}

.search-btn{
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  border:0 !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  color:#071936 !important;
  font-weight:950 !important;
  cursor:pointer !important;
  position:relative !important;
  z-index:100 !important;
  pointer-events:auto !important;
}

/* ===== HEADER SEARCH BUTTON REAL FIX ===== */

.header-actions{
  position:relative !important;
  z-index:100 !important;
  pointer-events:auto !important;
}

.header-actions .search.search-btn,
.header-actions .search-btn{
  width:42px !important;
  height:42px !important;
  border-radius:999px !important;
  border:0 !important;
  background:#fff !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  color:#071936 !important;
  font-size:18px !important;
  font-weight:950 !important;
  cursor:pointer !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  pointer-events:auto !important;
}

.header-actions .lang-switch{
  pointer-events:auto !important;
}

.header-actions .lang-option{
  pointer-events:auto !important;
}

/* ===== MOBILE HEADER LANG SEARCH FIX FINAL ===== */

.header-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  position:relative !important;
  z-index:999 !important;
  pointer-events:auto !important;
}

.header-actions *{
  pointer-events:auto !important;
}

.header-actions .lang-switch{
  width:auto !important;
  min-width:92px !important;
  max-width:none !important;
  height:42px !important;
  padding:0 14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  border-radius:999px !important;
  background:#fff !important;
  overflow:visible !important;
  white-space:nowrap !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
}

.header-actions .lang-switch .lang-option{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:18px !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#071936 !important;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:950 !important;
  cursor:pointer !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.header-actions .lang-switch .lang-option.active{
  color:#d71920 !important;
}

.header-actions .lang-switch em{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#071936 !important;
  font-style:normal !important;
  font-size:14px !important;
  font-weight:900 !important;
  opacity:.75 !important;
}

.header-actions .search.search-btn,
.header-actions .search-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  border-radius:999px !important;
  border:0 !important;
  background:#fff !important;
  color:#071936 !important;
  font-size:18px !important;
  font-weight:950 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* mobile khusus */
@media(max-width:600px){
  .header-actions{
    gap:8px !important;
    flex:0 0 auto !important;
  }

  .header-actions .lang-switch{
    min-width:86px !important;
    height:40px !important;
    padding:0 12px !important;
  }

  .header-actions .lang-switch .lang-option,
  .header-actions .lang-switch em{
    font-size:13px !important;
  }

  .header-actions .search.search-btn,
  .header-actions .search-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    max-width:40px !important;
  }
}

/* ===== MOBILE ONLY — SPLIT ID EN SEARCH ===== */
/* Desktop tidak kena, hanya layar HP */

@media(max-width:600px){

  header .header-actions{
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:7px !important;
    position:relative !important;
    z-index:99999 !important;
    overflow:visible !important;
    pointer-events:auto !important;
  }

  /* Hilangkan bentuk 1 pill di mobile */
  header .header-actions .lang-pill.lang-switch{
    width:auto !important;
    min-width:0 !important;
    max-width:none !important;
    height:auto !important;
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    border-radius:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:7px !important;
    overflow:visible !important;
    flex:0 0 auto !important;
  }

  /* Slash disembunyikan khusus mobile */
  header .header-actions .lang-pill.lang-switch em{
    display:none !important;
  }

  /* ID dan EN jadi tombol sendiri */
  header .header-actions .lang-pill.lang-switch .lang-option{
    width:40px !important;
    min-width:40px !important;
    max-width:40px !important;
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#fff !important;
    box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
    color:#071936 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:13px !important;
    line-height:1 !important;
    font-weight:950 !important;
    cursor:pointer !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    position:static !important;
    transform:none !important;
    text-indent:0 !important;
    overflow:visible !important;
  }

  header .header-actions .lang-pill.lang-switch .lang-option.active{
    color:#d71920 !important;
  }

  /* Search tetap tombol sendiri */
  header .header-actions .search.search-btn,
  header .header-actions .search-btn,
  header .header-actions .search{
    width:40px !important;
    min-width:40px !important;
    max-width:40px !important;
    height:40px !important;
    min-height:40px !important;
    max-height:40px !important;
    flex:0 0 40px !important;
    padding:0 !important;
    margin:0 !important;
    border:0 !important;
    border-radius:999px !important;
    background:#fff !important;
    box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
    color:#071936 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:18px !important;
    font-weight:950 !important;
    cursor:pointer !important;
    opacity:1 !important;
    visibility:visible !important;
    pointer-events:auto !important;
    position:relative !important;
    z-index:99999 !important;
  }
}

/* ===== HEADER CLICK AREA FORCE FINAL ===== */

header,
.site-header,
.header,
.navbar,
.header-actions{
  position:relative !important;
  z-index:999999 !important;
  pointer-events:auto !important;
}

.header-actions,
.header-actions *{
  pointer-events:auto !important;
}

.header-actions .lang-option,
.header-actions .search,
.header-actions .search-btn{
  cursor:pointer !important;
  position:relative !important;
  z-index:999999 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
  -webkit-tap-highlight-color:rgba(215,25,32,.18) !important;
}

/* cegah hero/layer lain nutup area header */
.hero-card,
.hero-card:before,
.hero-card:after{
  pointer-events:auto;
}

header + *,
.site-header + *{
  position:relative;
  z-index:1;
}

/* ===== MOBILE HEADER LANG SEARCH FIX FINAL ===== */

.header-actions{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  position:relative !important;
  z-index:999 !important;
  pointer-events:auto !important;
}

.header-actions *{
  pointer-events:auto !important;
}

.header-actions .lang-switch{
  width:auto !important;
  min-width:92px !important;
  max-width:none !important;
  height:42px !important;
  padding:0 14px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  border-radius:999px !important;
  background:#fff !important;
  overflow:visible !important;
  white-space:nowrap !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
}

.header-actions .lang-switch .lang-option{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:18px !important;
  width:auto !important;
  height:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  color:#071936 !important;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:950 !important;
  cursor:pointer !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.header-actions .lang-switch .lang-option.active{
  color:#d71920 !important;
}

.header-actions .lang-switch em{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#071936 !important;
  font-style:normal !important;
  font-size:14px !important;
  font-weight:900 !important;
  opacity:.75 !important;
}

.header-actions .search.search-btn,
.header-actions .search-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  border-radius:999px !important;
  border:0 !important;
  background:#fff !important;
  color:#071936 !important;
  font-size:18px !important;
  font-weight:950 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  opacity:1 !important;
  visibility:visible !important;
}

/* mobile khusus */
@media(max-width:600px){
  .header-actions{
    gap:8px !important;
    flex:0 0 auto !important;
  }

  .header-actions .lang-switch{
    min-width:86px !important;
    height:40px !important;
    padding:0 12px !important;
  }

  .header-actions .lang-switch .lang-option,
  .header-actions .lang-switch em{
    font-size:13px !important;
  }

  .header-actions .search.search-btn,
  .header-actions .search-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    max-width:40px !important;
  }
}

/* ===== HEADER NO-JS CLICK FINAL ===== */

header .header-actions-nojs{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:10px !important;
  position:relative !important;
  z-index:999999 !important;
  pointer-events:auto !important;
}

header .header-actions-nojs a{
  pointer-events:auto !important;
  cursor:pointer !important;
  text-decoration:none !important;
}

header .header-actions-nojs .lang-switch{
  height:42px !important;
  min-width:92px !important;
  padding:0 14px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:5px !important;
  background:#fff !important;
  border-radius:999px !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
}

header .header-actions-nojs .lang-option{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  color:#071936 !important;
  font-size:14px !important;
  line-height:1 !important;
  font-weight:950 !important;
}

header .header-actions-nojs .lang-option.active{
  color:#d71920 !important;
}

header .header-actions-nojs em{
  font-style:normal !important;
  color:#071936 !important;
  opacity:.65 !important;
  font-weight:900 !important;
}

header .header-actions-nojs .search.search-btn{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#071936 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  font-size:18px !important;
  font-weight:950 !important;
}

/* modal default hidden */
.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

/* buka modal tanpa JS */
.search-modal:target{
  display:flex !important;
}

.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
  display:block !important;
}

.search-box{
  position:relative !important;
  z-index:2 !important;
}

.search-close{
  text-decoration:none !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

/* mobile: pisah ID dan EN */
@media(max-width:600px){
  header .header-actions-nojs{
    gap:7px !important;
  }

  header .header-actions-nojs .lang-switch{
    min-width:0 !important;
    height:auto !important;
    padding:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    gap:7px !important;
  }

  header .header-actions-nojs .lang-switch em{
    display:none !important;
  }

  header .header-actions-nojs .lang-option{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    border-radius:999px !important;
    background:#fff !important;
    box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
    font-size:13px !important;
  }

  header .header-actions-nojs .search.search-btn{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
  }
}

/* ===== MOBILE HORIZONTAL OVERFLOW FIX FINAL ===== */

html,
body{
  max-width:100% !important;
  overflow-x:hidden !important;
}

body{
  position:relative !important;
}

/* cegah semua elemen melebar keluar layar */
*,
*::before,
*::after{
  box-sizing:border-box !important;
}

/* khusus mobile */
@media(max-width:600px){

  html,
  body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .topbar,
  header,
  .site-header,
  .hero-section,
  .main-grid,
  .lower-grid,
  .footer{
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .wrap,
  .container{
    width:100% !important;
    max-width:100% !important;
    padding-left:14px !important;
    padding-right:14px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    overflow:hidden !important;
  }

  /* header jangan melebar keluar */
  header .wrap,
  .site-header .wrap{
    width:100% !important;
    max-width:100% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    overflow:hidden !important;
  }

  .brand{
    min-width:0 !important;
    flex:1 1 auto !important;
    overflow:hidden !important;
  }

  .brand-text{
    min-width:0 !important;
    overflow:hidden !important;
  }

  .brand-text b,
  .brand-text small{
    max-width:160px !important;
    display:block !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .header-actions{
    flex:0 0 auto !important;
    max-width:145px !important;
    overflow:visible !important;
  }

  /* hero tidak boleh melebihi layar */
  .hero-card{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    overflow:hidden !important;
  }

  .hero-copy{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  .hero-copy h1,
  .hero-copy h3,
  .hero-copy p{
    max-width:100% !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
  }

  .hero-buttons{
    max-width:100% !important;
    overflow:hidden !important;
  }

  .hero-buttons a{
    max-width:100% !important;
  }

  .countdown-box{
    left:18px !important;
    right:18px !important;
    width:auto !important;
    max-width:calc(100% - 36px) !important;
    overflow:hidden !important;
  }

  .count-grid{
    width:100% !important;
    max-width:100% !important;
  }

  /* semua panel/card tidak keluar */
  .main-grid > .panel,
  .lower-grid > .panel,
  .news-link-card,
  .sport-link-card,
  .athlete-link-card,
  .sponsor-clean-card,
  .host-link-card{
    max-width:100% !important;
    overflow:hidden !important;
  }

  .main-grid,
  .lower-grid{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
  }

  /* tabel klasemen jangan paksa layar melebar */
  .medal-table{
    width:100% !important;
    max-width:100% !important;
    table-layout:auto !important;
    overflow:hidden !important;
  }

  .medal-table th,
  .medal-table td{
    white-space:normal !important;
  }

  /* footer */
  .footer{
    width:calc(100% - 28px) !important;
    max-width:calc(100% - 28px) !important;
    margin-left:auto !important;
    margin-right:auto !important;
    overflow:hidden !important;
  }
}

/* ===== SEARCH CLOSE BUTTON MOBILE FIX ===== */

.search-close{
  position:absolute !important;
  right:18px !important;
  top:14px !important;
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  min-height:42px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:28px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  z-index:20 !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

.search-backdrop{
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
}

.search-box{
  overflow:visible !important;
}

@media(max-width:600px){
  .search-close{
    right:14px !important;
    top:12px !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    min-height:44px !important;
    font-size:30px !important;
  }

  .search-box{
    max-width:calc(100vw - 36px) !important;
  }
}

/* ===== SEARCH MODAL PURE TARGET FINAL ===== */

/* target penutup tidak terlihat */
#closeSearch{
  display:block !important;
  width:0 !important;
  height:0 !important;
  overflow:hidden !important;
}

/* default: modal mati total */
.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

/* hanya tampil kalau hash URL = #searchModal */
.search-modal:target{
  display:flex !important;
}

/* kalau class JS is-open masih nyangkut, jangan dipakai lagi */
.search-modal.is-open:not(:target){
  display:none !important;
}

/* backdrop klik untuk tutup */
.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
  cursor:pointer !important;
  z-index:1 !important;
}

/* box */
.search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
  overflow:visible !important;
}

/* tombol X pasti di atas */
.search-close{
  position:absolute !important;
  right:14px !important;
  top:12px !important;
  width:46px !important;
  height:46px !important;
  min-width:46px !important;
  min-height:46px !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  text-decoration:none !important;
  font-size:32px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:10 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

@media(max-width:600px){
  .search-modal{
    align-items:center !important;
    padding:18px !important;
  }

  .search-box{
    width:calc(100vw - 36px) !important;
    max-width:calc(100vw - 36px) !important;
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .search-box h2{
    padding-right:54px !important;
  }

  .search-close{
    right:12px !important;
    top:10px !important;
    width:50px !important;
    height:50px !important;
    min-width:50px !important;
    min-height:50px !important;
  }
}

/* ===== SEARCH MODAL JS FINAL FIX ===== */

.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

.search-modal.is-open{
  display:flex !important;
}

.search-modal:not(.is-open){
  display:none !important;
}

.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
  cursor:pointer !important;
  z-index:1 !important;
  pointer-events:auto !important;
}

.search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
  overflow:visible !important;
}

.search-close{
  position:absolute !important;
  right:12px !important;
  top:10px !important;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  min-height:52px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:34px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:99999999 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

.search-box h2{
  padding-right:58px !important;
}

@media(max-width:600px){
  .search-modal{
    padding:18px !important;
  }

  .search-box{
    width:calc(100vw - 36px) !important;
    max-width:calc(100vw - 36px) !important;
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .search-close{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    right:10px !important;
    top:8px !important;
  }
}

/* ===== SEARCH DESKTOP MOBILE FINAL RESTORE ===== */

.header-actions,
.header-actions *{
  pointer-events:auto !important;
}

.header-actions .search.search-btn,
.header-actions .search-btn,
.header-actions .search{
  position:relative !important;
  z-index:999999 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
}

/* matikan mode :target lama, pakai .is-open saja */
.search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

.search-modal:target{
  display:none !important;
}

.search-modal.is-open{
  display:flex !important;
}

.search-modal:not(.is-open){
  display:none !important;
}

.search-backdrop{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  width:100% !important;
  height:100% !important;
  border:0 !important;
  padding:0 !important;
  margin:0 !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
  cursor:pointer !important;
  z-index:1 !important;
  pointer-events:auto !important;
}

.search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
  overflow:visible !important;
}

.search-close{
  position:absolute !important;
  right:12px !important;
  top:10px !important;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  min-height:52px !important;
  border:0 !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:34px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  z-index:99999999 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  touch-action:manipulation !important;
}

.search-box h2{
  padding-right:58px !important;
}

@media(max-width:600px){
  .search-modal{
    padding:18px !important;
  }

  .search-box{
    width:calc(100vw - 36px) !important;
    max-width:calc(100vw - 36px) !important;
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .search-close{
    width:56px !important;
    height:56px !important;
    min-width:56px !important;
    min-height:56px !important;
    right:10px !important;
    top:8px !important;
  }
}

/* ===== SEARCH CHECKBOX MODAL FINAL — NO JS ===== */

/* Matikan modal lama agar tidak bentrok */
.search-modal{
  display:none !important;
}

/* Tombol search header */
.site-search-trigger,
.header-actions .site-search-trigger{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
  max-width:42px !important;
  border-radius:999px !important;
  background:#fff !important;
  color:#071936 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:0 8px 22px rgba(7,25,54,.08) !important;
  font-size:18px !important;
  font-weight:950 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
  position:relative !important;
  z-index:999999 !important;
  text-decoration:none !important;
}

/* Checkbox tersembunyi */
.site-search-toggle{
  position:absolute !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* Modal default tertutup */
.site-search-modal{
  position:fixed !important;
  inset:0 !important;
  z-index:9999999 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
}

/* Modal terbuka saat checkbox checked */
.site-search-toggle:checked + .site-search-modal{
  display:flex !important;
}

/* Backdrop */
.site-search-backdrop{
  position:absolute !important;
  inset:0 !important;
  display:block !important;
  background:rgba(7,25,54,.58) !important;
  backdrop-filter:blur(6px) !important;
  cursor:pointer !important;
  z-index:1 !important;
}

/* Box */
.site-search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
  background:#fff !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 24px 60px rgba(7,25,54,.28) !important;
  overflow:visible !important;
}

/* Close X */
.site-search-close{
  position:absolute !important;
  right:12px !important;
  top:10px !important;
  width:52px !important;
  height:52px !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:34px !important;
  line-height:1 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  cursor:pointer !important;
  z-index:10 !important;
  text-decoration:none !important;
}

.site-search-box h2{
  margin:0 0 8px !important;
  padding-right:58px !important;
  font-size:26px !important;
  line-height:1.05 !important;
  color:#071936 !important;
  font-weight:950 !important;
}

.site-search-box p{
  margin:0 0 20px !important;
  font-size:14px !important;
  line-height:1.45 !important;
  color:#5d6b82 !important;
  font-weight:700 !important;
}

.site-search-form{
  display:flex !important;
  gap:10px !important;
}

.site-search-form input{
  flex:1 !important;
  height:48px !important;
  border-radius:14px !important;
  border:1px solid #dfe6ef !important;
  padding:0 15px !important;
  font-size:14px !important;
  font-weight:700 !important;
  outline:none !important;
}

.site-search-form input:focus{
  border-color:#d71920 !important;
  box-shadow:0 0 0 4px rgba(215,25,32,.10) !important;
}

.site-search-form button{
  height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  padding:0 20px !important;
  background:#d71920 !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

@media(max-width:600px){
  .site-search-trigger,
  .header-actions .site-search-trigger{
    width:40px !important;
    height:40px !important;
    min-width:40px !important;
    max-width:40px !important;
  }

  .site-search-modal{
    padding:18px !important;
  }

  .site-search-box{
    width:calc(100vw - 36px) !important;
    max-width:calc(100vw - 36px) !important;
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  .site-search-box h2{
    font-size:22px !important;
  }

  .site-search-close{
    width:54px !important;
    height:54px !important;
    right:10px !important;
    top:8px !important;
  }

  .site-search-form{
    flex-direction:column !important;
  }

  .site-search-form input,
  .site-search-form button{
    width:100% !important;
  }
}

/* ===== SEARCH CHECKBOX MODAL REAL FIX FINAL ===== */

/* pastikan checkbox tidak ikut layout */
body #siteSearchToggle.site-search-toggle{
  position:fixed !important;
  left:-99999px !important;
  top:-99999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* default modal benar-benar hidden */
body .site-search-modal{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  z-index:2147483647 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:22px !important;
  margin:0 !important;
  background:transparent !important;
  overflow:hidden !important;
}

/* saat checkbox aktif, modal jadi overlay fixed */
body #siteSearchToggle:checked + .site-search-modal,
body #siteSearchToggle:checked ~ .site-search-modal{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  display:flex !important;
}

/* backdrop overlay */
body .site-search-modal .site-search-backdrop{
  position:absolute !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  display:block !important;
  background:rgba(7,25,54,.62) !important;
  backdrop-filter:blur(7px) !important;
  -webkit-backdrop-filter:blur(7px) !important;
  z-index:1 !important;
  cursor:pointer !important;
}

/* box pencarian */
body .site-search-modal .site-search-box{
  position:relative !important;
  z-index:2 !important;
  width:min(560px, calc(100vw - 36px)) !important;
  max-width:calc(100vw - 36px) !important;
  max-height:calc(100vh - 80px) !important;
  margin:0 auto !important;
  padding:28px !important;
  border-radius:22px !important;
  background:#fff !important;
  box-shadow:0 24px 70px rgba(7,25,54,.35) !important;
  overflow:visible !important;
}

/* tombol close X */
body .site-search-modal .site-search-close{
  position:absolute !important;
  right:12px !important;
  top:10px !important;
  width:52px !important;
  height:52px !important;
  min-width:52px !important;
  min-height:52px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:999px !important;
  background:#f1f5fb !important;
  color:#071936 !important;
  font-size:34px !important;
  line-height:1 !important;
  font-weight:800 !important;
  text-decoration:none !important;
  z-index:5 !important;
  cursor:pointer !important;
}

/* teks */
body .site-search-modal .site-search-box h2{
  margin:0 0 8px !important;
  padding-right:58px !important;
  font-size:26px !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  color:#071936 !important;
}

body .site-search-modal .site-search-box p{
  margin:0 0 20px !important;
  font-size:14px !important;
  line-height:1.45 !important;
  font-weight:700 !important;
  color:#5d6b82 !important;
}

/* form */
body .site-search-modal .site-search-form{
  display:flex !important;
  gap:10px !important;
  width:100% !important;
}

body .site-search-modal .site-search-form input{
  flex:1 !important;
  height:48px !important;
  border-radius:14px !important;
  border:1px solid #dfe6ef !important;
  padding:0 15px !important;
  font-size:14px !important;
  font-weight:700 !important;
  outline:none !important;
}

body .site-search-modal .site-search-form button{
  height:48px !important;
  border:0 !important;
  border-radius:14px !important;
  padding:0 20px !important;
  background:#d71920 !important;
  color:#fff !important;
  font-size:14px !important;
  font-weight:950 !important;
  cursor:pointer !important;
}

/* mobile */
@media(max-width:600px){
  body .site-search-modal{
    padding:18px !important;
    align-items:center !important;
  }

  body .site-search-modal .site-search-box{
    width:calc(100vw - 36px) !important;
    max-width:calc(100vw - 36px) !important;
    padding:24px 20px !important;
    border-radius:20px !important;
  }

  body .site-search-modal .site-search-box h2{
    font-size:22px !important;
    padding-right:56px !important;
  }

  body .site-search-modal .site-search-close{
    right:10px !important;
    top:8px !important;
    width:54px !important;
    height:54px !important;
    min-width:54px !important;
    min-height:54px !important;
  }

  body .site-search-modal .site-search-form{
    flex-direction:column !important;
  }

  body .site-search-modal .site-search-form input,
  body .site-search-modal .site-search-form button{
    width:100% !important;
  }
}

/* ===== AG SEARCH CLOSE CLICK FIX ===== */

body #agSearchModal .ag-search-close{
  pointer-events:auto !important;
  z-index:2147483647 !important;
  cursor:pointer !important;
  touch-action:manipulation !important;
}

body #agSearchModal .ag-search-backdrop{
  pointer-events:auto !important;
  cursor:pointer !important;
}

body #agSearchModal .ag-search-box{
  pointer-events:auto !important;
}

body #agSearchModal.ag-open{
  display:flex !important;
}

/* ===== STICKY HEADER RESTORE FINAL ===== */

/* Header/menu tetap ikut saat scroll */
header{
  position:sticky !important;
  top:0 !important;
  z-index:999999 !important;
  background:#fff !important;
  box-shadow:0 8px 26px rgba(7,25,54,.08) !important;
}

/* Pastikan isi header tetap rapi */
header .wrap{
  position:relative !important;
  z-index:2 !important;
}

/* Karena demo bar sudah dibuang, top langsung 0 */
.site-header,
.main-header,
.navbar{
  position:sticky !important;
  top:0 !important;
  z-index:999999 !important;
  background:#fff !important;
}

/* Mobile juga ikut sticky */
@media(max-width:600px){
  header{
    position:sticky !important;
    top:0 !important;
    z-index:999999 !important;
  }
}

/* ===== FIXED HEADER FINAL — MENU IKUT SCROLL ===== */

/* Header selalu nempel di atas */
header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:2147483000 !important;
  background:#fff !important;
  box-shadow:0 8px 26px rgba(7,25,54,.08) !important;
}

/* Kalau ada class header lain, paksa juga */
.site-header,
.main-header{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  z-index:2147483000 !important;
  background:#fff !important;
}

/* Supaya konten tidak ketutup header fixed */
body{
  padding-top:108px !important;
}

/* Header content tetap normal */
header .wrap{
  position:relative !important;
  z-index:2 !important;
}

/* Hilangkan efek sticky lama yang bisa bentrok */
.navbar{
  position:relative !important;
}

/* Mobile */
@media(max-width:600px){
  body{
    padding-top:118px !important;
  }

  header{
    position:fixed !important;
    top:0 !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
    z-index:2147483000 !important;
  }
}

/* ===== RESTORE HIDDEN TOPBAR + STICKY HEADER FINAL ===== */

/* Balikin topbar sebagai spacer, tapi tanpa tulisan */
.topbar.topbar-hidden,
.demo-bar.topbar-hidden{
  display:block !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  background:linear-gradient(90deg,#071936 0%,#d71920 100%) !important;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
}

/* Override patch fixed sebelumnya */
body{
  padding-top:0 !important;
}

/* Header/menu ikut scroll lagi */
header{
  position:sticky !important;
  top:0 !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:999999 !important;
  background:#fff !important;
  box-shadow:0 8px 26px rgba(7,25,54,.08) !important;
}

/* Jangan fixed */
.site-header,
.main-header{
  position:sticky !important;
  top:0 !important;
  left:auto !important;
  right:auto !important;
  width:100% !important;
  z-index:999999 !important;
  background:#fff !important;
}

/* Pastikan wrapper header tidak mengganggu sticky */
header .wrap{
  position:relative !important;
  z-index:2 !important;
}

/* Mobile */
@media(max-width:600px){
  body{
    padding-top:0 !important;
  }

  .topbar.topbar-hidden,
  .demo-bar.topbar-hidden{
    height:24px !important;
    min-height:24px !important;
    max-height:24px !important;
  }

  header{
    position:sticky !important;
    top:0 !important;
    z-index:999999 !important;
  }
}

/* ===== FINAL FIXED TOPBAR + HEADER ===== */

/* ruang konten agar tidak ketutup header fixed */
html body{
  padding-top:126px !important;
}

/* topbar gradient tetap ada tapi tanpa tulisan */
#siteTopbar.topbar-hidden{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  height:28px !important;
  min-height:28px !important;
  max-height:28px !important;
  display:block !important;
  padding:0 !important;
  margin:0 !important;
  overflow:hidden !important;
  background:linear-gradient(90deg,#071936 0%,#d71920 100%) !important;
  color:transparent !important;
  font-size:0 !important;
  line-height:0 !important;
  z-index:2147482998 !important;
}

/* header/menu selalu ikut scroll */
#siteHeader{
  position:fixed !important;
  top:28px !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
  background:#fff !important;
  z-index:2147482999 !important;
  box-shadow:0 8px 26px rgba(7,25,54,.08) !important;
}

/* pastikan header lama tidak override */
header#siteHeader,
body header#siteHeader{
  position:fixed !important;
  top:28px !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
}

/* isi header tetap rapi */
#siteHeader .wrap{
  position:relative !important;
  z-index:2 !important;
}

/* modal search harus tetap di atas header */
#agSearchModal{
  z-index:2147483647 !important;
}

#agSearchHitbox,
#agCloseHitbox{
  z-index:2147483647 !important;
}

/* Mobile */
@media(max-width:600px){
  html body{
    padding-top:122px !important;
  }

  #siteTopbar.topbar-hidden{
    height:24px !important;
    min-height:24px !important;
    max-height:24px !important;
  }

  #siteHeader,
  header#siteHeader,
  body header#siteHeader{
    position:fixed !important;
    top:24px !important;
    left:0 !important;
    right:0 !important;
    width:100% !important;
  }
}