/* nt-jia1-site（MK143）：健康小學堂卡片 [nt_jia1_posts]，照甲1 blog.html（精選大卡＋三欄卡）、index.html（首頁 6 張）。
   第 2 段是從甲1 樣稿抽出來的規則（過程/MK143/甲1_文章卡_抽出.css，順序照原檔 site.css → site_甲.css → site_甲1.css）；
   要改顏色、字級、間距改第 2 段那一行；字在 inc/strings.php 'posts'。 */

/* ── 0. 外框：Elementor 短代碼元件撐滿所在容器 ── */
.elementor-widget-shortcode:has(> .elementor-widget-container .nt-jp),.elementor-widget-shortcode:has(> .elementor-shortcode > .nt-jp){width:100%;max-width:none;align-self:stretch}
.nt-jp{display:block;width:100%}
/* 健康小學堂列表（1908）放卡片的容器＝甲1 section.sec：≤900 上下 48px。裡面那層（.e-con-inner）已經是 48px，
   外層 Elementor 容器原本是配舊卡片設的（平板 24、手機 8）→ 外層上下歸零、裡面那層固定 48px */
@media (max-width:900px){
  .e-con.nt-blog:has(.nt-jp){padding-top:0!important;padding-bottom:0!important}
  .e-con.nt-blog:has(.nt-jp) > .e-con-inner{padding-top:48px!important;padding-bottom:48px!important}
}

/* ── 1. 歸零：Blocksy、Elementor、附加 CSS 的樣式不帶進來（跟甲1 一樣從瀏覽器預設開始）。圖不歸零 ── */
.nt-jp.nt-jp.nt-jp :where(div,span,h2,h3,p,a){all:revert}
.nt-jp,.nt-jp *{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}

/* ── 2. 甲1 原樣 ── */
.nt-jp.nt-jp.nt-jp{--ink: #123C35; --leaf: #036648; --box: #02A290; --sun: #E7B130; --mist: #EEF5F1; --paper: #FFFFFF; --cream: #FBF8F2; --line: #D6E3DC; --muted: #56675F; --pend: #FFF3C7; --pend-line: #D9A21B; --tbd: #FDEBD3; --f-body: "Noto Sans TC","PingFang TC","Heiti TC","Microsoft JhengHei",sans-serif; --f-num: "Jost","Noto Sans TC",sans-serif; --r: 14px; --wrap: 1160px; color-scheme: light;}
.nt-jp.nt-jp.nt-jp *{box-sizing: border-box;}
.nt-jp.nt-jp.nt-jp{text-size-adjust: 100%;}
.nt-jp.nt-jp.nt-jp{margin: 0px; color: var(--ink); font-family: var(--f-body); font-size: 16px; line-height: 1.75; letter-spacing: 0.02em;}
.nt-jp.nt-jp.nt-jp img{max-width: 100%; height: auto; display: block;}
.nt-jp.nt-jp.nt-jp a{color: inherit;}
.nt-jp.nt-jp.nt-jp h2,.nt-jp.nt-jp.nt-jp h3{line-height: 1.35; text-wrap: balance; margin: 0px; font-weight: 700; letter-spacing: 0.03em;}
.nt-jp.nt-jp.nt-jp p{margin: 0px;}
.nt-jp.nt-jp.nt-jp .btn{display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 52px; padding: 0px 28px; border-radius: 999px; font-weight: 700; font-size: 1.02rem; text-decoration: none; border: 2px solid transparent; cursor: pointer; font-family: inherit; letter-spacing: 0.06em; transition: transform 0.15s, background 0.15s;}
.nt-jp.nt-jp.nt-jp .btn:hover{transform: translateY(-1px);}
.nt-jp.nt-jp.nt-jp .btn:focus-visible,.nt-jp.nt-jp.nt-jp a:focus-visible{outline: 3px solid var(--sun); outline-offset: 2px;}
.nt-jp.nt-jp.nt-jp .btn-line{background: transparent; border-color: var(--ink); color: var(--ink);}
.nt-jp.nt-jp.nt-jp .arrow::after{content: "→"; font-family: var(--f-num);}
.nt-jp.nt-jp.nt-jp .posts{display: grid; grid-template-columns: repeat(3, minmax(0px, 1fr)); gap: 24px;}
.nt-jp.nt-jp.nt-jp .post{text-decoration: none; display: grid; gap: 12px; align-content: start;}
.nt-jp.nt-jp.nt-jp .post img{aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--r); width: 100%;}
.nt-jp.nt-jp.nt-jp .post .meta{font-family: var(--f-num); font-size: 0.82rem; color: var(--muted); letter-spacing: 0.06em;}
.nt-jp.nt-jp.nt-jp .post h3{font-size: 1.06rem;}
.nt-jp.nt-jp.nt-jp .post p{font-size: 0.9rem; color: var(--muted);}
@media (max-width: 900px){.nt-jp.nt-jp.nt-jp .posts{grid-template-columns: 1fr;}}
@media (prefers-reduced-motion: reduce){.nt-jp.nt-jp.nt-jp *{transition: none !important;}}
.nt-jp.nt-jp.nt-jp{--ink: #183D39; --leaf: #14685B; --box: #54B293; --mist: #EEF8F4; --cream: #F4FBF8; --snow: #FAFCFB; --line: #D7EDE4; --muted: #557069; --r: 24px; --glow: 0 18px 44px rgba(84,178,147,.20); --glow-s: 0 10px 26px rgba(20,104,91,.10);}
.nt-jp.nt-jp.nt-jp .btn{min-height: 54px;}
.nt-jp.nt-jp.nt-jp .btn-line{border-color: var(--box); color: var(--leaf); background: rgb(255, 255, 255);}
.nt-jp.nt-jp.nt-jp .post .meta{font-family: var(--f-body);}
.nt-jp.nt-jp.nt-jp .post img{border-radius: 22px;}
.nt-jp.nt-jp.nt-jp .post h3{transition: color 0.15s;}
.nt-jp.nt-jp.nt-jp .post:hover h3{color: var(--leaf);}
.nt-jp.nt-jp.nt-jp .t-featured{display: grid; grid-template-columns: minmax(0px, 1.15fr) minmax(0px, 1fr); align-items: center; margin-bottom: 48px;}
.nt-jp.nt-jp.nt-jp .t-featured img{border-radius: 32px; aspect-ratio: 4 / 3; box-shadow: rgba(20, 104, 91, 0.14) 0px 30px 60px;}
.nt-jp.nt-jp.nt-jp .t-featured-txt{background: rgb(255, 255, 255); border-radius: 28px; padding: 36px 38px; margin-left: -60px; box-shadow: var(--glow); display: grid; gap: 12px; position: relative;}
.nt-jp.nt-jp.nt-jp .t-featured-txt h2{font-size: 1.7rem;}
.nt-jp.nt-jp.nt-jp .t-featured-txt .btn{justify-self: start;}
.nt-jp.nt-jp.nt-jp .t-posts .post{background: rgb(255, 255, 255); border-radius: 24px; box-shadow: var(--glow-s); overflow: hidden; gap: 0px; transition: box-shadow 0.2s, transform 0.2s;}
.nt-jp.nt-jp.nt-jp .t-posts .post:hover{box-shadow: var(--glow); transform: translateY(-3px);}
.nt-jp.nt-jp.nt-jp .t-posts .post img{border-radius: 0px;}
.nt-jp.nt-jp.nt-jp .post-txt{display: grid; gap: 8px; padding: 18px 22px 22px;}
@media (max-width: 900px){.nt-jp.nt-jp.nt-jp .t-featured{grid-template-columns: 1fr; gap: 24px;}}
@media (max-width: 900px){.nt-jp.nt-jp.nt-jp .t-featured-txt{margin: -48px 14px 0px; padding: 26px 22px; font-size: 1rem;}}
.nt-jp.nt-jp.nt-jp.nt-jp .t-posts{gap: 22px;}
.nt-jp.nt-jp.nt-jp.nt-jp .t-featured img{border-radius: 46% 54% 42% 58% / 55% 45%; border: 8px solid rgba(255, 255, 255, 0.8);}
@media (max-width: 900px){.nt-jp.nt-jp.nt-jp.nt-jp .t-featured img{border-radius: 28px;}}
.nt-jp.nt-jp.nt-jp{--leaf: #2A8468; --mist: #EAF5EF; --cream: #F3FAF6; --snow: #F7FBF9; --line: #CFE7DB; --glow: 0 18px 44px rgba(84,178,147,.24); --glow-s: 0 10px 26px rgba(84,178,147,.18);}
.nt-jp.nt-jp.nt-jp .t-featured img{box-shadow: rgba(84, 178, 147, 0.26) 0px 30px 60px;}
.nt-jp.nt-jp.nt-jp.nt-jp h2{color: rgb(20, 104, 91);}
.nt-jp.nt-jp.nt-jp.nt-jp .arrow::after{content: none;}
@media (min-width: 601px) and (max-width: 900px){.nt-jp.nt-jp.nt-jp.nt-jp .mk126-posts .posts{grid-template-columns: repeat(2, minmax(0px, 1fr));}}
@media (max-width: 600px){.nt-jp.nt-jp.nt-jp.nt-jp .mk126-posts .posts{grid-template-columns: 1fr;}}
.nt-jp.nt-jp.nt-jp.nt-jp :is(summary, .btn, button, nav a, nav li){text-wrap-style: balance;}
.nt-jp.nt-jp.nt-jp.nt-jp .t-featured h2{word-break: keep-all; overflow-wrap: anywhere;}