/* =========================
   RealDev – Trang chủ
   ========================= */
:root{
  --rd-gap:26px;
  --rd-radius:16px;
  --rd-shadow:0 10px 26px rgba(24,39,75,.06),0 2px 6px rgba(24,39,75,.05);
  --rd-ink:#0f172a;
  --rd-muted:#667085;
  --rd-chip:#2563eb;
  --rd-chip-bg:#eef4ff;
  --rd-border:#eef2f7;
  --rd-primary:#1a63ff;
  --rd-bg:#f6f8fb;
}

/* Container + Section head */
.rd-container{max-width:1220px;margin:0 auto;padding:0 18px}
.rd-section{padding:40px 0}
.rd-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:18px}
.rd-title{margin:0;font-weight:800;font-size:28px;color:var(--rd-ink)}
.rd-more{font-weight:700;color:#1d4ed8;text-decoration:none}
.rd-more::after{content:" ↗"}

/* ===== GRID ===== */
.rd-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--rd-gap)}
@media (max-width:1100px){.rd-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:720px){.rd-grid{grid-template-columns:1fr}}

/* ===== CARD BÀI VIẾT ===== */
.rd-card{
  background:#fff;border:1px solid var(--rd-border);border-radius:var(--rd-radius);
  box-shadow:var(--rd-shadow);display:grid;grid-template-columns:130px 1fr;gap:18px;
  align-items:center;padding:18px 20px;min-height:140px
}
.rd-card .rd-thumb{width:130px;aspect-ratio:1/1;border-radius:12px;overflow:hidden;display:block}
.rd-card .rd-thumb img{width:100%;height:100%;object-fit:cover}
.rd-body{display:flex;flex-direction:column;gap:8px}
.rd-meta{display:flex;gap:10px;align-items:center;margin-bottom:4px;font-size:12px;color:var(--rd-muted)}
.rd-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:12px;font-size:13px;font-weight:600;background:var(--rd-chip-bg);color:var(--rd-chip)}
.rd-date{font-size:12px;color:var(--rd-muted)}
.rd-post-title{margin:0;font-weight:800;font-size:19px;line-height:1.35}
.rd-post-title a{color:var(--rd-ink);text-decoration:none}
.rd-post-title a:hover{color:#0ea5e9}
.rd-link{margin-top:auto;font-weight:700;font-size:14px;color:#2563eb;text-decoration:none;
  border-bottom:2px solid rgba(37,99,235,.15);padding-bottom:2px;display:inline-flex;align-items:center;gap:6px}
.rd-link::after{content:"→"}
.rd-link:hover{border-color:#2563eb;transform:translateY(-1px)}

/* Responsive card */
@media (max-width:720px){
  .rd-card{grid-template-columns:110px 1fr;padding:16px}
  .rd-card .rd-thumb{width:110px}
  .rd-post-title{font-size:17px}
}

/* ===== DỊCH VỤ ===== */
.rd-services{padding:24px 0 40px;background:#f5fbff}
.rd-services-head{display:flex;justify-content:center;align-items:center;gap:12px;margin-bottom:20px}
.rd-services-head h2{margin:0;font-weight:900;font-size:22px;color:#0f3f67}
.rd-services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.rd-service{
  text-align:center;background:#fff;border:1px solid #edf2f7;border-radius:18px;
  padding:28px 22px;box-shadow:var(--rd-shadow);text-decoration:none;color:#0f172a;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:330px
}
.rd-s-ico{width:136px;height:136px;border-radius:20px;display:grid;place-items:center;margin-bottom:4px}
.rd-s-ico img{width:100%;height:100%;object-fit:contain}
.rd-service h3{margin:6px 0 0;font-size:20px;font-weight:800}
.rd-cta{margin-top:6px;font-weight:700;color:#0f82ff;text-decoration:none}
.rd-cta::after{content:" →"}
@media (max-width:768px){
  .rd-services .rd-service{padding:18px 14px;gap:8px;min-height:280px}
  .rd-services .rd-s-ico{width:60px;height:60px;border-radius:16px}
  .rd-services h3{font-size:16px}
}

/* =========================
   Category / Archive
   ========================= */
body.archive.category #secondary,
body.archive.category .sidebar { display:none !important }
body.archive.category .content-area{width:100%!important;max-width:100%!important;flex:0 0 100%!important}
body.archive.category .row { margin-left:0;margin-right:0 }

/* Header */
body.archive.category .page-title h1{
  font-weight:800;font-size:clamp(26px,2.3vw,36px);line-height:1.15;color:var(--rd-ink);margin:0 0 6px
}
body.archive.category .page-title .breadcrumbs{font-size:13px;color:var(--rd-muted)}

/* Description box */
body.archive .term-description{
  background:#fff;border:1px solid #eef2f7;border-radius:var(--rd-radius);box-shadow:var(--rd-shadow);
  padding:20px 22px;margin-top:12px;color:var(--rd-ink);line-height:1.7
}

/* Grid 2-2-1 */
body.archive.category .rd-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
@media (max-width:900px){body.archive.category .rd-grid{grid-template-columns:1fr}}

/* Pagination */
.rd-pagination{display:flex;justify-content:center;margin:28px 0 10px}
.rd-pagination .page-numbers{display:inline-flex;min-width:40px;height:40px;align-items:center;justify-content:center;
  border:1px solid #dbe3f1;border-radius:8px;background:#fff;color:#334155;font-weight:600;text-decoration:none}
.rd-pagination .page-numbers.current{background:#2f61d9;color:#fff;border-color:#2f61d9}

/* Fix footer */
.archive #footer{background:#fff!important;color:#111!important;position:relative!important}

/* =========================
   Single Post
   ========================= */
.blog-single .entry-header .entry-title{font-weight:800;line-height:1.15;text-shadow:0 2px 10px rgba(15,23,42,.08)}
.blog-single .entry-content h2{margin:1.2em 0 .6em;padding-bottom:.2em;border-bottom:2px solid #eef2f7;font-weight:800}
.blog-single .entry-content p{line-height:1.75;font-size:17px}
.service-box:nth-child(1)::before {
    content: "\f001"; /* icon fa-music */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 40px;
    display: block;
    margin-bottom: 15px;
    color: #3a6cf4;
}

.service-box:nth-child(2)::before {
    content: "\f0f2"; /* icon fa-pen-nib */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 40px;
    display: block;
    margin-bottom: 15px;
    color: #f76c6c;
}

.service-box:nth-child(3)::before {
    content: "\f001"; /* icon fa-piano-keyboard */
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    font-size: 40px;
    display: block;
    margin-bottom: 15px;
    color: #28a745;
}
.rd-s-ico img {
  width: 64px;   /* chỉnh theo nhu cầu */
  height: 64px;  /* có thể để auto nếu muốn theo tỉ lệ gốc */
  object-fit: contain;
  margin: 0 auto 15px;
  display: block;
}
.blog-archive .box .box-image,
.blog-archive .box .image-cover { display:block !important; height:auto !important; }
.blog-archive .box .box-image img { opacity:1 !important; visibility:visible !important; width:100%; height:auto; }
/* Ảnh đại diện archive/blog */
.box-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.box-image {
  overflow: hidden;
  border-radius: 6px;
}
/* Ổn định khung ảnh và text trong grid */
.box-image { overflow:hidden; border-radius:6px; }
.box-image img { width:100%; height:100%; object-fit:cover; display:block; }

/* Tránh chữ bị “bẻ” từng ký tự dọc */
.post-title, .from_the_blog_excerpt { word-break: normal; overflow-wrap: anywhere; }
/* Ảnh đại diện dạng cover, bo góc nhẹ */
.rd-box-image { position: relative; overflow: hidden; border-radius: 8px; }
.rd-box-image .rd-thumb { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Chỉ giữ danh mục + tiêu đề, tránh bẻ chữ dọc */
.rd-cat a { text-transform: uppercase; letter-spacing: .02em; }
.post-title, .rd-cat { word-break: normal; overflow-wrap: anywhere; }


.rd-cat-grid .box-image { position: relative; overflow: hidden; border-radius: 8px; }
.rd-cat-grid .box-image img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Chống “chữ dọc / bẻ ký tự” */
.rd-cat-grid .post-title,
.rd-cat-grid .post-title a,
.rd-cat-grid .box-text,
.rd-cat-grid .badge, 
.rd-cat-grid .entry-meta {
  writing-mode: initial !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}


/* Nhẹ nhàng phần danh mục */
.rd-cat-grid .badge { text-transform: uppercase; letter-spacing:.02em; opacity:.75; }

/* Khoảng cách gọn gàng */
.rd-cat-grid .box .box-text .post-title { margin-top:.35rem; margin-bottom:.5rem; }
/* Ảnh cover & không bể layout */
.rd-box-image{position:relative;overflow:hidden;border-radius:8px;}
.rd-box-image .rd-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;}

/* Chống bẻ chữ dọc */
.archive .post-title, .archive .post-title a, .archive .box-text, .archive .rd-cat{
  word-break: normal !important; overflow-wrap: /* Dọn mô tả/ảnh dư ở header archive (nếu có) */
.archive .archive-description,
.archive .archive-description * ,
.archive .page-header img { display:none !important; }

/* Khung ảnh cover, bo góc – không méo */
.rd-box-image{ position:relative; overflow:hidden; border-radius:10px; }
.rd-box-image .rd-thumb{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Chữ không bẻ dọc */
.archive .post-title,
.archive .post-title a,
.archive .box-text,
.archive .rd-cat{
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Danh mục gọn */
.rd-cat a{ text-transform:uppercase; letter-spacing:.02em; opacity:.8; }anywhere !important; white-space: normal !important;
}



/* Khung ảnh cover, bo góc – không méo */
.rd-box-image{ position:relative; overflow:hidden; border-radius:10px; }
.rd-box-image .rd-thumb{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Chữ không bẻ dọc */
.archive .post-title,
.archive .post-title a,
.archive .box-text,
.archive .rd-cat{
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Danh mục gọn */
.rd-cat a{ text-transform:uppercase; letter-spacing:.02em; opacity:.8; }
/*
Theme Name: Flatsome Child – Clean Fix
Template: flatsome
Version: 1.0
*/


/* Khung ảnh cover, bo góc – không méo */
.rd-box-image{ position:relative; overflow:hidden; border-radius:10px; }
.rd-box-image .rd-thumb{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }

/* Chữ không bẻ dọc */
.archive .post-title,
.archive .post-title a,
.archive .box-text,
.archive .rd-cat{
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Danh mục gọn */
.rd-cat a{ text-transform:uppercase; letter-spacing:.02em; opacity:.8; }

/* Fallback footer (nếu theme không render footer) */
#rd-fallback-footer{ background:#fff; }
/* ==============================
   Archive / Category – Ảnh nhỏ, cân đối như trang chủ
   ============================== */

/* Ép khung ảnh có tỉ lệ 16:10 (62.5%), cắt cover, bo góc */
.archive.category .box .box-image,
.archive.category .box-vertical .box-image,
.archive .rd-box-image {
  position: relative;
  padding-top: 62.5%;      /* 16:10 như thẻ trang chủ */
  overflow: hidden;
  border-radius: 12px;
}

/* Ảnh phủ kín khung, không bị kéo dài */
.archive.category .box .box-image img,
.archive.category .box-vertical .box-image img,
.archive .rd-box-image .rd-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Khoảng cách dưới ảnh cho gọn */
.archive.category .box .box-text { padding-top: 10px; }

/* Fix “chữ dọc / bẻ từng ký tự” */
.archive .post-title,
.archive .post-title a,
.archive .box-text,
.archive .rd-cat {
  writing-mode: horizontal-tb !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Responsive: ảnh thấp hơn chút trên mobile nếu muốn */
@media (max-width: 768px){
  .archive.category .box .box-image,
  .archive.category .box-vertical .box-image {
    padding-top: 56%;      /* 16:9 trên mobile cho thoáng */
  }
}
/* ============ ARCHIVE/CATEGORY – Ảnh không bị ảnh hưởng bởi title ============ */

/* Card 2 hàng: 1 = ảnh, 2 = text */
.archive.category .col .box,
.archive.category .col .box-vertical {
  display: grid;
  grid-template-rows: auto 1fr; /* ảnh ở trên, text phía dưới */
}

/* Khung ảnh cố định tỉ lệ (giống card trang chủ) */
.archive.category .box .box-image,
.archive.category .box-vertical .box-image,
.archive .rd-box-image {
  position: relative;
  padding-top: 62.5%;           /* 16:10; nếu muốn thấp hơn dùng 56% (16:9) */
  overflow: hidden;
  border-radius: 12px;
}

/* Ảnh phủ kín khung, không méo */
.archive.category .box .box-image img,
.archive.category .box-vertical .box-image img,
.archive .rd-box-image .rd-thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Khoảng cách nội dung dưới ảnh */
.archive.category .box .box-text { padding-top: 10px; }

/* Fix hoàn toàn vụ “chữ dọc / bẻ ký tự” */
.archive .post-title,
.archive .post-title a,
.archive .box-text,
.archive .rd-cat {
  writing-mode: horizontal-tb !important;
  word-break: normal !important;
  overflow-wrap: anywhere !important;
  white-space: normal !important;
}

/* Clamp title để không đẩy card cao quá */
.archive.category .box .box-text .post-title,
.archive.category .box .box-text .post-title a {
  display: -webkit-box;
  -webkit-line-clamp: 3;     /* số dòng tối đa của title */
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 6px 0;
  line-height: 1.35;
}

/* (Tuỳ chọn) ảnh thấp hơn trên mobile cho thoáng */
@media (max-width: 768px){
  .archive.category .box .box-image,
  .archive.category .box-vertical .box-image {
    padding-top: 56%;        /* 16:9 */
  }
}
/* =========================
   Category Description (Card)
   ========================= */

/* Bọc ngoài: card + bóng nhẹ */
.rd-term-desc,
.archive .archive-description{
  margin: 12px 0 22px;
}
.rd-term-desc .container,
.archive .archive-description{
  background:#fff;
  border:1px solid #e8eef4;
  border-radius:14px;
  box-shadow:0 10px 24px rgba(2,8,20,.06);
  padding:18px 22px;
  color:#0f172a;
  line-height:1.75;
  font-size:16px;
}

/* Viền nhấn bên trái (tinh tế) */
.rd-term-desc .container,
.archive .archive-description{
  position:relative;
}
.rd-term-desc .container::before,
.archive .archive-description::before{
  content:"";
  position:absolute; inset:0 auto 0 0;
  width:4px; border-radius:14px 0 0 14px;
  background:linear-gradient(180deg,#2563eb, #60a5fa);
}

/* Typography */
.rd-term-desc h1,.rd-term-desc h2,.rd-term-desc h3,
.archive .archive-description h1,
.archive .archive-description h2,
.archive .archive-description h3{
  margin:0 0 .4em;
  font-weight:800;
  line-height:1.25;
  color:#0f172a;
}
.rd-term-desc p,
.archive .archive-description p{ margin:0 0 .8em; }

/* Link */
.rd-term-desc a,
.archive .archive-description a{
  color:#2563eb;
  text-decoration:underline;
  text-underline-offset:2px;
}
.rd-term-desc a:hover,
.archive .archive-description a:hover{
  color:#1e40af;
}

/* Danh sách – bullet đẹp, đều hàng */
.rd-term-desc ul,
.archive .archive-description ul{
  list-style:none; margin:.3em 0 0; padding:0;
  display:grid; gap:.45em;
}
/* 2 cột trên desktop cho danh sách dài */
@media (min-width: 920px){
  .rd-term-desc ul,
  .archive .archive-description ul{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
.rd-term-desc li,
.archive .archive-description li{
  position:relative; padding-left:24px;
  break-inside:avoid; /* tránh gãy cột xấu */
}
.rd-term-desc li::before,
.archive .archive-description li::before{
  content:"";
  position:absolute; left:0; top:.55em;
  width:8px; height:8px; border-radius:50%;
  background:#2563eb;
  box-shadow:0 0 0 3px rgba(37,99,235,.15);
}

/* Ảnh trong mô tả (nếu bạn giữ ảnh) */
.rd-term-desc img,
.archive .archive-description img{
  max-width:100%; height:auto; border-radius:10px;
  box-shadow:0 8px 18px rgba(2,8,20,.08);
  margin:.6em 0;
}

/* Chống bẻ chữ dọc / ký tự lẻ */
.rd-term-desc, .rd-term-desc * ,
.archive .archive-description, .archive .archive-description * {
  word-break: normal; overflow-wrap: anywhere; white-space: normal;
}
/* Font chính toàn site */
html, body {
  font-family: "Noto Sans", Arial, sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Font cho tiêu đề */
h1, h2, h3, h4, h5, h6,
.entry-title, .page-title, .widget-title,
.nav > li > a, .button, button {
  font-family: "Montserrat", "Noto Sans", sans-serif !important;
}

/* Tắt ép uppercase để không bị méo dấu */
h1, h2, h3, h4, h5, h6,
.entry-title, .page-title {
  text-transform: none !important;
}