/* HC V11.3.4 — REAL MOBILE HOMEPAGE PATCH, not a mockup.
 * Single continuous Hero background with HTML content floating over it.
 * Intentionally placed AFTER CSS V11.3.3; stronger selectors override legacy !important rules.
 * No HTML copy and no image generation. Uses existing admin-uploaded artwork and links.
 */
@media (max-width:700px) {
  /* Premium mobile header: affects site chrome only, not menus or handlers */
  body .site-header { border-bottom:1px solid rgba(247,200,94,.34); background:#030c1b; }
  body .site-header .nav { min-height:65px; }
  body .site-header .brand img { max-height:57px; width:auto; max-width:min(160px,48vw); object-fit:contain; }
  body .site-header .menu-toggle { border:1px solid #dfb856; border-radius:14px; background:#061527; min-width:46px;min-height:46px; }
  body .site-header .menu-toggle span { background:#ffe6a1; }
  /* Rebuild mobile Hero as one composite with a real image + layered gradient.
     Avoid object-fit:cover on an entire 420px source stretched to 570px. */
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on {
    position:relative!important; display:flex!important; flex-direction:column!important;
    align-items:stretch!important; justify-content:flex-end!important;
    width:100%!important; box-sizing:border-box!important;
    min-height:0!important; height:auto!important;
    padding:0!important; margin:12px auto 23px!important;
    overflow:hidden!important; isolation:isolate!important;
    border:0!important; outline:0!important; border-radius:18px!important;
    box-shadow:none!important;
    background:var(--hc1133-panel-bottom,#09172d)!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-media {
    position:absolute!important; inset:0 0 0!important;
    display:block!important; z-index:0!important;
    width:100%!important; height:100%!important;
    min-height:0!important; margin:0!important; border:0!important;
    background:linear-gradient(180deg,#07172e 0%,#0c2446 48%,#071529 100%)!important;
  }
  /* Use image only in upper 59% so the entire subject/dragon/tiger composition stays visible. */
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-media .hc-hero-v11-picture {
    position:absolute!important; inset:0!important; width:100%!important; height:100%!important;
    overflow:hidden!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-media .hc-hero-v11-picture>img,
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-media .hc-v11-motion {
    position:absolute!important;top:0!important;left:0!important;bottom:auto!important;right:auto!important;
    display:block!important;width:100%!important;height:58%!important;
    object-fit:cover!important;object-position:center 35%!important;
    border:0!important;border-radius:0!important;
    filter:brightness(var(--hc1133-mobile-bright,1.2)) saturate(var(--hc1133-mobile-sat,1.35)) contrast(var(--hc1133-mobile-contrast,1.05))!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-media::after {
    display:none!important;
  }
  /* One transparent gradient over image AND text area: no rectangle seam or dark glued-on card. */
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-shade,
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on.hc-v113-overlay-soft .hero-shade,
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on.hc-v113-overlay-strong .hero-shade {
    position:absolute!important; display:block!important; inset:0!important; z-index:1!important;
    background:linear-gradient(180deg,
      rgba(2,8,22,0) 0%,rgba(2,8,22,0) 24%,
      rgba(4,13,35,.08) 37%,rgba(3,12,31,.52) 48%,
      rgba(5,17,39,.89) 60%,rgba(5,17,39,.99) 84%,
      var(--hc1133-panel-bottom,#09172d) 100%)!important;
    pointer-events:none!important;border:0!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner.hc-v113-panel,
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on.hc-v113-width-42 .hero-inner.hc-v113-panel,
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on.hc-v113-width-50 .hero-inner.hc-v113-panel {
    display:flex!important; flex-direction:column!important; align-items:center!important;
    justify-content:flex-end!important; align-self:stretch!important;
    position:relative!important;z-index:3!important;
    width:100%!important;max-width:none!important;min-width:0!important;
    min-height:clamp(445px,120vw,550px)!important;
    box-sizing:border-box!important;flex:none!important;
    margin:0!important; padding:clamp(195px,55vw,258px) 15px 22px!important;
    text-align:center!important;
    background:transparent!important; border:0!important; outline:0!important;
    border-radius:0!important; box-shadow:none!important;
    backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .eyebrow {
    display:none!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .hc-v113-brand {
    align-self:center!important; margin:0 0 7px!important; padding:0!important;
    font-size:clamp(16px,4.5vw,20px)!important;line-height:1.35!important;
    font-weight:800!important;color:#FFE9A2!important;
    text-shadow:0 2px 7px #041028,0 0 15px rgba(255,210,97,.20)!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner h1 {
    max-width:100%!important;margin:0!important;padding:1px 1px 5px!important;
    font-size:clamp(27px,7.5vw,38px)!important;line-height:1.24!important;
    text-align:center!important;white-space:normal!important;overflow-wrap:normal!important;
    font-weight:900!important;letter-spacing:0!important;
    color:#FFE8A5!important;
    background-image:linear-gradient(180deg,#FFFBE6 2%,#FFECA5 27%,#FFD061 55%,#FFBD37 74%,#F7E3AB 100%)!important;
    -webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;
    -webkit-text-stroke:.28px rgba(87,45,10,.36)!important;
    text-shadow:none!important;
    filter:drop-shadow(0 2px 1px rgba(70,35,0,.85)) drop-shadow(0 5px 9px rgba(0,0,0,.75))!important;
    text-wrap:balance;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .hc-v113-desc {
    width:100%!important;max-width:33em!important;margin:8px 0 0!important;padding:0!important;
    display:block!important;overflow:visible!important;
    font-size:clamp(12px,3.6vw,14px)!important;line-height:1.56!important;
    -webkit-line-clamp:unset!important;color:#F8FAFF!important;
    font-weight:450!important;text-align:center!important;
    text-shadow:0 2px 7px rgba(0,0,0,.72)!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .actions {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    width:100%!important;gap:10px!important;margin:18px 0 0!important;justify-content:center!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .actions .btn {
    box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important;
    width:100%!important;min-width:0!important;min-height:50px!important;
    padding:10px 8px!important;border-radius:14px!important;
    font-size:clamp(12px,3.3vw,15px)!important;line-height:1.3!important;
    white-space:normal!important;text-align:center!important;
    text-decoration:none!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .actions .btn.gold {
    color:#2a1a00!important;background:linear-gradient(135deg,#FFF2B4,#FFDB69 50%,#E6AB37)!important;
    border:1px solid #FFE3A3!important;box-shadow:0 5px 20px rgba(235,173,47,.32),inset 0 1px 0 rgba(255,255,255,.65)!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .actions .btn.ghost {
    color:#FFE9A8!important;background:rgba(5,16,38,.76)!important;
    border:1px solid #EEC463!important;box-shadow:0 5px 20px rgba(0,0,0,.26)!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner .actions .btn:focus-visible {
    outline:3px solid #fff5d5!important;outline-offset:3px!important;
  }
  /* Homepage articles: real existing cards displayed as a touch-scroll row. */
  .hc-v1134-articles { padding:17px 0 24px!important; }
  .hc-v1134-articles .section-head {align-items:center;gap:10px;margin-bottom:14px}
  .hc-v1134-articles .section-head h2 {font-family:"Kanit","Noto Sans Thai",sans-serif;font-size:clamp(23px,6.3vw,30px);line-height:1.22;letter-spacing:0}
  .hc-v1134-articles .section-head>a {border:1px solid rgba(255,209,100,.6);border-radius:999px;display:inline-flex;align-items:center;justify-content:center;padding:7px 12px;min-height:37px;white-space:nowrap}
  .hc-v1134-articles .card-grid {
    display:grid!important;grid-template-columns:none!important;
    grid-auto-flow:column!important;grid-auto-columns:minmax(160px,57%)!important;
    gap:12px!important;overflow-x:auto!important;overscroll-behavior-x:contain;
    scroll-snap-type:x mandatory;scrollbar-width:thin;
    padding:1px 0 12px!important; -webkit-overflow-scrolling:touch;
  }
  .hc-v1134-articles .post-card {min-width:0; scroll-snap-align:start; overflow:hidden; border-color:rgba(184,137,49,.36)}
  .hc-v1134-articles .post-card>a img {aspect-ratio:4/3;object-fit:cover;}
  .hc-v1134-articles .post-card .pad {padding:10px 11px 13px}
  .hc-v1134-articles .post-card .meta {font-size:10px;line-height:1.3}
  .hc-v1134-articles .post-card h3 {font-size:14px;line-height:1.38;margin:5px 0 3px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
  .hc-v1134-articles .post-card .pad>p {display:none}
}
@media (max-width:350px){
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner.hc-v113-panel{
    min-height:470px!important;padding:208px 12px 18px!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner h1{
    font-size:26px!important;
  }
  .hc-v1134-articles .card-grid{grid-auto-columns:minmax(148px,68%)!important;}
}
@media (min-width:701px){
  /* Desktop remains full-bleed artwork with real HTML text in the right column */
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner.hc-v113-panel {
    border:0!important;background:transparent!important;box-shadow:none!important;
    text-align:center!important;
  }
  .hero.hc-hero-v112.hc-hero-v113.hc-v113-on.hc-v1133-on.hc-v1134-on .hero-inner.hc-v113-panel .actions{justify-content:center!important;}
}
@media (prefers-reduced-motion:reduce){
  .hero.hc-v1134-on .hero-media .hc-v11-motion {display:none!important;}
}