.tph39-page{background:#f7faf8;padding:28px 0 48px}.tph39-title{display:flex;gap:14px;align-items:center}.tph39-title>span{font-size:42px}.tph39-title h1,.tph39-list-head h1,.tph39-detail h1{margin:0;color:#163b34}.tph39-title p,.tph39-list-head p{margin:5px 0;color:#64746f}.tph39-form-wrap{max-width:820px;margin:auto;background:#fff;border:1px solid #e1e9e6;border-radius:16px;padding:22px}.tph39-form{display:grid;gap:15px;margin-top:20px}.tph39-form label,.tph39-form fieldset{display:grid;gap:7px;font-weight:700;color:#29443d}.tph39-form input,.tph39-form textarea,.tph39-form select{width:100%;box-sizing:border-box;border:1px solid #cad7d2;border-radius:9px;padding:11px;font:inherit}.tph39-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.tph39-checks{display:flex;flex-wrap:wrap;gap:8px 14px}.tph39-checks label{display:flex;grid-template-columns:auto 1fr;align-items:center;font-weight:500}.tph39-checks input{width:auto}.tph39-submit,.tph39-add-btn,.tph39-bottom-cta a,.tph39-home-add a{display:inline-block;background:#118565;color:#fff!important;text-decoration:none;border:0;border-radius:9px;padding:11px 16px;font-weight:800}.tph39-success{margin-top:18px;background:#e8f7f1;padding:16px;border-radius:10px}.tph39-error{margin-top:12px;background:#fff0f0;color:#922;padding:12px;border-radius:9px}.tph39-hp{position:absolute!important;left:-9999px!important}.tph39-list-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}.tph39-kicker{font-size:12px;font-weight:900;color:#168565}.tph39-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.tph39-card,.tph39-home-card{background:#fff;border:1px solid #e1e8e5;border-radius:13px;overflow:hidden;text-decoration:none;color:#243c36}.tph39-card-photo,.tph39-home-photo{display:block;aspect-ratio:4/3;background:#e9efed}.tph39-card-photo img,.tph39-home-photo img{width:100%;height:100%;object-fit:cover}.tph39-card-body,.tph39-home-body{display:grid;gap:4px;padding:10px}.tph39-card-body strong,.tph39-home-body strong{font-size:15px}.tph39-card-body small,.tph39-home-body small{color:#148064}.tph39-card-body>span,.tph39-home-body>span{font-size:12px;color:#65736f;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.tph39-bottom-cta{text-align:center;background:#eaf6f1;border:1px solid #d6e9e1;border-radius:14px;padding:22px;margin-top:28px}.tph39-bottom-cta h2{margin:0 0 6px}.tph39-gallery{display:grid;grid-template-columns:2fr 1fr 1fr;gap:8px;margin:18px 0}.tph39-gallery img{width:100%;height:210px;object-fit:cover;border-radius:10px}.tph39-gallery img:first-child{grid-row:span 2;height:428px}.tph39-location{color:#148064}.tph39-desc{font-size:16px;line-height:1.8}.tph39-tags{display:flex;flex-wrap:wrap;gap:8px}.tph39-tags span{background:#edf6f2;padding:6px 10px;border-radius:999px}.tph39-info{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}.tph39-info>div{display:grid;gap:5px;background:#fff;border:1px solid #e3e9e7;padding:14px;border-radius:10px}.tph39-home{padding:34px 0;background:#fff}.tph39-home-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:14px}.tph39-home-head h2{margin:2px 0}.tph39-home-head p{margin:0;color:#6c7975}.tph39-home-track{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;padding-bottom:8px;-webkit-overflow-scrolling:touch}.tph39-home-card{flex:0 0 calc((100% - 48px)/5);scroll-snap-align:start}.tph39-home-nav{display:flex;justify-content:center;gap:8px;background:#eceff1;padding:5px 8px;border-radius:5px;margin-top:8px}.tph39-home-nav button{width:30px;height:30px;border:1px solid #cbd2d0;background:#fff;border-radius:7px}.tph39-home-add{text-align:center;margin-top:14px}.tph39-home-add small{display:block;margin-top:6px;color:#75817d}.tph39-empty{text-align:center;padding:30px;color:#687772}@media(max-width:850px){.tph39-grid{grid-template-columns:repeat(3,1fr)}.tph39-home-card{flex-basis:calc((100% - 24px)/3)}.tph39-info{grid-template-columns:1fr}.tph39-gallery{grid-template-columns:1fr 1fr}.tph39-gallery img,.tph39-gallery img:first-child{height:220px;grid-row:auto}}@media(max-width:650px){.tph39-page{padding-top:18px}.tph39-form-wrap{padding:16px}.tph39-two{grid-template-columns:1fr}.tph39-list-head{align-items:flex-start;flex-direction:column}.tph39-grid{grid-template-columns:repeat(2,1fr);gap:10px}.tph39-home-card{flex-basis:calc((100% - 10px)/2)}.tph39-home-head{align-items:flex-start}.tph39-home-head p{font-size:12px}.tph39-gallery{grid-template-columns:1fr}.tph39-gallery img,.tph39-gallery img:first-child{height:240px}}

/* TPH39G2 — article-like cafe headline overlay */
.tph39g2-home-card{text-decoration:none;color:inherit;background:#fff;border-radius:12px;overflow:hidden}
.tph39g2-media{position:relative;aspect-ratio:4/5;overflow:hidden;border-radius:12px 12px 0 0;background:#eaf3ef}
.tph39g2-media img,.tph39g2-noimage{width:100%;height:100%;display:block;object-fit:cover}
.tph39g2-noimage{display:flex;align-items:center;justify-content:center;font-size:36px}
.tph39g2-shade{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(5,15,13,.12) 5%,rgba(5,15,13,.08) 34%,rgba(5,15,13,.76) 100%);pointer-events:none}
.tph39g2-hook{position:absolute;left:10px;right:10px;top:10px;color:#fff;text-align:center;font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif;font-size:clamp(15px,1.55vw,23px);line-height:1.24;font-weight:800;text-shadow:0 2px 8px rgba(0,0,0,.74),0 1px 2px rgba(0,0,0,.9);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.tph39g2-place{position:absolute;left:10px;right:10px;bottom:10px;color:#fff;font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif;font-size:12px;font-weight:600;line-height:1.35;text-shadow:0 1px 5px rgba(0,0,0,.8)}
.tph39g2-card-foot{padding:9px 10px 11px}
.tph39g2-card-foot strong{display:block;font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif;font-size:14px;font-weight:700;line-height:1.35}
.tph39g2-card-foot span{display:block;margin-top:4px;font-size:11px;color:#678078}
.tph39-optional{font-weight:400;color:#71817c}
@media(max-width:650px){
  .tph39g2-hook{left:7px;right:7px;top:8px;font-size:14px;line-height:1.23}
  .tph39g2-place{left:7px;right:7px;bottom:8px;font-size:10.5px}
  .tph39g2-card-foot{padding:7px 8px 9px}
  .tph39g2-card-foot strong{font-size:12.5px}
}

/* TPH39H_CAFE_HOME_ALIGN_SQUARE_LARGER_HOOK */
.tph39-home{
  width:min(1180px,calc(100% - 32px));
  margin-left:auto!important;
  margin-right:auto!important;
  box-sizing:border-box;
}
.tph39g2-media{
  aspect-ratio:1 / 1!important;
}
.tph39g2-hook{
  font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif!important;
  font-size:clamp(19px,1.8vw,28px)!important;
  line-height:1.22!important;
  font-weight:800!important;
  left:12px!important;
  right:12px!important;
  top:12px!important;
  -webkit-line-clamp:3;
}
@media(max-width:850px){
  .tph39-home{
    width:calc(100% - 24px);
  }
  .tph39g2-hook{
    font-size:clamp(17px,3.2vw,22px)!important;
    left:10px!important;
    right:10px!important;
    top:10px!important;
  }
}
@media(max-width:650px){
  .tph39-home{
    width:calc(100% - 18px);
  }
  .tph39g2-media{
    aspect-ratio:1 / 1!important;
  }
  .tph39g2-hook{
    font-size:17px!important;
    line-height:1.2!important;
    left:8px!important;
    right:8px!important;
    top:8px!important;
  }
}

/* TPH39I2_CAFE_HOME_ALL_BUTTON_AND_HOOK_SIZE */
.tph39-home-all{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px!important;
  padding:0 13px!important;
  border:1px solid #07856d!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#08745f!important;
  font-family:"Noto Sans Thai","Leelawadee UI",Tahoma,Arial,sans-serif!important;
  font-size:12.5px!important;
  font-weight:700!important;
  line-height:1!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  box-sizing:border-box!important;
}
.tph39-home-all:hover{
  background:#eef9f5!important;
  color:#065f4e!important;
}

.tph39g2-hook{
  font-size:clamp(16px,1.45vw,22px)!important;
  line-height:1.22!important;
}

@media(max-width:850px){
  .tph39g2-hook{
    font-size:clamp(15px,2.7vw,19px)!important;
  }
}

@media(max-width:650px){
  .tph39-home-all{
    min-height:32px!important;
    padding:0 11px!important;
    font-size:11.5px!important;
  }
  .tph39g2-hook{
    font-size:14px!important;
    line-height:1.2!important;
  }
}
