/* =========================================================================
   TeeTeeCo 2026 — lop trinh bay moi, nap sau main.css/mobile.css cua theme cha.
   Bang mau lay tu ban thiet ke Framer; theme cha da dung san --tt-blue #799baf.
   ========================================================================= */

.tt26 {
  --tt26-ink: #1c1c1c;
  --tt26-deep: #0e495e;
  --tt26-accent: #799baf;
  --tt26-accent-soft: #76a8c4;
  --tt26-muted: #7a7a7a;
  --tt26-line: rgba(28, 28, 28, .14);
  --tt26-paper: #ffffff;
  --tt26-page: #f2f2f2;
  --tt26-mist: #f5f6f6;
  --tt26-shell: 1280px;
  --tt26-gutter: clamp(20px, 5vw, 72px);

  /* Font cua ban thiet ke. Wordmark serif cua theme cha giu nguyen. */
  --tt26-sans: "Inter", "Segoe UI", Arial, sans-serif;
  --tt26-display: "Red Hat Display", "Inter", "Segoe UI", Arial, sans-serif;
  --tt26-alt: "Josefin Sans", "Red Hat Display", "Inter", "Segoe UI", Arial, sans-serif;

  /* Ghi de bien cua theme cha de moi thu ke thua font moi.
     --tt-banner-display la bien theme cha ap !important cho toan bo tieu de
     hero (trang chu, danh muc, blog, lien he, gioi thieu, chinh sach...),
     nen doi mot bien nay la doi duoc het. */
  --tt-body: "Inter", "Segoe UI", Arial, sans-serif;
  --tt-display: "Red Hat Display", "Inter", "Segoe UI", Arial, sans-serif;
  --tt-banner-display: "Red Hat Display", "Inter", "Segoe UI", Arial, sans-serif;
}

/* Theme cha ep letter-spacing:0 va text-transform:none cho cac tieu de hero.
   Ban thiet ke dung chu hoa gian net, nen phai tra lai bang cung muc !important
   tren dung nhom selector do. */
body.tt26 .tt-hero h1,
body.tt26 .tt-collection-banner h2,
body.tt26 .tt-feature-split__collection h2,
body.tt26 .tt-collections-feature h1,
body.tt26 .tt-collections-feature h2,
body.tt26 .tt-blog-banner .tt-blog-page__title,
body.tt26 .tt-blog-hero-card h2,
body.tt26 .tt-blog-detail__hero h1,
body.tt26 .tt-contact-hero h1,
body.tt26 .tt-about-tom__hero h1,
body.tt26 .tt-about-redesign__hero h1,
body.tt26 .tt-about-page--refined .tt-about-hero h1,
body.tt26 .tt-policy-hero h1 {
  font-family: var(--tt26-display) !important;
  font-weight: 300 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

/* Nen trang trong ban thiet ke la #f2f2f2, khong phai trang.
   Cac khoi noi dung (IN THE MAKING, cam ket, blog) moi la nen trang. */
body.tt26 {
  background: var(--tt26-page) !important;
  color: var(--tt26-ink);
  font-family: var(--tt26-sans);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}

body.tt26 h1,
body.tt26 h2,
body.tt26 h3,
body.tt26 h4 {
  font-family: var(--tt26-display);
  font-weight: 400;
}

/* Wordmark tren header la anh SVG nen font khong anh huong; o footer no co
   the la chu, nen chi dinh serif truc tiep thay vi tro vao --tt-display
   (bien do da bi doi sang Red Hat Display o tren). */
body.tt26 .tt-logo,
body.tt26 .tt-footer-logo {
  font-family: "InstrumentSerifTT", Georgia, "Times New Roman", serif;
}

.tt26 .tt-shell {
  width: min(var(--tt26-shell), calc(100% - var(--tt26-gutter) * 2));
}

/* -------------------------------------------------------------------------
   1. Header — wordmark can giua tren mot hang rieng, nav can giua hang duoi
   ------------------------------------------------------------------------- */

.tt26 .tt-site-header {
  background: var(--tt26-paper);
  border-bottom: 1px solid var(--tt26-line);
}

/* Theme cha khoa hai hang header bang `body .tt-header-logo-row{...!important}`
   va co ca quy tac `display:none` cho nav row, nen o day buoc phai dung
   !important voi do uu tien cao hon (.tt26 = 0,2,0 > body = 0,1,1). */
.tt26 .tt-header-logo-row,
body.tt26 .tt-header-logo-row {
  display: flex !important;
  height: 73px !important;
  background: var(--tt26-paper) !important;
  color: var(--tt26-ink) !important;
  border-bottom: 0 !important;
}

/* Wordmark trong thiet ke la 245x36 */
.tt26 .tt-logo img {
  height: 36px;
  width: auto;
}

.tt26 .tt-header-nav-row,
body.tt26 .tt-header-nav-row,
body.tt26.single-product .tt-header-nav-row,
body.tt26.woocommerce-cart .tt-header-nav-row,
body.tt26.woocommerce-checkout .tt-header-nav-row,
body.tt26.page-child .tt-header-nav-row {
  display: grid !important;
  height: 46px !important;
  padding: 0 40px 0 160px !important;
  background: var(--tt26-paper) !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center;
  border-top: 0 !important;
  border-bottom: 0 !important;
  position: relative;
}

.tt26 .tt-primary-nav {
  grid-column: 1;
  justify-self: center;
  min-width: 0;
}

/* Thiet ke cach nhau 73px voi 5 muc tieng Anh ngan. Menu that co 6 muc
   tieng Viet dai hon nen phai co gian, neu khong khoi icon ben phai bi
   day tran ra ngoai mep man hinh. */
.tt26 .tt-menu {
  gap: clamp(16px, 5.1vw, 73px);
  flex-wrap: nowrap;
}

/* Thiet ke dat o tim kiem o LE TRAI (x=124), khong nam cung nhom icon ben
   phai. Markup cua theme cha de no trong .tt-header-icons nen keo rieng no
   sang trai bang position. Luu y: href la ".../?s" — khong co dau "=". */
.tt26 .tt-header-icons > a[href*="?s"] {
  position: absolute;
  left: 124px;
  top: 50%;
  transform: translateY(-50%);
}

.tt26 .tt-header-icons {
  grid-column: 2;
}

/* Theme cha dat `body .tt-menu a{color:#fff!important}` va color trang cho ca
   hang nav, khien nhung phan tu khong phai the <a> — vi du dau "/" ngan cach
   VI / EN — thanh trang tren nen trang. Tra mau cho ca hang. */
.tt26 .tt-menu a,
body.tt26 .tt-menu a,
body.tt26 .tt-header-icons a,
body.tt26 .tt-header-language a,
body.tt26 .tt-header-nav-row,
body.tt26 .tt-header-nav-row span,
body.tt26 .tt-menu li {
  color: var(--tt26-ink) !important;
}

/* Thiet ke: Red Hat Display 15px / 600 / gian 0.75px */
.tt26 .tt-menu a,
body.tt26 .tt-menu a {
  font-family: var(--tt26-display) !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: .75px !important;
  text-transform: uppercase;
}

.tt26 .tt-menu a:hover,
body.tt26 .tt-menu a:hover {
  color: var(--tt26-accent) !important;
}

.tt26 .tt-header-icons {
  justify-self: end;
  gap: 18px;
}

.tt26 .tt-header-icons svg {
  stroke-width: 1.3;
}

.tt26 .tt-header-language a {
  font-size: 10px;
  letter-spacing: .1em;
}

/* Header khong con trong suot nen bo hieu ung kinh mo cua theme cha. */
.tt26 .tt-site-header,
body.tt26 .tt-site-header {
  backdrop-filter: none !important;
}

/* Chua co o tim kiem ben trai trong markup cha — day khoi icon sang phai
   va giu nav dung giua bang grid o tren. */

/* -------------------------------------------------------------------------
   2. The san pham trong luoi
   ------------------------------------------------------------------------- */

.tt26 .woocommerce ul.products {
  gap: 30px;
}

/* Theme cha dat `.tt-product-card{display:flex}` nhung khong dat huong truc,
   nen khi the khong co lop boc __link ben trong (truong hop shortcode
   [products]) thi <figure> co lai bang chieu rong noi dung — anh chi con
   ~60px. Ep thanh cot va cho cac phan con chiem du chieu rong. */
.tt26 .tt-product-card {
  background: var(--tt26-paper);
  display: flex;
  flex-direction: column;
}

/* Cac phan con phai chiem du chieu rong, khong thi <figure> co lai con ~60px. */
.tt26 .tt-product-card > * {
  width: 100%;
}

/* Theme cha dat height:100% cho lop boc chu, khien no keo cao bang ca the
   va de lai khoang trong lon duoi ten san pham. Cho no cao theo noi dung. */
.tt26 .tt-product-card__link {
  height: auto !important;
  flex: 0 0 auto;
}

.tt26 .tt-product-card__image {
  flex: 0 0 auto;
}

/* Theme cha dat text-align:left rieng cho tung the con (h2, p, gia) nen
   chi can can giua o the bao la khong du. */
.tt26 .tt-product-card__body,
.tt26 .tt-product-card__body h2,
.tt26 .tt-product-card__body p,
.tt26 .tt-product-card__body .tt-price,
.tt26 .tt-product-card__body .price,
.tt26 .woocommerce-loop-product__title {
  text-align: center !important;
}

.tt26 .tt-product-card:hover {
  transform: none;
  box-shadow: none;
}

.tt26 .tt-product-card__image {
  background: var(--tt26-mist);
  aspect-ratio: 618 / 513;
}

.tt26 .tt-product-card:hover .tt-product-card__image img {
  transform: scale(1.03);
}

.tt26 .tt-product-card__image img {
  transition: transform .5s ease;
}

/* Thiet ke: phan chu cao 89, dem deu 20px, nen trang, chu can giua. */
.tt26 .tt-product-card__body,
body.tt26 .tt-product-card__body {
  min-height: 89px;
  padding: 20px !important;
  text-align: center;
  background: var(--tt26-paper) !important;
}

/* Ten san pham: Red Hat Display 20px / 600 / gian 1px */
.tt26 .tt-product-card__body h2,
.tt26 .woocommerce-loop-product__title,
body.tt26 .woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--tt26-display) !important;
  font-size: clamp(14px, 1.45vw, 20px) !important;
  font-weight: 600 !important;
  letter-spacing: 1px !important;
  line-height: 1.2;
  text-transform: uppercase;
  color: var(--tt26-ink);
  margin: 0 0 4px;
}

/* Gia trong luoi: Red Hat Display 14px / 500 / gian 0.7px, mau #737373 */
.tt26 .tt-product-card__body .tt-price,
.tt26 .tt-product-card__body .price,
.tt26 .tt-product-card__body .price .amount,
body.tt26 .tt-product-card__body .price {
  font-family: var(--tt26-display) !important;
  font-size: clamp(11px, 1.02vw, 14px) !important;
  font-weight: 500 !important;
  letter-spacing: .7px !important;
  color: #737373 !important;
}

/* -------------------------------------------------------------------------
   3. Trang san pham — anh tran vien ben trai, thong tin ben phai
   ------------------------------------------------------------------------- */

/* Thiet ke: anh 641 x 1001 tren khung 1425 -> cot anh 641, cot chu 784 */
.tt26 .tt-single-product {
  width: 100%;
  max-width: none;
  margin: 0;
  display: grid;
  grid-template-columns: 641fr 784fr;
  gap: 0;
  align-items: stretch;
}

.tt26 .tt-single-product__gallery {
  margin: 0;
  position: relative;
  background: var(--tt26-mist);
}

/* Thiet ke: anh chinh ty le 641 x 1001 (doc), khong phai vuong */
.tt26 .tt-product-main-image {
  margin: 0;
  height: 100%;
  min-height: 0;
  aspect-ratio: 641 / 1001;
}

.tt26 .tt-product-main-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.tt26 .tt-single-product__summary,
body.tt26 .tt-single-product__summary {
  padding: 92px 119px 60px 120px !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

.tt26 .tt-product-thumbs {
  order: 9;
  margin-top: 34px;
  gap: 10px;
}

.tt26 .tt-product-thumbs button {
  width: 58px;
  height: 58px;
  border: 1px solid transparent;
  background: var(--tt26-mist);
  padding: 0;
}

.tt26 .tt-product-thumbs button.is-active {
  border-color: var(--tt26-accent);
}

.tt26 .tt-stock-dot {
  font-size: 10px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tt26-muted);
  margin: 0 0 14px;
}

/* Thiet ke: ten san pham Red Hat Display 30px / 500 / gian 3.6px */
.tt26 .tt-single-product__summary h1,
body.tt26 .tt-single-product__summary h1 {
  font-family: var(--tt26-display) !important;
  font-size: clamp(20px, 2.1vw, 30px) !important;
  font-weight: 500 !important;
  letter-spacing: 3.6px !important;
  text-transform: uppercase;
  color: var(--tt26-ink);
  margin: 0 0 12px;
}

.tt26 .tt-product-subtitle,
body.tt26 .tt-product-subtitle {
  font-family: var(--tt26-display) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  line-height: 1.5;
  color: var(--tt26-deep) !important;
  margin: 24px 0 24px;
}

/* Thiet ke: gia Red Hat Display 18px / 600 / gian 2.16px, mau MUC (khong xanh) */
.tt26 .tt-single-product__price,
.tt26 .tt-single-product__price .price,
.tt26 .tt-single-product__price .amount,
body.tt26 .tt-single-product__price .amount {
  font-family: var(--tt26-display) !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 2.16px !important;
  color: var(--tt26-ink) !important;
}

.tt26 .tt-single-product__price {
  margin-bottom: 22px;
}

/* "Learn more" duoi doan mo ta ngan */
.tt26 .tt26-learn-more {
  display: inline-block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--tt26-muted);
  text-decoration: underline;
  text-underline-offset: 3px;
}

.tt26 .tt26-learn-more:hover {
  color: var(--tt26-accent);
}

.tt26 .tt-single-product__excerpt p {
  font-size: 13px;
  line-height: 1.85;
  color: #4d4d4d;
  margin: 0 0 10px;
}

/* Nhom lua chon dang dropdown giong ban thiet ke */
.tt26 .tt26-choice {
  margin-top: 22px;
}

/* Thiet ke: nhan lua chon Red Hat Display 14px / 500 / gian 1.4px, mau #799baf */
.tt26 .tt26-choice__label {
  display: block;
  font-family: var(--tt26-display);
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  color: var(--tt26-accent);
  margin-bottom: 8px;
}

.tt26 .tt26-select {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid var(--tt26-line);
  border-radius: 2px;
  background: var(--tt26-mist);
  color: var(--tt26-ink);
  font-size: 12px;
  letter-spacing: .1em;
  text-transform: uppercase;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--tt26-muted) 50%),
                    linear-gradient(135deg, var(--tt26-muted) 50%, transparent 50%);
  background-position: calc(100% - 20px) 21px, calc(100% - 15px) 21px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
}

.tt26 .tt26-select:focus {
  outline: none;
  border-color: var(--tt26-accent);
}

/* Nut them vao gio — rong het cot, mau xanh xam cua thiet ke */
.tt26 .tt-cart-form {
  margin-top: 26px;
}

/* Theme cha dat mau nut bang !important nen o day phai thang lai bang
   !important, neu khong nut se giu mau navy cu #244a61. */
.tt26 .tt-cart-form .single_add_to_cart_button,
.tt26 .tt-mock-summary .single_add_to_cart_button,
.tt26 .single_add_to_cart_button,
.tt26 .tt-cart-form .button {
  width: 100% !important;
  height: 58px !important;
  border: 0 !important;
  border-radius: 2px !important;
  background: var(--tt26-accent) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .2em !important;
  text-transform: uppercase;
  box-shadow: none !important;
  cursor: pointer;
  transition: background .2s ease !important;
}

.tt26 .tt-cart-form .single_add_to_cart_button:hover,
.tt26 .tt-mock-summary .single_add_to_cart_button:hover,
.tt26 .single_add_to_cart_button:hover {
  background: var(--tt26-deep) !important;
}

.tt26 .tt26-installments,
body.tt26 .tt26-installments {
  margin: 24px 0 0;
  text-align: left;
  font-family: var(--tt26-display) !important;
  font-size: 13px !important;
  font-weight: 400 !important;
  letter-spacing: normal !important;
  color: var(--tt26-accent) !important;
}

.tt26 .tt26-helprow {
  display: flex;
  justify-content: center;
  gap: 34px;
  margin-top: 22px;
  padding-top: 22px;
  border-top: 1px solid var(--tt26-line);
}

.tt26 .tt26-helprow a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tt26-muted);
}

.tt26 .tt26-helprow a:hover {
  color: var(--tt26-accent);
}

.tt26 .tt26-helprow svg {
  width: 14px;
  height: 14px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.4;
}

.tt26 .tt26-shipnote {
  margin-top: 20px;
  font-size: 11px;
  line-height: 1.7;
  color: var(--tt26-muted);
  text-align: center;
}

.tt26 .tt26-shipnote strong {
  display: block;
  color: var(--tt26-ink);
  letter-spacing: .14em;
  text-transform: uppercase;
  font-weight: 500;
  margin-bottom: 4px;
}

/* An cac khoi cu khong co trong ban thiet ke moi.
   Mui ten va cham gallery do script cua theme cha chen vao, nen phai an
   bang CSS chu khong the bo o template. */
.tt26 .tt-size-guide,
.tt26 .tt-mobile-product-cues,
.tt26 .tt-product-fit-note,
.tt26 .tt-size-row,
.tt26 .tt-single-product .tt-gallery-arrow,
.tt26 .tt-single-product .tt-gallery-dots {
  display: none;
}

/* Nut yeu thich noi tren anh, gon o goc tren phai */
.tt26 .tt-gallery-heart {
  top: 22px;
  right: 22px;
  width: 38px;
  height: 38px;
  background: rgba(255, 255, 255, .92);
  border: 0;
  border-radius: 50%;
}

.tt26 .tt-mobile-purchase-card {
  padding: 0;
  background: transparent;
  border: 0;
}

.tt26 .tt-mobile-purchase-card > p {
  display: none;
}

/* -------------------------------------------------------------------------
   4. Khoi DESCRIPTION / DETAILS
   ------------------------------------------------------------------------- */

.tt26 .tt-product-detail-grid {
  padding: clamp(56px, 8vw, 104px) 0;
  gap: clamp(40px, 7vw, 96px);
  border-top: 1px solid var(--tt26-line);
  margin-top: 0;
}

/* Thiet ke: DESCRIPTION / DETAILS — Red Hat Display 16px / 600 / gian 1.92px */
.tt26 .tt-product-detail-grid h2,
body.tt26 .tt-product-detail-grid h2 {
  font-family: var(--tt26-display) !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  letter-spacing: 1.92px !important;
  text-transform: uppercase;
  color: var(--tt26-ink);
  margin: 0 0 22px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--tt26-line);
}

.tt26 .tt-product-detail-grid p {
  font-size: 13px;
  line-height: 1.9;
  color: #4d4d4d;
}

.tt26 .tt-product-detail-grid strong {
  display: block;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tt26-muted);
  margin-bottom: 4px;
}

.tt26 .tt26-reference {
  margin-top: 18px;
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tt26-muted);
}

/* -------------------------------------------------------------------------
   5. Dai cam ket dich vu
   ------------------------------------------------------------------------- */

.tt26 .tt-service-row {
  min-height: 0;
  padding: 44px 0;
  border-top: 1px solid var(--tt26-line);
  border-bottom: 1px solid var(--tt26-line);
  background: var(--tt26-mist);
}

.tt26 .tt-service-row img {
  height: 30px;
  width: auto;
  margin-inline: auto;
  opacity: .75;
}

.tt26 .tt-service-row span {
  font-size: 0;
  margin-bottom: 12px;
}

.tt26 .tt-service-row p {
  font-size: 9px;
  font-weight: 400;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tt26-muted);
}

/* -------------------------------------------------------------------------
   6. Trang danh muc — thanh loc
   ------------------------------------------------------------------------- */

.tt26 .tt26-filterbar {
  display: flex;
  align-items: center;
  gap: 26px;
  flex-wrap: wrap;
  padding: 26px 0;
  margin-bottom: 44px;
  border-bottom: 1px solid var(--tt26-line);
}

.tt26 .tt26-filterbar__label {
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

.tt26 .tt26-filterbar select {
  height: 38px;
  min-width: 132px;
  padding: 0 30px 0 12px;
  border: 1px solid var(--tt26-line);
  background: transparent;
  color: var(--tt26-muted);
  font-size: 10px;
  letter-spacing: .14em;
  text-transform: uppercase;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--tt26-muted) 50%),
                    linear-gradient(135deg, var(--tt26-muted) 50%, transparent 50%);
  background-position: calc(100% - 16px) 17px, calc(100% - 11px) 17px;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  cursor: pointer;
}

.tt26 .tt26-filterbar select:focus {
  outline: none;
  border-color: var(--tt26-accent);
}

.tt26 .tt26-filterbar__count {
  margin-left: auto;
  font-size: 10px;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tt26-muted);
}

/* -------------------------------------------------------------------------
   7. Trang chu
   ------------------------------------------------------------------------- */

.tt26 .tt-hero {
  min-height: min(86vh, 760px);
  padding-bottom: 88px;
}

.tt26 .tt-hero h1 {
  font-family: var(--tt-body);
  font-size: clamp(38px, 7vw, 82px);
  font-weight: 300;
  line-height: .96;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tt26 .tt-section-title {
  font-family: var(--tt-body);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: var(--tt26-ink);
  margin-bottom: 46px;
}

.tt26 .tt-feature-split__collection h2 {
  font-family: var(--tt-body);
  font-weight: 300;
  letter-spacing: .04em;
  text-transform: uppercase;
}

.tt26 .tt-btn {
  height: 60px;
  border-radius: 2px;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}

/* -------------------------------------------------------------------------
   8. Responsive
   ------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------
   7b. Trang chu — hero, dai cam ket, khoi bo suu tap
   ------------------------------------------------------------------------- */

.tt26 .tt-hero__shade {
  background: linear-gradient(180deg, rgba(0, 0, 0, .10), rgba(0, 0, 0, .12) 55%, rgba(0, 0, 0, .40));
}

.tt26 .tt-hero h1,
body.tt26 .tt-hero h1 {
  font-family: var(--tt26-display);
  font-weight: 300;
  letter-spacing: .06em;
}

.tt26 .tt-home-services,
.tt26 .tt-home-services.tt-service-row {
  background: var(--tt26-mist);
}

.tt26 .tt-editorial__copy h2,
.tt26 .tt-collection-banner h2,
.tt26 .tt-blog-feature h2 {
  font-family: var(--tt26-display);
  font-size: clamp(20px, 2.2vw, 26px);
  font-weight: 400;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

.tt26 .tt-collection-banner h2 {
  color: #fff;
}

.tt26 .tt-editorial__copy p,
.tt26 .tt-blog-feature p {
  color: #4d4d4d;
  font-size: 13px;
  line-height: 1.9;
}

.tt26 .tt-editorial--split,
.tt26 .tt-blog-feature {
  background: var(--tt26-paper);
}

.tt26 .tt-blog-preview {
  background: var(--tt26-paper);
}

.tt26 .tt-blog-card h3,
.tt26 .tt-blog-grid h3 {
  font-family: var(--tt26-display);
  font-size: 15px;
  font-weight: 500;
  letter-spacing: .12em;
  line-height: 1.4;
  color: var(--tt26-ink);
  text-transform: uppercase;
}

.tt26 .tt-blog-card p,
.tt26 .tt-blog-grid p {
  color: var(--tt26-muted);
  font-size: 12px;
  line-height: 1.75;
}

.tt26 .tt-blog-arrow {
  border-color: var(--tt26-line);
  color: var(--tt26-ink);
}

.tt26 .tt-blog-arrow:hover {
  background: var(--tt26-accent);
  border-color: var(--tt26-accent);
  color: #fff;
}

.tt26 .tt-blog-progress span {
  background: var(--tt26-accent);
}

/* Nut chung */
.tt26 .tt-btn {
  border-color: var(--tt26-ink);
  color: var(--tt26-ink);
}

.tt26 .tt-btn:hover {
  background: var(--tt26-ink);
  border-color: var(--tt26-ink);
  color: #fff;
}

.tt26 .tt-btn--light {
  border-color: #fff;
  color: #fff;
}

.tt26 .tt-btn--light:hover {
  background: #fff;
  color: var(--tt26-ink);
}

/* -------------------------------------------------------------------------
   8b. Trang chu — so do do truc tiep tren ban thiet ke Framer (viewport 1440):
       banner video full width · khung noi dung 1266px, le 80px
       the san pham 618x513 · anh IN THE MAKING 1325x740 (chu de len anh)
       o bo suu tap anh 676x1361, nhan nam DUOI anh
       best seller anh 340x283 · blog 414x300
   ------------------------------------------------------------------------- */

.tt26-collection__inner,
.tt26-blogs__inner {
  width: min(1265px, calc(100% - 160px));
  margin-inline: auto;
}

/* 1. Banner ngang dau trang.
   Header cua theme cha la position:fixed cao 120px, nen banner phai bat dau
   ngay duoi no. Anh tinh nam duoi, video chong len va chi hien khi da tai. */
.tt26-banner {
  position: relative;
  margin-top: 20px;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--tt26-mist);
}

.tt26-banner__still,
.tt26-banner__video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.tt26-banner__video {
  opacity: 0;
  transition: opacity .6s ease;
}

.tt26-banner__video.is-ready {
  opacity: 1;
}

/* 2 + 3 + 4. Bo suu tap — bang truot ngang 2 slide */
.tt26-collection {
  position: relative;
  padding: clamp(46px, 7vw, 92px) 0 clamp(50px, 7vw, 96px);
}

.tt26-collection__viewport {
  overflow: hidden;
}

.tt26-collection__track {
  display: flex;
  transition: transform .55s cubic-bezier(.4, 0, .2, 1);
}

.tt26-collection__slide {
  flex: 0 0 100%;
  min-width: 0;
}

.tt26-collection__arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 44px;
  height: 60px;
  display: grid;
  place-items: center;
  border: 0;
  background: transparent;
  color: var(--tt26-ink);
  cursor: pointer;
  padding: 0;
  transition: opacity .2s ease;
}

.tt26-collection__arrow svg {
  width: 26px;
  height: 26px;
}

.tt26-collection__arrow:hover {
  color: var(--tt26-accent);
}

.tt26-collection__arrow[disabled] {
  opacity: .25;
  cursor: default;
}

.tt26-collection__arrow--prev {
  left: clamp(6px, 2.2vw, 34px);
}

.tt26-collection__arrow--next {
  right: clamp(6px, 2.2vw, 34px);
}

.tt26-collection__title {
  margin: 0 0 clamp(30px, 4vw, 56px);
  font-family: var(--tt26-display) !important;
  font-size: clamp(28px, 4.2vw, 60px) !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  letter-spacing: .1em !important;
  text-transform: uppercase !important;
  text-align: center;
  color: var(--tt26-ink);
}

.tt26-grid2 .woocommerce ul.products,
.tt26-grid2 ul.products {
  grid-template-columns: repeat(2, 1fr) !important;
  gap: 30px !important;
}

.tt26-grid2 .tt-product-card__image {
  aspect-ratio: 618 / 513;
}

.tt26-grid2 .tt-product-card__body {
  background: var(--tt26-paper);
  padding: 20px !important;
  min-height: 89px;
}

.tt26-collection .tt-center {
  margin-top: clamp(28px, 3.6vw, 46px);
}

/* 5. IN THE MAKING — anh rong, chu de chong len chinh giua.
   Thiet ke: khoi cao 840, padding 50px deu bon phia. */
.tt26-making {
  padding: clamp(20px, 3.5vw, 50px);
}

.tt26-making__frame {
  position: relative;
  display: block;
  aspect-ratio: 1325 / 740;
  overflow: hidden;
}

.tt26-making__frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Nut EXPLORE MORE nam DE LEN anh, gan day khung */
.tt26-making__cta {
  position: absolute;
  left: 50%;
  bottom: clamp(20px, 4vw, 48px);
  transform: translateX(-50%);
  z-index: 2;
}

.tt26-making__word {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 0 20px;
  font-family: var(--tt26-display);
  font-size: clamp(30px, 7.02vw, 100px);
  font-weight: 300;
  letter-spacing: .06em;
  text-transform: uppercase;
  text-align: center;
  color: rgba(255, 255, 255, .82);
  text-shadow: 0 2px 24px rgba(0, 0, 0, .18);
  pointer-events: none;
}

/* 6. Dai cam ket */
/* Thiet ke: khoi cao 219, padding 60px 0 */
.tt26-promises {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
  align-content: center;
  padding: 60px 0;
  text-align: center;
}

.tt26-promise__icon {
  display: block;
  height: 60px;
  margin: 0 auto 18px;
  color: var(--tt26-ink);
}

.tt26-promise__icon svg {
  height: 60px;
  width: auto;
  display: block;
  margin: 0 auto;
  overflow: visible;
}

.tt26-promise img {
  height: 34px;
  width: auto;
  margin: 0 auto 14px;
  opacity: .74;
}

/* Thiet ke: Red Hat Display 16px / 600 / gian 0.8px */
.tt26-promise p {
  margin: 0;
  font-family: var(--tt26-display);
  font-size: clamp(11px, 1.12vw, 16px);
  font-weight: 600;
  letter-spacing: .8px;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

/* 7. Hai o bo suu tap — nhan nam DUOI anh, can giua */
/* Thiet ke: khoi cao 1645. Padding 100px 50px do duoc la cua lop BAO;
   do truc tiep hai o cho ket qua rong 676 tai x=17 va x=733 (khe 40),
   tuc le ngang that la 17px. Lay so do truc tiep. */
.tt26-tiles {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  padding: clamp(40px, 7vw, 100px) 17px;
}

.tt26-tile {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.tt26-tile__media {
  display: block;
  aspect-ratio: 676 / 1361;
  overflow: hidden;
  background: var(--tt26-mist);
}

.tt26-tile__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s ease;
}

.tt26-tile:hover .tt26-tile__media img {
  transform: scale(1.03);
}

/* Thiet ke: Red Hat Display 20px / 500 / gian 1px */
.tt26-tile__label {
  margin: 22px 0 8px;
  font-family: var(--tt26-display) !important;
  font-size: clamp(13px, 1.4vw, 20px);
  font-weight: 500 !important;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

.tt26-tile__more {
  font-family: var(--tt26-display);
  font-size: clamp(14px, 1.45vw, 20px);
  font-weight: 400;
  font-style: normal;
  color: #000;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.tt26-tile__more:hover {
  color: var(--tt26-accent);
}

/* Tieu de chung BEST SELLER / OUR BLOGS */
.tt26-heading {
  margin: 0 0 12px;
  font-family: var(--tt26-display) !important;
  font-size: clamp(20px, 2.11vw, 30px) !important;
  font-weight: 500 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  text-align: center;
  color: var(--tt26-ink);
}

/* 8. Best seller — bang cuon ngang, chu can trai duoi anh */
.tt26-best {
  padding: clamp(40px, 7vw, 100px) 0;
}

.tt26-best .tt26-heading {
  margin-bottom: clamp(24px, 3vw, 40px);
  font-family: var(--tt26-alt) !important;
  letter-spacing: 1.8px !important;
}

/* Thiet ke dung overflow:clip + hai nut mui ten, KHONG co thanh cuon. */
.tt26-rail {
  overflow: hidden;
}

.tt26-rail .woocommerce ul.products,
.tt26-rail ul.products {
  display: flex !important;
  grid-template-columns: none !important;
  gap: 10px !important;
  width: max-content;
  /* Dai BEST SELLER trong ban mau la mot duong ray RONG CO DINH 1740px dat
     can giua: o 1920 the dau tien bat dau o 83. Duoi 1740 thi mau de ray tran
     ra ngoai hai mep (o 1425 the dau tien nam o -165, tuc bi cat mat). Ta giu
     dung vi tri cua mau khi man hinh du rong, con khi hep hon thi lui ve 10px
     de khong cat mat san pham dau tien. */
  padding-inline: max(10px, calc((100% - 1740px) / 2));
  transition: transform .55s cubic-bezier(.4, 0, .2, 1);
}

/* The san pham trong thiet ke la mot khoi NEN TRANG boc ca anh lan chu:
   340 x 372 — anh 340x283, phan chu 340x89 dem 20px, can trai. */
.tt26-rail li.product,
body.tt26 .tt26-rail li.product {
  width: 340px;
  flex: 0 0 340px;
  background: var(--tt26-paper) !important;
}

.tt26-rail .tt-product-card__image {
  aspect-ratio: 340 / 283;
}

body.tt26 .tt26-rail .tt-product-card__body {
  background: var(--tt26-paper) !important;
  min-height: 89px;
  padding: 20px !important;
}

.tt26-rail .tt-product-card__body,
.tt26-rail .tt-product-card__body h2,
.tt26-rail .tt-product-card__body p,
.tt26-rail .tt-product-card__body .tt-price {
  text-align: center !important;
}

/* 9. Blog — chu can trai */
.tt26-blogs {
  padding: clamp(44px, 7vw, 100px) 0;
}

.tt26-blogs__sub {
  margin: 0 0 clamp(26px, 3.4vw, 44px);
  text-align: center;
  font-size: 11px;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tt26-muted);
}

/* Thiet ke: the blog rong 414 tren khung noi dung 1265 -> khe 11px */
.tt26-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 11px;
}

/* Thiet ke: the blog la khoi NEN TRANG 414x424 boc ca anh lan chu
   (anh 414x300, phan chu 414x124). */
.tt26-blog-card {
  background: var(--tt26-paper);
}

.tt26-blog-card > a {
  display: block;
}

.tt26-blog-card img {
  width: 100%;
  aspect-ratio: 414 / 300;
  object-fit: cover;
  margin: 0;
  display: block;
}

.tt26-blog-card h3 {
  margin: 0 0 10px;
  padding: 20px 20px 0;
  font-family: var(--tt26-display);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: .06em;
  line-height: 1.5;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

.tt26-blog-card p {
  margin: 0;
  padding: 0 20px 20px;
  font-size: 11px;
  line-height: 1.85;
  color: var(--tt26-muted);
}

@media (max-width: 1100px) {
  .tt26-collection__inner,
  .tt26-blogs__inner {
    width: calc(100% - 64px);
  }
}

@media (max-width: 720px) {
  .tt26-banner {
    margin-top: 58px;
    aspect-ratio: 16 / 10;
  }
}

@media (max-width: 900px) {

  .tt26-blog-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .tt26-promises {
    grid-template-columns: repeat(3, 1fr);
    gap: 26px 12px;
  }

  .tt26-tiles {
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .tt26-promises {
    grid-template-columns: repeat(2, 1fr);
  }

  .tt26-tiles {
    grid-template-columns: 1fr;
  }

  .tt26-tile__media {
    aspect-ratio: 3 / 4;
  }

  .tt26-grid2 .woocommerce ul.products,
  .tt26-grid2 ul.products {
    gap: 14px !important;
  }

  .tt26-rail li.product {
    width: 250px;
    flex: 0 0 250px;
  }
}

/* -------------------------------------------------------------------------
   9. Footer
   ------------------------------------------------------------------------- */

/* Footer trong ban thiet ke la mot khoi mau xanh #76a8c4, chu den. */
.tt26 .tt-site-footer,
body.tt26 .tt-site-footer {
  background: var(--tt26-accent-soft) !important;
  color: var(--tt26-ink);
  border-top: 0;
}

body.tt26 .tt-newsletter--footer,
body.tt26 .tt-footer-info,
body.tt26 .tt-footer-nav,
body.tt26 .tt-footer-bottom {
  background: transparent !important;
}

body.tt26 .tt-footer-bottom,
body.tt26 .tt-footer-info {
  border-top-color: rgba(28, 28, 28, .22) !important;
}

body.tt26 .tt-site-footer .tt-newsletter-form input {
  background: rgba(255, 255, 255, .82);
  border-color: rgba(28, 28, 28, .18);
}

body.tt26 .tt-site-footer .tt-newsletter-form button {
  background: var(--tt26-ink);
}

body.tt26 .tt-site-footer .tt-newsletter-form button:hover {
  background: var(--tt26-deep);
}

.tt26 .tt-footer-logo {
  color: var(--tt26-ink);
}

.tt26 .tt-footer-menu a,
.tt26 .tt-footer-nav a,
.tt26 .tt-footer-info,
.tt26 .tt-footer-info a {
  color: var(--tt26-muted);
  font-size: 12px;
  letter-spacing: .06em;
  line-height: 1.9;
}

.tt26 .tt-footer-menu a:hover,
.tt26 .tt-footer-nav a:hover,
.tt26 .tt-footer-info a:hover {
  color: var(--tt26-accent);
}

.tt26 .tt-footer-bottom {
  border-top: 1px solid var(--tt26-line);
  color: var(--tt26-muted);
  font-size: 11px;
}

/* Thiet ke: nen xanh #76a8c4, chu TRANG.
   Tieu de cot 20px/600, cac muc 16px/400. */
body.tt26 .tt-site-footer,
body.tt26 .tt-site-footer h2,
body.tt26 .tt-site-footer h3,
body.tt26 .tt-site-footer p,
body.tt26 .tt-site-footer span,
body.tt26 .tt-site-footer li,
body.tt26 .tt-newsletter h2,
body.tt26 .tt-newsletter p {
  color: #fff !important;
}

body.tt26 .tt-site-footer h2 {
  font-family: var(--tt26-display) !important;
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase;
  margin: 0 0 26px;
}

/* Footer 4 cot theo ban thiet ke */
/* Thiet ke: cot dau bat dau o x=260 tren khung 1425 — tuc noi dung rong
   khoang 1000px va can giua, khong tran sat mep. */
.tt26-footer__grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1.2fr 1.4fr;
  gap: 40px;
  padding: clamp(44px, 6vw, 92px) 0 clamp(30px, 4vw, 56px);
  width: min(1010px, calc(100% - 48px));
  margin-inline: auto;
}

.tt26-footer__col p,
.tt26-footer__col li {
  margin: 0 0 14px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}

.tt26-footer__col strong {
  font-weight: 600;
}

.tt26-footer__col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.tt26-footer__col--news .tt-newsletter-form {
  display: flex;
  gap: 0;
  max-width: 340px;
}

.tt26-footer__col--news input {
  flex: 1 1 auto;
  min-width: 0;
  height: 60px;
  padding: 0 14px;
  border: 1px solid rgba(255, 255, 255, .6);
  background: transparent;
  color: #fff;
  font-size: 14px;
}

.tt26-footer__col--news input::placeholder {
  color: rgba(255, 255, 255, .7);
}

.tt26-footer__col--news button {
  flex: 0 0 auto;
  height: 60px;
  padding: 0 22px;
  border: 1px solid rgba(255, 255, 255, .6);
  border-left: 0;
  background: transparent;
  color: #fff;
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
  cursor: pointer;
}

.tt26-footer__col--news button:hover {
  background: rgba(255, 255, 255, .16);
}

.tt26-footer__bottom {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  padding: 22px clamp(24px, 5vw, 80px) 30px;
  max-width: 1425px;
  margin-inline: auto;
  border-top: 1px solid rgba(255, 255, 255, .35);
}

.tt26-footer__copy {
  font-size: 12px;
}

.tt26-footer__bottom .tt-footer-logo img {
  height: 26px;
  width: auto;
}

.tt26-footer__bottom .tt-social {
  display: flex;
  gap: 18px;
  justify-self: end;
}

.tt26-footer__bottom .tt-social svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: #fff;
  stroke-width: 1.5;
}

@media (max-width: 900px) {
  .tt26-footer__grid {
    grid-template-columns: 1fr 1fr;
    gap: 32px;
  }

  .tt26-footer__bottom {
    grid-template-columns: 1fr;
    justify-items: center;
    text-align: center;
  }

  .tt26-footer__bottom .tt-social {
    justify-self: center;
  }
}

@media (max-width: 560px) {
  .tt26-footer__grid {
    grid-template-columns: 1fr;
  }
}

body.tt26 .tt-site-footer a {
  color: #fff !important;
  opacity: .92;
}

body.tt26 .tt-site-footer a:hover {
  color: #fff !important;
  opacity: 1;
  text-decoration: underline;
  text-underline-offset: 3px;
}

body.tt26 .tt-site-footer .tt-footer-logo img {
  filter: brightness(0) invert(1);
}

body.tt26 .tt-site-footer svg {
  stroke: #fff;
}

.tt26 .tt-newsletter--footer {
  background: transparent;
}

.tt26 .tt-newsletter h2 {
  font-family: var(--tt26-display);
  font-size: 13px;
  letter-spacing: .2em;
  text-transform: uppercase;
}

.tt26 .tt-newsletter-form input[type="email"],
.tt26 .tt-newsletter-form input[type="text"] {
  height: 46px;
  border: 1px solid var(--tt26-line);
  background: var(--tt26-paper);
  padding: 0 16px;
  font-size: 12px;
}

.tt26 .tt-newsletter-form button {
  height: 46px;
  padding: 0 26px;
  border: 0;
  background: var(--tt26-accent);
  color: #fff;
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
  cursor: pointer;
}

.tt26 .tt-newsletter-form button:hover {
  background: var(--tt26-deep);
}

/* -------------------------------------------------------------------------
   10. Gio hang / thanh toan / tai khoan
   ------------------------------------------------------------------------- */

.tt26 .woocommerce-cart-form table,
.tt26 .shop_table {
  border-collapse: collapse;
  width: 100%;
}

.tt26 .shop_table th {
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--tt26-muted);
  padding: 14px 10px;
  border-bottom: 1px solid var(--tt26-line);
  text-align: left;
}

.tt26 .shop_table td {
  padding: 18px 10px;
  border-bottom: 1px solid var(--tt26-line);
  font-size: 13px;
}

.tt26 .checkout-button,
.tt26 .woocommerce-checkout #place_order,
.tt26 .woocommerce-Button,
.tt26 .wc-block-components-button {
  height: 52px !important;
  border: 0 !important;
  border-radius: 2px !important;
  background: var(--tt26-accent) !important;
  color: #fff !important;
  font-size: 11px !important;
  font-weight: 500 !important;
  letter-spacing: .18em !important;
  text-transform: uppercase;
  box-shadow: none !important;
}

.tt26 .checkout-button:hover,
.tt26 .woocommerce-checkout #place_order:hover {
  background: var(--tt26-deep) !important;
}

.tt26 .woocommerce-message,
.tt26 .woocommerce-info,
.tt26 .woocommerce-error {
  border-top-color: var(--tt26-accent);
  font-size: 13px;
}

/* Ngan keo gio hang / yeu thich */
.tt26 .tt-drawer__panel {
  background: var(--tt26-paper);
}

.tt26 .tt-drawer__header {
  border-bottom: 1px solid var(--tt26-line);
  font-size: 11px;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.tt26 .tt-drawer__primary {
  background: var(--tt26-accent);
  color: #fff;
  border: 0;
}

.tt26 .tt-drawer__primary:hover {
  background: var(--tt26-deep);
}

/* -------------------------------------------------------------------------
   11. Responsive
   ------------------------------------------------------------------------- */

@media (max-width: 1024px) {
  .tt26 .woocommerce ul.products {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 900px) {
  .tt26 .tt-single-product {
    grid-template-columns: 1fr;
  }

  .tt26 .tt-product-main-image {
    min-height: 0;
    aspect-ratio: 1 / 1;
  }

  .tt26 .tt-single-product__summary {
    padding: 32px var(--tt26-gutter) 48px;
  }

  /* Thanh mua hang co dinh duoi day tren dien thoai */
  body.tt26 .tt-mobile-sticky-cta {
    background: var(--tt26-paper) !important;
    border-top: 1px solid var(--tt26-line) !important;
  }

  body.tt26 .tt-mobile-sticky-cta a,
  body.tt26 .tt-mobile-sticky-cta button,
  body.tt26 .tt-mobile-sticky-cta .button {
    background: var(--tt26-accent) !important;
    border-color: var(--tt26-accent) !important;
    color: #fff !important;
    border-radius: 2px !important;
    letter-spacing: .14em !important;
    box-shadow: none !important;
  }
}

@media (max-width: 640px) {
  .tt26 .woocommerce ul.products {
    grid-template-columns: repeat(2, 1fr);
    gap: 32px 16px;
  }

  .tt26 .tt-service-row {
    grid-template-columns: repeat(2, 1fr);
    gap: 26px 0;
  }

  .tt26 .tt26-helprow {
    gap: 18px;
  }

  .tt26 .tt-product-detail-grid {
    grid-template-columns: 1fr;
  }
}

/* =========================================================================
   12. Sua theo so do do lai tren ban thiet ke (2026-09) — nut, thanh loc,
       trang danh muc. Tat ca so o day deu do bang getComputedStyle tren ban
       Framer that o be ngang 1425px.
   ========================================================================= */

/* --- Nut ------------------------------------------------------------------
   Ban thiet ke KHONG dung nut vien. Ca ba nut deu la chu tran:
     DISCOVER      Josefin Sans 20/600/1.2px, mau #7a7a7a, khoi 300x64
     EXPLORE MORE  Red Hat Display 14/600/0.7px, mau trang, khoi 160x44
     Explore more  Red Hat Display 20/400, gach chan, mau den
   Theme cha ve .tt-btn thanh vien bo tron nen phai go bang !important. */
.tt26 .tt26-collection .tt-btn,
body.tt26 .tt26-collection .tt-btn {
  font-family: var(--tt26-alt) !important;
  font-size: clamp(14px, 1.4vw, 20px) !important;
  font-weight: 600 !important;
  letter-spacing: 1.2px !important;
  line-height: 32px !important;
  color: var(--tt26-muted) !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  width: min(300px, 100%);
  height: auto !important;
  min-height: 0 !important;
  padding: 16px 0 !important;
  box-shadow: none !important;
}

.tt26 .tt26-collection .tt-btn:hover,
body.tt26 .tt26-collection .tt-btn:hover {
  color: var(--tt26-ink) !important;
  background: transparent !important;
}

.tt26 .tt26-making__cta,
body.tt26 .tt26-making__cta {
  font-family: var(--tt26-display) !important;
  font-size: clamp(11px, 1vw, 14px) !important;
  font-weight: 600 !important;
  letter-spacing: .7px !important;
  line-height: 22px !important;
  color: #fff !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  width: 160px;
  height: auto !important;
  min-height: 0 !important;
  padding: 11px !important;
  box-shadow: none !important;
}

.tt26 .tt26-making__cta:hover,
body.tt26 .tt26-making__cta:hover {
  color: #fff !important;
  background: transparent !important;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* --- Trang danh muc: anh bia 16:9 tran vien, KHONG co tieu de -------------
   Ban thiet ke chi co mot anh ti le 16/9 ngay duoi header. */
.tt26-cathero {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--tt26-mist);
}

.tt26-cathero img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* --- Thanh loc ------------------------------------------------------------
   Do duoc: FILTER BY: Red Hat Display 20/500/1px mau #1c1c1c;
   ten bo loc cung font nhung mau #7a7a7a. Khong vien, khong nen.
   Luu y: theme cha co quy tac `select{width:100%}` — phai dat width:auto,
   khong thi ba o loc bi keo dai het hang va xep chong len nhau. */
/* Do lai tren ban thiet ke: anh bia ket thuc o 921, khoi loc cao 240 bat dau
   o 971 (cach 50), nhan can giua theo chieu doc, luoi san pham bat dau o
   1311 (cach 100 duoi khoi loc). Nhan "FILTER BY:" thut vao 21px so voi mep
   luoi, khoang cach giua cac muc do duoc ~70px. */
.tt26 .tt26-filterbar,
body.tt26 .tt26-filterbar {
  display: flex;
  align-items: center;
  /* Khe 70px do duoc tren ban thiet ke la khe giua cac o chon RAT HEP
     (chi chua dung chu TYPE/METAL/STONE/PRICE). O chon cua minh mang
     nhan that nen rong hon; thu hep khe lai de nhip chung van giong. */
  gap: clamp(20px, 2vw, 30px);
  flex-wrap: wrap;
  min-height: clamp(90px, 16.85vw, 240px);
  padding: 0 0 0 21px;
  margin-top: clamp(20px, 3.5vw, 50px);
  margin-bottom: clamp(40px, 14vw, 200px);
  border-bottom: 0;
}

.tt26 .tt26-filterbar__label,
body.tt26 .tt26-filterbar__label {
  font-family: var(--tt26-display);
  font-size: clamp(14px, 1.4vw, 20px);
  font-weight: 500;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--tt26-ink);
}

.tt26 .tt26-filterbar select,
body.tt26 .tt26-filterbar select {
  width: auto !important;
  min-width: 0;
  height: auto !important;
  padding: 0 20px 0 0 !important;
  border: 0 !important;
  background-color: transparent !important;
  color: var(--tt26-muted) !important;
  font-family: var(--tt26-display) !important;
  font-size: clamp(14px, 1.4vw, 20px) !important;
  font-weight: 500 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase;
  appearance: none;
  background-image: linear-gradient(45deg, transparent 50%, var(--tt26-muted) 50%),
                    linear-gradient(135deg, var(--tt26-muted) 50%, transparent 50%);
  background-position: calc(100% - 9px) center, calc(100% - 4px) center;
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  cursor: pointer;
}

.tt26 .tt26-filterbar select:focus,
body.tt26 .tt26-filterbar select:focus {
  outline: none;
  color: var(--tt26-ink) !important;
}

/* --- Luoi san pham trang danh muc ----------------------------------------
   Do duoc: 4 cot, the rong 294, khe 30px, khung noi dung 1266 tren 1425
   (le 80px moi ben). */
.tt26 .tt-shop-page,
body.tt26 .tt-shop-page {
  width: min(1266px, calc(100% - 160px));
  margin-inline: auto;
  padding-top: 0;
  padding-bottom: clamp(50px, 6vw, 90px);
}

.tt26 .tt-shop-page .woocommerce ul.products,
.tt26 .tt-shop-page ul.products,
body.tt26 .tt-shop-page ul.products {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 30px !important;
}

@media (max-width: 1024px) {
  .tt26 .tt-shop-page,
  body.tt26 .tt-shop-page {
    width: min(1266px, calc(100% - 48px));
  }

  .tt26 .tt-shop-page ul.products,
  body.tt26 .tt-shop-page ul.products {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media (max-width: 640px) {
  .tt26 .tt-shop-page ul.products,
  body.tt26 .tt-shop-page ul.products {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
  }

  .tt26 .tt-product-card__body,
  body.tt26 .tt-product-card__body {
    padding: 12px !important;
    min-height: 0;
  }
}

/* -------------------------------------------------------------------------
   13. Trang san pham — so do lai tren /leonie cua ban thiet ke (1425px)
   ------------------------------------------------------------------------- */

/* ADD TO CART: Josefin Sans 15/500/2.1px, chu trang, khoi 545x58 */
.tt26 .tt-single-product .single_add_to_cart_button,
body.tt26 .tt-single-product .single_add_to_cart_button {
  font-family: var(--tt26-alt) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  letter-spacing: 2.1px !important;
  color: #fff !important;
}

/* Learn more: Red Hat Display 14/400, mau #799baf */
.tt26 .tt26-learn-more,
body.tt26 .tt26-learn-more {
  font-family: var(--tt26-display);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: normal;
  text-transform: none;
  color: var(--tt26-accent);
  text-decoration: none;
}

.tt26 .tt26-learn-more:hover {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* NEED HELP? / SIZE GUIDE / FREE SHIPPING: Red Hat Display 13/500/1.3px,
   mau xanh dam #0e495e */
.tt26 .tt26-helprow a,
body.tt26 .tt26-helprow a,
.tt26 .tt26-shipnote,
.tt26 .tt26-shipnote strong,
body.tt26 .tt26-shipnote {
  font-family: var(--tt26-display) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 1.3px !important;
  color: var(--tt26-deep) !important;
}

/* Khoi DESCRIPTION / DETAILS: hai cot 689 va 496, le trong 120px,
   tieu de 16/600/1.92px, nhan phu 13/500/1.3px nam rieng mot dong. */
.tt26 .tt-product-detail-grid,
body.tt26 .tt-product-detail-grid {
  display: grid;
  grid-template-columns: 689fr 496fr;
  gap: 0;
  width: min(1185px, calc(100% - 240px));
  margin-inline: auto;
}

.tt26 .tt-product-detail-grid > article > p {
  max-width: 496px;
}

.tt26 .tt-product-detail-grid p strong,
body.tt26 .tt-product-detail-grid p strong {
  display: block;
  font-family: var(--tt26-display) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  letter-spacing: 1.3px !important;
  text-transform: uppercase;
  color: #000 !important;
  margin-bottom: 2px;
}

/* Dai anh lon sau DETAILS. Ban thiet ke: anh 1260x1361, khe 40px, truot
   ngang va bi cat o hai mep — khong co thanh cuon nhin thay. */
.tt26-shots {
  margin: clamp(40px, 6vw, 90px) 0;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.tt26-shots::-webkit-scrollbar {
  display: none;
}

.tt26-shots__track {
  display: flex;
  gap: 40px;
  width: max-content;
  padding-inline: 40px;
}

.tt26-shot {
  margin: 0;
  flex: 0 0 auto;
  width: min(1260px, 86vw);
  aspect-ratio: 1260 / 1361;
  overflow: hidden;
  scroll-snap-align: center;
  background: var(--tt26-mist);
}

.tt26-shot img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

/* Tieu de BEST SELLER tren TRANG SAN PHAM nho hon o trang chu:
   do duoc Josefin Sans 20/600/1.2px, mau #3b3b3b. */
body.tt26.single-product .tt26-best .tt26-heading {
  font-size: 20px !important;
  font-weight: 600 !important;
  letter-spacing: 1.2px !important;
  color: #3b3b3b;
}

/* Nhan het hang — ban thiet ke khong co nhan trang thai, o day chi hien
   khi san pham that su het hang. */
.tt26 .tt-stock-dot--out {
  font-family: var(--tt26-display);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1.3px;
  color: #b23b3b;
}

@media (max-width: 900px) {
  .tt26 .tt-product-detail-grid,
  body.tt26 .tt-product-detail-grid {
    grid-template-columns: 1fr;
    width: min(1185px, calc(100% - 48px));
    gap: 34px;
  }

  .tt26-shots__track {
    gap: 16px;
    padding-inline: 16px;
  }

  .tt26-shot {
    width: min(1260px, 88vw);
  }
}

/* -------------------------------------------------------------------------
   14. The san pham — thang do uu tien cua theme cha

   Theme cha co mot loat quy tac rat manh cho trang KHONG PHAI trang chu:

     body:not(.home) ul.products li.product.tt-product-card .tt-product-card__body
     { padding:13px 0 0 !important; text-align:left !important; ... }

   do uu tien (0,5,3) + !important, cao hon moi selector .tt26 ... o tren nen
   the san pham o trang danh muc van giu kieu cu. Them "html" phia truoc de
   dat (0,5,4) va gianh lai. Tat ca so o day do tren ban thiet ke:
   anh ti le 618/513 · phan chu cao 89, dem 20px, can giua, nen trang
   · ten Red Hat Display 20/600/1px · gia Red Hat Display 14/500/0.7px #737373
   ------------------------------------------------------------------------- */

html body.tt26 ul.products li.product.tt-product-card,
html body.tt26 .tt26-rail ul.products li.product {
  background: var(--tt26-paper) !important;
}

html body.tt26 ul.products li.product.tt-product-card > .tt-product-card__image,
html body.tt26 .tt26-grid2 ul.products li.product .tt-product-card__image {
  aspect-ratio: 618 / 513 !important;
  height: auto !important;
}

html body.tt26 .tt26-rail ul.products li.product .tt-product-card__image {
  aspect-ratio: 340 / 283 !important;
  height: auto !important;
}

html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body {
  display: block !important;
  min-height: 89px !important;
  padding: 20px !important;
  text-align: center !important;
  background: var(--tt26-paper) !important;
}

html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body h2,
html body.tt26 ul.products li.product.tt-product-card .woocommerce-loop-product__title {
  margin: 0 0 4px !important;
  font-family: var(--tt26-display) !important;
  font-size: clamp(14px, 1.45vw, 20px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  letter-spacing: 1px !important;
  text-align: center !important;
  text-transform: uppercase !important;
  color: var(--tt26-ink) !important;
}

html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body .tt-price,
html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body .price,
html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body .amount {
  font-family: var(--tt26-display) !important;
  font-size: clamp(11px, 1.02vw, 14px) !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
  letter-spacing: .7px !important;
  text-align: center !important;
  color: #737373 !important;
}

/* Ban thiet ke chi hien TEN va GIA tren the. Dong mo ta ngan cua theme cha
   khong co trong thiet ke — an di, noi dung do van con o trang san pham. */
html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body p {
  display: none !important;
}

@media (max-width: 640px) {
  html body.tt26 ul.products li.product.tt-product-card .tt-product-card__body {
    min-height: 0 !important;
    padding: 12px !important;
  }
}

/* -------------------------------------------------------------------------
   15. Khoang cach dau trang

   Header cua theme cha la position:fixed cao 120px va noi dung bat dau tu
   y=0, nen moi trang khong co anh bia tran vien deu bi header che mat 120px
   dau. Ban thiet ke: trang chu de video chay duoi header (header trang duc
   che 119px dau), con trang danh muc va trang san pham thi noi dung bat dau
   NGAY DUOI header.
   ------------------------------------------------------------------------- */

.tt26-cathero {
  margin-top: 120px;
}

body.tt26 .tt-single-product {
  padding-top: 120px !important;
}

@media (max-width: 720px) {
  .tt26-cathero {
    margin-top: 58px;
  }

  body.tt26 .tt-single-product {
    padding-top: 58px !important;
  }
}

@media (max-width: 900px) {
  .tt26 .tt-single-product__summary,
  body.tt26 .tt-single-product__summary {
    padding: 32px var(--tt26-gutter) 48px !important;
  }
}

/* MAIN MATERIAL tren trang san pham: Red Hat Display 14/500/1.4px, mau
   #799baf, thut vao 24px — do tren ban thiet ke. */
.tt26 .tt26-material-line,
body.tt26 .tt26-material-line {
  margin: 30px 0 0;
  font-family: var(--tt26-display) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: 1.4px !important;
  text-transform: uppercase;
  color: var(--tt26-accent) !important;
}

/* =========================================================================
   16. Dot danh bong (2026-09) — sua nhung cho nhin tan mat thay chua dep
   ========================================================================= */

/* --- 1. Mau nen cho o anh khi anh chua tai xong -------------------------
   Theme cha dat `background:#79bfdc!important` (xanh dam) cho khung anh san
   pham. Tren nen #f2f2f2 cua thiet ke moi, ca luoi loe xanh trong luc anh
   dang tai roi moi hien anh — rat chuong mat. Doi sang mau khoi trung tinh. */
html body.tt26 ul.products li.product.tt-product-card > .tt-product-card__image,
html body.tt26 .tt-product-card__image,
html body.tt26 .tt-product-carousel .tt-product-card__image {
  background: var(--tt26-mist) !important;
}

/* --- 2. Bo anh "lifestyle" hien khi ro chuot ----------------------------
   Theme cha gan cung MOT tam lifestyle-hand.jpg cho MOI san pham. Ro chuot
   len bat cu the nao cung ra dung tam anh ban tay do — vua lap vua sai voi
   khuyen tai / vong co. Giu hieu ung phong to nhe da co san. */
html body.tt26 .tt-product-card__img--hover {
  display: none !important;
}

/* --- 3. Nhan o bo suu tap giu nguyen kieu chu goc -----------------------
   Ban thiet ke viet "Blauwe bloem" chu thuong, khong phai chu hoa toan bo. */
.tt26-tile__label {
  text-transform: none;
}

/* --- 4. Khoi OUR BLOGS — do lai tren ban thiet ke -----------------------
   phu de Red Hat Display 16/400/0.8px #737373 (chu hoa)
   anh 414x300, khe 12 · tieu de RHD 20/500/1px · trich dan RHD 15/500/0.75px
   the KHONG co nen trang, chu thut vao 16px. */
.tt26-blogs__sub {
  font-family: var(--tt26-display);
  font-size: clamp(12px, 1.12vw, 16px);
  font-weight: 400;
  letter-spacing: .8px;
  color: #737373;
}

.tt26-blog-grid {
  gap: 12px;
}

.tt26-blog-card {
  background: transparent;
}

.tt26-blog-card h3 {
  margin: 0 0 5px;
  padding: 16px 16px 0;
  font-size: clamp(15px, 1.4vw, 20px);
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 1.2;
}

.tt26-blog-card p {
  padding: 0 16px 16px;
  font-family: var(--tt26-display);
  font-size: clamp(12px, 1.05vw, 15px);
  font-weight: 500;
  letter-spacing: .75px;
  line-height: 1.3;
  color: #737373;
}

/* --- 5. Hai nut mui ten -------------------------------------------------
   Truoc day la hai dau ngoac nhon tran, roi dung vao khe giua hai hang the
   nen trong nhu ky tu lac cho. Boc trong mot dia tron trang de doc ra ngay
   la nut dieu khien. */
.tt26-collection__arrow {
  width: 39px;
  height: 39px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .94);
  box-shadow: 0 2px 14px rgba(28, 28, 28, .12);
  transition: opacity .2s ease, background-color .2s ease, box-shadow .2s ease;
}

.tt26-collection__arrow:hover {
  background: #fff;
  box-shadow: 0 4px 18px rgba(28, 28, 28, .18);
}

.tt26-collection__arrow svg {
  width: 20px;
  height: 20px;
}

.tt26-collection__arrow[disabled] {
  opacity: 0;
  pointer-events: none;
}

/* --- 6. Thanh loc khong duoc xuong dong xau -----------------------------
   O be ngang trung binh bon o loc khong du cho, PRICE bi day xuong hang hai
   va treo lo lung trong khoi cao 240. Bop khoang cach lai truoc khi den
   nuoc do; neu van phai xuong dong thi cho hai hang sat nhau. */
.tt26 .tt26-filterbar,
body.tt26 .tt26-filterbar {
  align-content: center;
  row-gap: 16px;
}

@media (max-width: 1280px) {
  .tt26 .tt26-filterbar,
  body.tt26 .tt26-filterbar {
    gap: 28px;
    row-gap: 16px;
  }
}

@media (max-width: 900px) {
  .tt26 .tt26-filterbar,
  body.tt26 .tt26-filterbar {
    gap: 18px;
    row-gap: 14px;
    min-height: 0;
    padding: 0;
    margin-top: 28px;
    margin-bottom: 34px;
  }
}

/* --- 7. Dai cam ket -----------------------------------------------------
   Truoc day o be ngang trung binh no vo thanh 3 + 2, hang duoi lech han.
   Giu du 5 muc tren mot hang lau nhat co the, roi chuyen han sang dai truot
   ngang thay vi de mot hang thua hai muc. */
@media (max-width: 900px) {
  .tt26-promises {
    grid-template-columns: repeat(5, 1fr);
    gap: 12px;
    padding: 44px 16px;
  }

  .tt26-promise__icon {
    height: 44px;
  }
}

@media (max-width: 760px) {
  .tt26-promises {
    display: flex;
    grid-template-columns: none;
    gap: 22px;
    padding: 36px 16px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }

  .tt26-promises::-webkit-scrollbar {
    display: none;
  }

  .tt26-promise {
    flex: 0 0 108px;
    scroll-snap-align: center;
  }

  .tt26-promise__icon {
    height: 40px;
  }
}

/* --- 8. Luoi blog o be ngang trung binh ---------------------------------
   Truoc day duoi 900px la mot cot, anh keo cao gan het man hinh. */
@media (max-width: 900px) {
  .tt26-blog-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

@media (max-width: 600px) {
  .tt26-blog-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }
}

/* --- 9. Hai nut mui ten cua BEST SELLER bi van ra khoi khoi ---------------
   .tt26-collection__arrow la position:absolute, nhung .tt26-best lai khong
   co position:relative nen hai nut nay neo vao <body>: chung noi len tan
   dau trang, de chong len anh bia trang danh muc trong nhu hai ky tu lac.
   .tt26-collection da co relative tu truoc nen khong bi. */
.tt26-best {
  position: relative;
}

/* --- 10. Dai trang thua duoi wordmark tren may tinh bang / dien thoai -----
   Theme cha khoa `body .tt-site-header{height:120px}`. Duoi 900px hang nav
   bi an di nen phan noi dung chi con cao 58, nhung khung header van cao 120
   -> thua mot dai trang 62px, va anh bia (dat cach dinh 58) bi header de len
   mat mot khuc. Cho header cao theo noi dung. */
@media (max-width: 720px) {
  body.tt26 .tt-site-header,
  .tt26 .tt-site-header {
    height: auto;
  }
}

/* --- 11. Dieu huong o khoang 721-900px ----------------------------------
   Loi: lop giao dien moi an hang nav tu 900px tro xuong, con theme cha chi
   hien nut ba gach tu 720px tro xuong -> tu 721 den 900 khach khong co menu
   nao de bam. Sua bang cach giu hang nav den dung moc 720 cua theme cha, va
   bop lai cho vua o khoang giua. */
@media (min-width: 721px) and (max-width: 1100px) {
  .tt26 .tt-header-nav-row,
  body.tt26 .tt-header-nav-row,
  body.tt26.single-product .tt-header-nav-row,
  body.tt26.woocommerce-cart .tt-header-nav-row,
  body.tt26.woocommerce-checkout .tt-header-nav-row,
  body.tt26.page-child .tt-header-nav-row {
    padding: 0 12px 0 44px !important;
  }

  .tt26 .tt-menu {
    gap: clamp(10px, 2.4vw, 28px);
  }

  .tt26 .tt-menu a,
  body.tt26 .tt-menu a {
    font-size: 12px !important;
    letter-spacing: .5px !important;
  }

  .tt26 .tt-header-icons > a[href*="?s"] {
    left: 12px;
  }

  .tt26 .tt-header-icons {
    gap: 12px;
  }
}

/* Duoi 720px thi theme cha da co nut ba gach — an hang nav di. */
@media (max-width: 720px) {
  .tt26 .tt-header-nav-row,
  body.tt26 .tt-header-nav-row,
  body.tt26.single-product .tt-header-nav-row,
  body.tt26.woocommerce-cart .tt-header-nav-row,
  body.tt26.woocommerce-checkout .tt-header-nav-row,
  body.tt26.page-child .tt-header-nav-row {
    display: none !important;
  }

  .tt26 .tt-header-logo-row,
  body.tt26 .tt-header-logo-row {
    height: 58px !important;
  }
}

/* --- 12. Nhip doc trong cot chu trang san pham -------------------------
   Do lai tren ban thiet ke: tu "Learn more" xuong "MAIN MATERIAL" la 44px
   (truoc day la 79 vi form gio hang co san margin-top 26 cong them 30 cua
   dong chat lieu), va nut ADD TO CART cach o chon size 14px chu khong dinh
   sat vao nhau. */
.tt26 .tt-single-product__summary form.cart,
body.tt26 .tt-single-product__summary form.cart {
  margin-top: 0;
}

.tt26 .tt26-material-line,
body.tt26 .tt26-material-line {
  margin-top: 22px;
}

.tt26 .tt-single-product .single_add_to_cart_button,
body.tt26 .tt-single-product .single_add_to_cart_button {
  margin-top: 14px;
}

/* --- 13. Mui ten cheo canh chu "Explore more" ---------------------------
   Ban thiet ke co mot bieu tuong mui ten cheo 18x18, net 1.5, dat sau chu. */
.tt26-tile__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.tt26-tile__more svg {
  width: 18px;
  height: 18px;
  flex: 0 0 18px;
}

/* =========================================================================
   17. Footer — do lai tren ban thiet ke (khung 1425)

     dai mau #76a8c4 cao 440
     NAM cot, tieu de deu cach dinh dai 51px:
       Contact Information (x=260) · EXPLORE (660) · SUPPORT (808)
       · Connect (965) · NEWSLETTER (o Email x=835 w=319, Submit x=1233)
     tieu de cot   Red Hat Display 20 / 600 / gian 1px, chu hoa, mau trang
     muc trong cot Red Hat Display 16 / 400 / gian 0.8px, cach nhau 39px
     nhan dam      Red Hat Display 16 / 600 / gian 0.8px
     nut Submit    Red Hat Display 10 / 500 / gian 1px
     hang duoi     qua cau + ENG (US) ben trai, ba icon 16px ben phai
   ========================================================================= */

body.tt26 .tt-site-footer h2 {
  letter-spacing: 1px !important;
  margin: 0 0 22px;
}

.tt26-footer__grid {
  grid-template-columns: 1.75fr 1fr 1.06fr 1.06fr 1.6fr;
  gap: 0 clamp(16px, 1.4vw, 20px);
  padding: clamp(34px, 3.6vw, 51px) 0 clamp(26px, 3vw, 44px);
  width: min(1016px, calc(100% - 48px));
}

/* Ban thiet ke dung Red Hat Display cho ca cot lien he lan cac cot menu,
   gian chu 0.8px, cac dong cach nhau 39px. */
.tt26-footer__col p,
.tt26-footer__col li,
body.tt26 .tt26-footer__col p,
body.tt26 .tt26-footer__col li {
  margin: 0 0 15px;
  font-family: var(--tt26-display) !important;
  font-size: clamp(13px, 1.12vw, 16px) !important;
  font-weight: 400 !important;
  letter-spacing: .8px !important;
  line-height: 1.5;
}

.tt26-footer__col strong,
body.tt26 .tt26-footer__col strong {
  font-family: var(--tt26-display) !important;
  font-weight: 600 !important;
  letter-spacing: .8px !important;
}

.tt26-footer__col a,
body.tt26 .tt26-footer__col a {
  font-family: var(--tt26-display) !important;
  letter-spacing: .8px !important;
}

/* Nut gui email — ban thiet ke la chu tran, khong phai nut dac. */
body.tt26 .tt-site-footer .tt-newsletter-form button,
body.tt26 .tt26-footer__col--news button {
  font-family: var(--tt26-display) !important;
  font-size: 10px !important;
  font-weight: 500 !important;
  letter-spacing: 1px !important;
  text-transform: uppercase;
}

/* Hang duoi: nut doi ngon ngu ben trai, icon mang xa hoi ben phai. */
.tt26-footer__bottom {
  display: flex;
  align-items: center;
  gap: 20px;
}

.tt26-footer__lang {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-right: auto;
}

.tt26-footer__lang svg {
  width: 24px;
  height: 24px;
  flex: 0 0 24px;
  stroke: currentColor;
  fill: none;
  stroke-width: 1.3;
}

.tt26-footer__lang a,
body.tt26 .tt26-footer__lang a,
.tt26-footer__lang span,
body.tt26 .tt26-footer__lang span {
  font-family: var(--tt26-display) !important;
  font-size: clamp(13px, 1.12vw, 16px) !important;
  font-weight: 500 !important;
  letter-spacing: .8px !important;
  text-transform: uppercase;
  color: #fff !important;
}

.tt26-footer__lang a[aria-current="true"] {
  text-decoration: underline;
  text-underline-offset: 4px;
}

body.tt26 .tt26-footer__bottom .tt-social svg {
  width: 16px;
  height: 16px;
}

@media (max-width: 1024px) {
  .tt26-footer__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 30px 24px;
  }
}

@media (max-width: 640px) {
  .tt26-footer__grid {
    grid-template-columns: 1fr;
    gap: 26px;
  }

  .tt26-footer__bottom {
    flex-wrap: wrap;
    gap: 14px;
  }
}

/* O nhap email trong footer — ban thiet ke: Red Hat Display 16px/400/0.8px,
   khong vien, chi mot duong gach chan mo. */
body.tt26 .tt-site-footer .tt-newsletter-form input {
  font-family: var(--tt26-display) !important;
  font-size: clamp(13px, 1.12vw, 16px) !important;
  letter-spacing: .8px !important;
}

/* Cot dau (thong tin lien he) trong ban thiet ke rong gan gap ba cot menu. */
.tt26-footer__grid {
  grid-template-columns: 1.9fr 0.85fr 0.95fr 0.8fr 1.55fr;
}

/* Tieu de the blog — theme cha ep `body h1,h2,h3...{font-family:var(--tt-body)
   !important}` (tuc Inter) cho MOI tieu de, nen quy tac khong co !important o
   tren bi thua. Ban thiet ke: Red Hat Display 20 / 500 / gian 1px. */
body.tt26 .tt26-blog-card h3 {
  font-family: var(--tt26-display) !important;
  font-weight: 500 !important;
  letter-spacing: 1px !important;
}

/* Chan be ngang o chon: mot the <select> tu gian bang lua chon DAI NHAT trong
   danh sach, nen nhan dai lam ca hang loc gian gap ruoi ban thiet ke. */
.tt26 .tt26-filterbar select,
body.tt26 .tt26-filterbar select {
  max-width: 168px;
  text-overflow: ellipsis;
}

/* --- Khoi NEWSLETTER trong footer -----------------------------------------
   Ban thiet ke: mot o nhap rong 319px chi co duong gach chan mo, chu "Submit"
   nam ben phai cung hang — khong phai o nhap ti hon canh mot nut den dac nhu
   theme cha ve. */
body.tt26 .tt26-footer__col--news .tt-newsletter-form {
  display: flex;
  align-items: center;
  gap: 16px;
  max-width: 360px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(255, 255, 255, .55);
}

body.tt26 .tt-site-footer .tt-newsletter-form input {
  flex: 1 1 auto;
  width: auto;
  min-width: 0;
  height: auto;
  padding: 0;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #fff !important;
  box-shadow: none !important;
}

body.tt26 .tt-site-footer .tt-newsletter-form input::placeholder {
  color: rgba(255, 255, 255, .75);
}

body.tt26 .tt-site-footer .tt-newsletter-form button {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #fff !important;
  box-shadow: none !important;
  cursor: pointer;
}

body.tt26 .tt-site-footer .tt-newsletter-form button:hover {
  background: transparent !important;
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Dong thong tin doanh nghiep o chan trang — chu nho, mo hon phan con lai. */
.tt26-footer__legal,
body.tt26 .tt26-footer__legal {
  width: min(1016px, calc(100% - 48px));
  margin: 0 auto 18px;
  font-family: var(--tt26-display);
  font-size: clamp(10px, 0.84vw, 12px);
  font-weight: 400;
  letter-spacing: .4px;
  line-height: 1.6;
  color: rgba(255, 255, 255, .78) !important;
}

/* =========================================================================
   18. Sua ba cho do sai o man hinh RONG HON 1425px

   Truoc day toan bo so do lay tren ban thiet ke o be ngang 1425. O be ngang
   do moi con so deu khop, nhung minh da bien so do NGAY DO thanh gioi han
   cung — nen tu 1425 tro len giao dien khong con giong mau nua.

   Do lai tren ban mau o ba be ngang 1425 / 1536 / 1920:

   a) Khung noi dung  mau: 1265 / 1361 / 1400   ta: 1265 / 1265 / 1265
      -> mau la calc(100% - 160px) voi TRAN 1400, khong phai tran 1265.

   b) O bo suu tap    mau cao 1361 o CA BA be ngang, chi be rong no ra
      ta lay aspect-ratio nen cao theo be rong: 1361 / 1457 / 1854.

   c) Dai cam ket     mau: nam khoi 5 muc CAN GIUA, moi muc rong 11% be ngang
      (157 / 167 / 210 -> dung 11.0% o ca ba moc)
      ta: luoi 5 cot dan het chieu ngang, rong gap doi.
   ========================================================================= */

.tt26-collection__inner,
.tt26-blogs__inner {
  width: min(1400px, calc(100% - 160px));
}

.tt26 .tt-shop-page,
body.tt26 .tt-shop-page {
  /* Do lai tren trang /collection cua ban mau o ba be ngang:
       1425 -> luoi rong 1250, le trai 80
       1536 -> luoi rong 1361, le trai 80
       1920 -> luoi rong 1746, le trai 80
     Tuc la calc(100% - 160px) va KHONG co tran. Khoi blog moi co tran 1400.
     Truoc day toi ap tran 1400 cho ca hai nen tu ~1560 tro len thanh loc va
     luoi san pham bi bo hep lai, khong giong mau. */
  width: calc(100% - 160px);
}

/* O bo suu tap: giu ti le o man hinh hep, nhung khong cao qua 1361 nhu mau. */
.tt26-tile__media {
  max-height: 1361px;
}

/* Dai cam ket: nam khoi can giua, moi muc 11% be ngang, khong dan ra hai mep. */
.tt26-promises {
  display: flex;
  grid-template-columns: none;
  justify-content: center;
  align-items: center;
  gap: 0;
}

.tt26-promise {
  flex: 0 0 11%;
  min-width: 0;
}

@media (max-width: 900px) {
  .tt26-promises {
    justify-content: center;
    gap: 12px;
  }

  .tt26-promise {
    flex: 0 0 auto;
    width: 17%;
  }
}

/* Anh blog: cung kieu voi o bo suu tap — ban mau giu chieu cao 300 co dinh
   (do o ca 1425 / 1536 / 1920 deu la 300), chi be rong no ra. */
.tt26-blog-card img {
  max-height: 300px;
}

/* -------------------------------------------------------------------------
   Tra lai le hai ben cho man hinh hep.

   Khoi muc 18 o tren nam SAU cac @media cu trong cung tep, ma @media khong
   lam tang do uu tien — nen tu ban 3.8.0 no da de len luon quy tac danh cho
   may tinh bang va dien thoai: moi be ngang deu bi tru 160px. Tren dien thoai
   390px thi noi dung chi con 230px, chat cung.

   Ba dong duoi tra lai dung so cu: 64px cho khoi bo suu tap / blog duoi 1100,
   48px cho trang cua hang duoi 1024, va 24px o dien thoai.
   ------------------------------------------------------------------------- */

@media (max-width: 1100px) {
  .tt26-collection__inner,
  .tt26-blogs__inner {
    width: calc(100% - 64px);
  }
}

@media (max-width: 1024px) {
  .tt26 .tt-shop-page,
  body.tt26 .tt-shop-page {
    width: calc(100% - 48px);
  }
}

@media (max-width: 640px) {
  .tt26-collection__inner,
  .tt26-blogs__inner,
  .tt26 .tt-shop-page,
  body.tt26 .tt-shop-page {
    width: calc(100% - 24px);
  }
}