/* ===== Module: Hero Section ===== */
.page-the-thao__hero-section{
  display:flex;
  flex-direction:column;
  background:linear-gradient(135deg, #ffffff 0%, #f0f8ff 100%);
  padding-top:10px;
  max-width:1200px;
  margin:0 auto;
}
.page-the-thao__hero-image-wrapper{
  width:100%;
  order:0;
  margin-bottom:0;
}
.page-the-thao__hero-image{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
  box-shadow:0 8px 30px rgba(38,169,224,0.15);
}
.page-the-thao__hero-content{
  width:100%;
  order:1;
  text-align:center;
  padding:20px 16px 16px;
}
.page-the-thao__hero-title{
  font-size:clamp(1.4rem, 2.8vw, 2.2rem);
  font-weight:800;
  color:#006a9e;
  line-height:1.25;
  letter-spacing:-0.01em;
  max-width:900px;
  margin:0 auto 12px;
  background:linear-gradient(90deg,#006a9e,#0d3d63);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}
.page-the-thao__hero-description{
  font-size:1.05rem;
  line-height:1.7;
  color:#333333;
  max-width:680px;
  margin:0 auto 20px;
  font-weight:400;
}
.page-the-thao__hero-actions{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:14px;
  width:100%;
  max-width:100%;
  overflow:hidden;
  box-sizing:border-box;
}
.page-the-thao__btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:12px 30px;
  border-radius:50px;
  font-weight:700;
  font-size:1rem;
  text-decoration:none;
  transition:all .25s ease;
  border:2px solid transparent;
}
.page-the-thao__btn--primary{
  background:#EA7C07;
  color:#ffffff;
  border-color:#EA7C07;
}
.page-the-thao__btn--primary:hover{
  background:#d46e03;
  color:#ffffff;
  transform:translateY(-2px);
  box-shadow:0 8px 20px rgba(234,124,7,0.3);
}
.page-the-thao__btn--secondary{
  background:#ffffff;
  color:#0477db;
  border-color:#0477db;
  white-space:normal;
  word-wrap:break-word;
  max-width:100%;
  box-sizing:border-box;
}
.page-the-thao__btn--secondary:hover{
  background:#e6f4ff;
  border-color:#045dab;
  color:#045dab;
}
.page-the-thao__btn--tertiary{
  background:#EA7C07;
  color:#fff;
  border-color:#EA7C07;
  white-space:normal;
  word-wrap:break-word;
  max-width:100%;
  box-sizing:border-box;
}
.page-the-thao__btn--tertiary:hover{
  background:#d46e03;
}
.page-the-thao__btn--quaternary{
  background:#ffffff;
  color:#0d3d63;
  border-color:#26A9E0;
  padding:10px 22px;
  font-size:.95rem;
}
.page-the-thao__btn--quaternary:hover{
  background:#e0f3fc;
  border-color:#1c8ab8;
}

/* ===== Module: Stats Section ===== */
.page-the-thao__stats-section{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:18px;
  background:#0d3d63;
  border-radius:16px;
  padding:18px 24px;
  max-width:1200px;
  margin:30px auto 0;
}
.page-the-thao__stat-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:4px;
}
.page-the-thao__stat-number{
  font-size:2rem;
  font-weight:800;
  color:#ffffff;
  line-height:1;
}
.page-the-thao__stat-label{
  font-size:.9rem;
  color:#d0e8f5;
}

/* ===== Module: Intro Section ===== */
.page-the-thao__section{
  padding:44px 0 48px;
}
.page-the-thao__container{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}
.page-the-thao__section-title{
  font-size:clamp(1.3rem, 2.2vw, 2rem);
  font-weight:800;
  color:#0d3d63;
  text-align:center;
  margin-bottom:16px;
  line-height:1.4;
}
.page-the-thao__section-lead{
  font-size:1.1rem;
  line-height:1.8;
  color:#222;
  text-align:center;
  max-width:850px;
  margin:0 auto 18px;
}
.page-the-thao__container p{
  color:#333333;
  font-size:1rem;
  line-height:1.7;
  margin-bottom:1.2em;
}
.page-the-thao__section--light{
  background:#ffffff;
}
.page-the-thao__section--dark{
  background:linear-gradient(135deg,#0d3d63 0%,#092b47 100%);
  color:#f5faff;
}
.page-the-thao__section--dark .page-the-thao__section-title{
  color:#ffffff;
}
.page-the-thao__section--dark p{
  color:#e6f2f9;
}
.page-the-thao__section-title--light-text{
  color:#ffffff !important;
}
.page-the-thao__emphasis{
  background:rgba(255,255,255,.1);
  border-left:4px solid #26A9E0;
  padding:16px 22px;
  border-radius:0 12px 12px 0;
  margin:22px 0;
  font-style:italic;
  line-height:1.7;
}

/* ===== Module: Logo / Partner Grid ===== */
.page-the-thao__logo-section{
  display:flex;
  flex-wrap:wrap;
  padding:50px 0 30px;
  background:#ffffff;
}
.page-the-thao__container--logo{
  max-width:1400px;
  margin:0 auto;
}
.page-the-thao__logo-section-title{
  text-align:center;
  color:#0d3d63;
  font-size:clamp(1.2rem, 2vw, 1.9rem);
  font-weight:800;
  margin-bottom:20px;
}
.page-the-thao__logo-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:12px 16px;
  justify-items:center;
  max-width:1200px;
  margin:0 auto;
}
.page-the-thao__logo-item{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:12px;
  max-width:280px;
  width:100%;
  background:#ffffff;
  border:1px solid #e6f0f8;
  border-radius:14px;
  padding:14px 12px;
  box-shadow:0 4px 12px rgba(38,169,224,0.08);
  transition:transform .3s;
}
.page-the-thao__logo-item:hover{
  transform:translateY(-6px);
}
.page-the-thao__logo-item span{
  font-weight:700;
  font-size:1.1rem;
  color:#0d3d63;
}
.page-the-thao__logo-image{
  width:100%;
  height:auto;
  object-fit:contain;
  border-radius:8px;
  max-width:100%;
}
.page-the-thao__logo-cta{
  padding:9px 20px;
  border-radius:999px;
  background:#0477db;
  color:#ffffff;
  font-weight:700;
  text-decoration:none;
  transition:background .2s;
  width:auto;
  text-align:center;
  box-sizing:border-box;
  max-width:100%;
}
.page-the-thao__logo-cta:hover{
  background:#0d3d63;
}
.page-the-thao__logo-item:nth-child(5){
  grid-column:2;
}
.page-the-thao__logo-item:nth-child(6){
  grid-column:3;
}

/* ===== Module: Guide Section ===== */
.page-the-thao__guide-section{
  background:#f7fbff;
  padding:50px 0 40px;
}
.page-the-thao__guide-inner{
  max-width:1200px;
  margin:0 auto;
  padding:0 16px;
}
.page-the-thao__guide-title{
  text-align:center;
  color:#0d3d63;
  font-size:clamp(1.3rem,2.2vw,2rem);
  font-weight:800;
  margin-bottom:22px;
}
.page-the-thao__guide-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:24px;
}
.page-the-thao__guide-figure{
  background:#ffffff;
  border-radius:16px;
  padding:0;
  overflow:hidden;
  box-shadow:0 4px 16px rgba(13,61,99,0.1);
  border:1px solid #e6f0f8;
  margin:0;
  display:flex;
  flex-direction:column;
}
.page-the-thao__guide-figure img{
  width:100%;
  height:auto;
  display:block;
}
.page-the-thao__guide-figure figcaption{
  font-weight:700;
  font-size:1.1rem;
  color:#0477db;
  padding:14px 16px 0;
}
.page-the-thao__guide-figure p{
  font-size:0.95rem;
  color:#333333;
  line-height:1.6;
  padding:10px 16px;
  flex-grow:1;
}
.page-the-thao__guide-figure .page-the-thao__btn{
  margin:4px 16px 16px;
  align-self:center;
}
.page-the-thao__logo-section{
  padding:60px 0 30px;
}
.page-the-thao__logo-section .page-the-thao__container{
  width:100%;
  max-width:1200px;
}

/* ===== Responsive Styles ===== */
@media (max-width: 1024px){
  .page-the-thao__logo-grid{
    grid-template-columns:repeat(2,1fr);
  }
  .page-the-thao__logo-item{
    max-width:300px;
    width:100%;
  }
}
@media (max-width: 768px){
  .page-the-thao__hero-section{
    padding-top:10px;
  }
  .page-the-thao__hero-content .page-the-thao__btn{
    width:auto;
  }
  .page-the-thao__stats-section{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
    padding:16px;
  }
  .page-the-thao__section{
    padding:32px 0;
  }
  .page-the-thao__section--dark .page-the-thao__btn--tertiary{
    width:auto;
    max-width:100%;
    box-sizing:border-box;
  }
  .page-the-thao__logo-grid{
    grid-template-columns:repeat(2,1fr);
    gap:12px;
  }
  .page-the-thao__logo-item:nth-child(5), .page-the-thao__logo-item:nth-child(6){
    grid-column:auto;
  }
  .page-the-thao__guide-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .page-the-thao__btn{
    padding:10px 16px;
    font-size:0.95rem;
  }
  .page-the-thao__stat-number{
    font-size:1.4rem;
  }
  .page-the-thao img{
    max-width:100% !important;
    height:auto !important;
  }
  .page-the-thao__container{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    box-sizing:border-box;
    padding-left:16px;
    padding-right:16px;
  }
  .page-the-thao__content-area{
    max-width:100%;
    overflow-x:hidden;
  }
  .page-the-thao__guide-figure .page-the-thao__btn,
  .page-the-thao__logo-cta{
    max-width:100%;
    box-sizing:border-box;
    white-space:normal;
    word-wrap:break-word;
  }
  .page-the-thao__logo-item{
    padding:10px;
  }
}