.elementor-94405 .elementor-element.elementor-element-3366606{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:-10px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-94405 .elementor-element.elementor-element-3366606:not(.elementor-motion-effects-element-type-background), .elementor-94405 .elementor-element.elementor-element-3366606 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFCA9D;background-image:url("https://dethitracnghiem.vn/wp-content/uploads/2025/10/Tai-mau-99.png");background-position:center center;background-size:cover;}.elementor-94405 .elementor-element.elementor-element-5115c32{--display:flex;--min-height:0px;--justify-content:center;}.elementor-94405 .elementor-element.elementor-element-8cc73b4{--display:flex;--justify-content:flex-start;border-style:solid;--border-style:solid;border-width:0px 0px 0px 0px;--border-top-width:0px;--border-right-width:0px;--border-bottom-width:0px;--border-left-width:0px;--border-radius:15px 15px 15px 15px;}.elementor-94405 .elementor-element.elementor-element-66dda25{--display:flex;}.elementor-94405 .elementor-element.elementor-element-44bdbdc{margin:-35px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-94405 .elementor-element.elementor-element-b795dd5{--display:flex;}.elementor-94405 .elementor-element.elementor-element-8d976bf{margin:-50px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-94405 .elementor-element.elementor-element-c40f9c5{--display:flex;}.elementor-94405 .elementor-element.elementor-element-f3138ad{margin:-60px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-94405 .elementor-element.elementor-element-5115c32{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-78f2543 *//* ================= HERO Sử 12 — LEFT ONLY (scoped) ================= */
.hero-s12{
  /* Brand tokens */
  --primary:#1e3a8a;
  --accent:#2563eb;
  --ink:#0b122a;
  --muted:#475569;
  --line:#e5e7eb;

  /* Kích thước khung chữ bên trái */
  --box: 620px;            /* đổi 560/600/660 tùy layout */
  --gutter-l: clamp(12px,3vw,24px);   /* lề trái của section */
  --gutter-r: clamp(8px,2vw,16px);    /* lề phải nhỏ */

  color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:transparent;             /* không ảnh hưởng nền trang */
  padding:48px var(--gutter-r) 36px var(--gutter-l);
}

/* Wrapper full-width, dính trái */
.hero-s12 .wrap{
  width:100%;
  max-width:none;
  margin:0;
}

/* ===== LEFT BLOCK (KHUNG VUÔNG) ===== */
.hero-s12 .left{
  max-width:var(--box);
  width:100%;
  box-sizing:border-box;
}
.hero-s12 .left > *{ max-width:100% }              /* chặn tràn ngang */
.hero-s12 h1,.hero-s12 .sub{ overflow-wrap:anywhere }

/* Eyebrow */
.hero-s12 .eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  padding:6px 10px;
  font-weight:700; font-size:13px; color:var(--accent);
  background:#eef6ff; border:1px solid #bfdbfe; border-radius:999px;
}

/* Title & subtitle */
.hero-s12 h1{
  margin:12px 0 8px;
  color:var(--primary);
  font-family:"Roboto Slab", Georgia, serif;
  font-weight:900; line-height:1.15;
  font-size:clamp(28px,3.6vw,44px);
}
.hero-s12 .sub{
  margin:0 0 16px; color:var(--muted);
  font-size:clamp(14px,1.2vw,16px);
}

/* Pills (thông tin nhanh) */
.hero-s12 .pills{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:20px }
.hero-s12 .pill{
  display:inline-flex; align-items:center; gap:10px;
  padding:10px 12px; border-radius:999px;
  background:#fff; border:1px solid var(--line); color:var(--ink);
  font-weight:600; font-size:13px; line-height:1;
}
.hero-s12 .pill svg{ width:16px; height:16px }

/* CTA buttons */
.hero-s12 .cta{ display:flex; gap:12px; flex-wrap:wrap; margin:12px 0 22px }
.hero-s12 .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:12px 16px; border-radius:12px;
  font-weight:800; text-decoration:none; border:1px solid var(--accent);
}
.hero-s12 .btn.primary{ background:var(--accent); color:#fff }
.hero-s12 .btn.primary:hover{ filter:brightness(.95) }
.hero-s12 .btn.outline{ background:#fff; color:var(--accent) }
.hero-s12 .btn:focus-visible,
.hero-s12 .link:focus-visible,
.hero-s12 .pill:focus-visible{ outline:3px solid #93c5fd; outline-offset:2px }

/* Quick links */
.hero-s12 .links{ display:flex; gap:12px; flex-wrap:wrap }
.hero-s12 .link{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:999px; border:1px solid var(--line);
  background:#fff; color:var(--ink); text-decoration:none; font-weight:600; font-size:13px;
}
.hero-s12 .link svg{ width:16px; height:16px }

/* ===== Responsive: mobile = một cột, khung = 100% ===== */
@media (max-width: 640px){
  .hero-s12{ padding:36px var(--gutter-l) }
  .hero-s12{ --box: 100% }
  .hero-s12 h1{ font-size:clamp(24px,8vw,34px) }
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-44bdbdc *//* ===== Block: Luyện theo bài học (LS12) — no shadow, no chips ===== */
.ls12-section{
  --ls12-primary:#1e3a8a;
  --ls12-ink:#0f172a;
  --ls12-muted:#475569;
  --ls12-line:#e5e7eb;
  --ls12-card:#ffffff;
  --ls12-radius:16px;

  padding:40px 0; color:var(--ls12-ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}
.ls12-container{ width:min(1120px,92vw); margin-inline:auto }

/* Title bar */
.ls12-titlebar{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:18px;
}
.ls12-titlebar h2{
  margin:0; color:var(--ls12-primary);
  font-family:"Roboto Slab", Georgia, serif;
  font-size:clamp(22px,2.2vw,30px);
}
.ls12-link-all{
  display:inline-flex; align-items:center; gap:8px;
  padding:10px 14px; border-radius:999px; font-weight:700; font-size:14px;
  text-decoration:none; color:var(--ls12-primary);
  background:#fff; border:1px solid var(--ls12-primary);
}

/* Grid & Cards (no shadow) */
.ls12-grid{ display:grid; gap:20px }
.ls12-grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)) }
@media (max-width:1024px){ .ls12-grid-3{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:680px){ .ls12-grid-3{ grid-template-columns:1fr } }

.ls12-card{
  position:relative; overflow:hidden; /* để bo góc cắt ribbon */
  background:var(--ls12-card); border:1px solid var(--ls12-line);
  border-radius:var(--ls12-radius);
  padding:38px 18px 18px;              /* nhường chỗ ribbon */
  transition:transform .2s ease;
}
.ls12-card:hover{ transform:translateY(-2px) } /* nhẹ, không bóng */

.ls12-exam-item{ display:block; text-decoration:none; color:inherit }
.ls12-title{
  font-weight:700; line-height:1.35;
  font-size:clamp(16px,1.55vw,18px);
  margin:0 0 8px; padding-right:16px;
  overflow-wrap:anywhere;
}
.ls12-meta{ color:var(--ls12-muted); font-size:14px; margin:0 0 10px }
.ls12-tags{ display:flex; gap:8px; flex-wrap:wrap }
.ls12-tag{ font-size:12px; padding:6px 10px; border:1px solid var(--ls12-line); border-radius:999px; background:#fff }

/* Ribbon chéo góc — bản nhỏ */
.ls12-ribbon{
  --rb-box:86px; --rb-span:130px; --rb-top:18px; --rb-right:-36px;
  position:absolute; top:-10px; right:-10px;
  width:var(--rb-box); height:var(--rb-box);
  overflow:hidden; pointer-events:none; z-index:2;
  -webkit-transform:translateZ(0); transform:translateZ(0);
}
.ls12-ribbon span{
  position:absolute; top:var(--rb-top); right:var(--rb-right);
  width:var(--rb-span); padding:7px 0; text-align:center;
  background:linear-gradient(135deg,#5aa2ff,#2563eb);
  color:#fff; font-weight:700; font-size:11px; letter-spacing:.2px;
  transform:rotate(45deg);
}

/* (Fallback) Nếu trang cũ vẫn còn phần chips, ẩn đi hoàn toàn
nav[aria-label="Chọn nhanh bài học"]{ display:none !important; }
*//* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-8d976bf *//* ===== EXAM BUTTONS x10 (ux-) — no section bg, white cards, white badges ===== */
.ux-exams{
  --primary:#1e3a8a;
  --ink:#0b1220;
  --muted:#5b6470;
  --line:#e5e7eb;

  color:var(--ink);
  font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  padding:32px 0;       /* KHÔNG background cho section */
}
.ux-wrap{ width:min(1120px,92vw); margin-inline:auto }
.ux-head{ margin-bottom:16px }
.ux-head h2{
  margin:0; color:var(--primary);
  font-family:"Roboto Slab", Georgia, serif;
  font-weight:800; font-size:clamp(22px,2.2vw,30px);
}

/* Grid */
.ux-grid{ display:grid; gap:14px }
.ux-grid.cols-5{ grid-template-columns:repeat(5,minmax(0,1fr)) }
@media (max-width:1200px){ .ux-grid.cols-5{ grid-template-columns:repeat(4,1fr) } }
@media (max-width:900px){  .ux-grid.cols-5{ grid-template-columns:repeat(2,1fr) } }
@media (max-width:560px){  .ux-grid.cols-5{ grid-template-columns:1fr } }

/* Card-button */
.ux-card{
  position:relative; background:#fff; border:1px solid var(--line);
  border-radius:12px; border-left:5px solid var(--accent,var(--line));
  padding:14px 14px 12px 16px; transition:transform .15s ease, border-color .15s ease;
}
.ux-card:hover{ transform:translateY(-2px) }

/* Mức độ -> màu vạch trái */
.ux-card[data-level="tb"]{ --accent:#2563eb } /* Trung bình */
.ux-card[data-level="kha"]{ --accent:#f59e0b } /* Khá */
.ux-card[data-level="nc"]{ --accent:#ef4444 }  /* Nâng cao */

.ux-link{ display:block; text-decoration:none; color:inherit }
.ux-title{
  margin:0 0 6px; color:var(--primary);
  font-weight:800; line-height:1.35; font-size:clamp(16px,1.55vw,18px);
}
.ux-meta{ margin:0 0 10px; color:var(--muted); font-size:14px }
.ux-meta .sep{ margin:0 6px }

/* Badges: nền trắng + viền mảnh */
.ux-badges{ display:flex; gap:8px; flex-wrap:wrap }
.ux-badge{
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 10px; border-radius:999px; background:#fff;
  border:1px solid var(--line); color:var(--ink);
  font-size:13px; font-weight:600; white-space:nowrap; line-height:1;
}
.ux-badge[data-level="tb"]{ border-color:#2563eb; color:#1e40af }
.ux-badge[data-level="kha"]{ border-color:#f59e0b; color:#7a3e00 }
.ux-badge[data-level="nc"]{ border-color:#ef4444; color:#991b1b }
.ux-badge[data-type="answer"]{ border-color:#16a34a; color:#166534 }
.ux-badge[data-type="solution"]{ border-color:#6b21a8; color:#6b21a8 }/* End custom CSS */