/* 1clicktee — TRANG PHỤ của sản phẩm (G2, 12/11/2026): /orders, /orders/<code>, /d/<id>, /size-guide, /shipping, 404.
   Đổi nội dung = đổi tên file (cache 7 ngày). Chỉ class .otpg-* (token/nút/ô nhập chung ở base-1211a.css; khung ảnh,
   chấm màu, bảng size ở shop-1211a.css — trang nào dùng thì nạp thêm). Không màu ngoài token --ot-*.
   T1 13/11 → pages-1311e.css (pages-1211a.css giữ tại chỗ): khoảng trắng trước footer ≤32px (phần chừa dải tab đáy do body lo,
   base-1311e.css), nền ô "More designs" theo mực của mẫu, đoạn văn /shipping ≤68ch, vùng chạm 40px trên màn chạm.
   U2 13/11 → pages-1311g.css (pages-1311e.css giữ tại chỗ): tiêu đề lớn trang con không tràn ngang ở mọi ngữ (cuối file). */

.otpg [hidden]{display:none!important}
.otpg{padding:40px 0 32px}
.otpg-h1{font-size:88px;line-height:.9;margin:12px 0 0}
.otpg-h2{font-size:40px;line-height:.95;margin:0 0 18px}
.otpg-sub{margin:14px 0 0;max-width:60ch;font-size:16px;line-height:1.55;color:var(--ot-muted)}
.otpg-back{margin:0 0 18px;text-decoration:none;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.otpg-back:hover{text-decoration:underline}
.otpg-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin:0 0 32px;padding:0 0 28px;border-bottom:var(--ot-bw) solid var(--ot-ink)}
.otpg-head__t{min-width:0}
.otpg-msg:empty{display:none}
.otpg-msg .ot-alert{margin:0 0 18px}
.otpg-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.otpg-tba{font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ot-accent-2)}

/* ── chip trạng thái đơn ── */
.otpg-st{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 10px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r-sm);font-size:11px;font-weight:800;line-height:1;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.otpg-st::before{content:"";flex:none;width:7px;height:7px;background:currentColor}
.otpg-st--paid{background:transparent;color:var(--ot-ink)}
.otpg-st--in_production{background:var(--ot-accent);color:var(--ot-ink)}
.otpg-st--in_production::before{background:var(--ot-ink)}
.otpg-st--shipped{background:var(--ot-ink);color:var(--ot-on-ink)}
.otpg-st--shipped::before{background:var(--ot-accent)}
.otpg-st--delivered{background:var(--ot-ink);color:var(--ot-on-ink)}
.otpg-st--delivered::before{width:9px;height:5px;background:transparent;border-left:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg) translate(1px,-1px)}
.otpg-st--cancelled,.otpg-st--refunded{border-color:var(--ot-muted);color:var(--ot-muted);background:transparent}
.otpg-st--cancelled::before,.otpg-st--refunded::before{width:8px;height:1.5px}
.otpg-st--lg{height:36px;padding:0 14px;font-size:12px}

/* ── /orders ── */
.otpg-search{flex:none;width:min(420px,100%)}
.otpg-search__row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px}
.otpg-search .ot-input::-webkit-search-cancel-button{cursor:pointer}
.otpg-list{margin:0;padding:0;list-style:none}
.otpg-msg:not(:empty)+.otpg-list{border-top:var(--ot-bw) solid var(--ot-ink)}
.otpg-card{border-bottom:var(--ot-bw) solid var(--ot-ink)}
.otpg-card__a{display:grid;grid-template-columns:120px minmax(0,1fr) auto 20px;align-items:center;gap:24px;padding:18px 8px 18px 0;margin:0;color:var(--ot-ink);text-decoration:none;transition:background-color .15s}
.otpg-card__a:hover{background:var(--ot-paper)}
.otpg-card__a:hover .otpg-card__go{transform:translateX(4px)}
.otpg-card__a:focus-visible{outline-offset:-2px}
.otpg-card__img{display:block;width:120px;height:120px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r-sm);background:var(--ot-bg);overflow:hidden}
.otpg-card__img img{width:100%;height:100%;object-fit:contain}
.otpg-card__noimg{display:flex;align-items:center;justify-content:center;width:100%;height:100%;padding:8px;font-size:10px;font-weight:800;letter-spacing:.1em;line-height:1.3;text-align:center;text-transform:uppercase;color:var(--ot-muted);background:repeating-linear-gradient(45deg,transparent 0 8px,var(--ot-line-soft) 8px 9px)}
.otpg-card__main{display:flex;flex-direction:column;gap:4px;min-width:0}
.otpg-card__code{font-family:var(--ot-display);font-size:34px;line-height:1;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.otpg-card__date{font-size:13px;font-weight:700;color:var(--ot-muted)}
.otpg-card__line{font-size:15px;line-height:1.4;overflow-wrap:anywhere}
.otpg-card__side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.otpg-card__total{font-size:22px;font-weight:800;font-variant-numeric:tabular-nums}
.otpg-card__go{flex:none;transition:transform .15s var(--ot-ease)}
.otpg-more{display:flex;justify-content:center;margin-top:28px}
.otpg-more__end{margin:0;font-size:12px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--ot-muted)}
.otpg-empty{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:48px;align-items:end;padding:8px 0 24px}
.otpg-empty__big{margin:0;font-size:152px;line-height:.95;color:var(--ot-ink)}
.otpg-empty__big::after{content:"";display:block;width:96px;height:12px;margin-top:20px;background:var(--ot-accent)}
.otpg-empty__t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.otpg-empty__b{margin:0 0 22px;font-size:18px;line-height:1.5}

/* ── /orders/<code> ── */
.otpg-odhead{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 0 28px}
.otpg-odcode{font-variant-numeric:tabular-nums}
.otpg-prog{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 36px;padding:24px 0 0;list-style:none;border-top:var(--ot-bw) solid var(--ot-ink)}
.otpg-prog::before,.otpg-prog::after{content:"";position:absolute;top:41px;left:18px;height:3px}
.otpg-prog::before{right:calc(25% - 18px);background:var(--ot-line-soft)}
.otpg-prog::after{width:calc(75% * var(--prog,0));background:var(--ot-ink)}
.otpg-prog__s{position:relative;display:flex;flex-direction:column;gap:6px;min-width:0;padding-right:12px}
.otpg-prog__dot{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border:var(--ot-bw) solid var(--ot-ink);border-radius:50%;background:var(--ot-bg);font-size:13px;font-weight:800}
.otpg-prog__s.is-done .otpg-prog__dot{background:var(--ot-ink);color:var(--ot-on-ink)}
.otpg-prog__s.is-now .otpg-prog__dot{background:var(--ot-accent);color:var(--ot-ink);box-shadow:0 0 0 4px var(--ot-bg),0 0 0 5.5px var(--ot-ink)}
.otpg-prog__s.is-todo .otpg-prog__dot{border-color:var(--ot-line-soft);color:var(--ot-muted)}
.otpg-prog__l{margin-top:6px;font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.otpg-prog__s.is-todo .otpg-prog__l{color:var(--ot-muted)}
.otpg-prog__d{min-height:18px;font-size:12px;line-height:1.4;color:var(--ot-muted)}
.otpg-over{margin:0 0 36px;padding:18px 20px;border:var(--ot-bw) solid var(--ot-ink);border-left:10px solid var(--ot-muted);border-radius:var(--ot-r);background:repeating-linear-gradient(-45deg,var(--ot-paper) 0 14px,var(--ot-bg) 14px 28px)}
.otpg-over--refunded{border-left-color:var(--ot-ink)}
.otpg-over__t{margin:0 0 6px;font-family:var(--ot-display);font-size:30px;line-height:1;text-transform:uppercase}
.otpg-over__b{margin:0;font-size:15px;line-height:1.5}
.otpg-odgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;align-items:start}
.otpg-odmedia{position:sticky;top:calc(var(--ot-header-h) + 24px)}
.otpg-odimg{display:block;width:100%;aspect-ratio:1/1;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:var(--ot-bg);overflow:hidden}
.otpg-odimg img{width:100%;height:100%;object-fit:contain}
.otpg-odtee{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;align-items:end;margin-top:16px}
.otpg-odtee .ot-label{grid-column:1 / -1;margin:0}
.otpg-odtee__n{margin:0;font-family:var(--ot-display);font-size:30px;line-height:1;text-transform:uppercase}
.otpg-odtee__l{grid-column:1;margin:0;font-size:14px;color:var(--ot-muted)}
.otpg-odtee__act{grid-column:2;grid-row:2 / 4;display:flex;gap:8px}
.otpg-odinfo{display:flex;flex-direction:column;gap:16px;min-width:0}
.otpg-box{padding:20px 22px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:var(--ot-paper)}
.otpg-box--lg{padding:26px 28px}
.otpg-box p{max-width:68ch;margin:0 0 12px;font-size:15px;line-height:1.6}
.otpg-box__t{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:12px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.otpg-box__t::before{content:"";flex:none;width:10px;height:10px;background:var(--ot-accent)}
.otpg-box__p{margin:0!important;font-size:15px;line-height:1.55;color:var(--ot-muted)}
.otpg-note{white-space:pre-line;color:var(--ot-ink)!important}
.otpg-dl{margin:0}
.otpg-dl>div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:12px;align-items:center;padding:6px 0}
.otpg-dl dt{font-size:13px;color:var(--ot-muted)}
.otpg-dl dd{margin:0;font-size:15px;font-weight:700;overflow-wrap:anywhere}
.otpg-track{display:flex;align-items:center;justify-content:space-between;gap:12px}
.otpg-track__v{font-size:16px;font-weight:800;letter-spacing:.06em;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.otpg-track .ot-btn{flex:none}
.otpg-addr{font-style:normal;font-size:15px;line-height:1.6}
.otpg-addr__c{margin:10px 0 0!important;padding-top:10px;border-top:var(--ot-bw) solid var(--ot-line-soft);font-size:14px!important;color:var(--ot-muted);overflow-wrap:anywhere}
.otpg-money{margin:0}
.otpg-money>div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-size:14px}
.otpg-money dt{color:var(--ot-muted)}
.otpg-money dd{margin:0;font-weight:700;font-variant-numeric:tabular-nums}
.otpg-money__total{margin:6px 0;padding-top:10px!important;border-top:var(--ot-bw) solid var(--ot-ink)}
.otpg-money__total dt{color:var(--ot-ink);font-size:13px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.otpg-money__total dd{font-size:24px;font-weight:800}
.otpg-mto{padding:18px 20px;border-radius:var(--ot-r);background:var(--ot-ink);color:var(--ot-on-ink)}
.otpg-mto p{margin:0;font-size:14px;line-height:1.55;color:rgba(244,241,234,.86)}
.otpg-mto__links{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:12px!important}
.otpg-mto .ot-link{color:var(--ot-on-ink);font-size:13px}
.otpg-mto .ot-link:hover{color:var(--ot-accent)}
.otpg-mto__v{margin-top:10px!important;font-size:12px!important;color:rgba(244,241,234,.6)!important}

/* ── /d/<id> ── */
.otpg-dp{padding-top:32px}
.otpg-dp__in{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);gap:56px;align-items:start}
.otpg-dp__media{position:sticky;top:calc(var(--ot-header-h) + 24px)}
.otpg-dp__info{min-width:0}
.otpg-dp__title{font-size:72px;line-height:.92;margin:12px 0 18px;overflow-wrap:anywhere;text-wrap:balance}
/* h1 trang /d = TÊN MẪU do khách đặt (có thể có dấu tiếng Việt ở mọi ngôn ngữ trang) → dòng thoáng an toàn cho dấu (13/11) */
.ot-display.otpg-dp__title{line-height:1.3}
.otpg-dp__quote{display:flex;flex-direction:column;margin:0 0 18px;padding:14px 0 14px 18px;border-left:6px solid var(--ot-accent);font-size:20px;font-weight:700;line-height:1.35}
.otpg-dp__count{display:flex;align-items:baseline;gap:10px;margin:0 0 26px;padding-bottom:22px;border-bottom:var(--ot-bw) solid var(--ot-ink);font-size:13px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--ot-muted)}
.otpg-dp__countn{font-family:var(--ot-display);font-size:34px;line-height:1;letter-spacing:.01em;color:var(--ot-ink)}
.otpg-chips{display:flex;flex-wrap:wrap;gap:8px}
.otpg-chip{display:inline-flex;align-items:center;height:var(--ot-h-sm);margin:0;padding:0 14px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:transparent;color:var(--ot-ink);font-size:13px;font-weight:700;text-decoration:none;white-space:nowrap;cursor:pointer}
.otpg-chip:hover{background:var(--ot-paper)}
.otpg-chip[aria-checked=true]{background:var(--ot-ink);color:var(--ot-on-ink)}
.otpg-dp__cta{display:grid;gap:10px;margin:28px 0 0}
.otpg-dp__print{height:60px;font-size:16px}
.otpg-how{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:26px 0 0;padding:16px 0 0;list-style:none;border-top:var(--ot-bw) solid var(--ot-line-soft)}
.otpg-how li{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:700;line-height:1.35}
.otpg-how b{font-family:var(--ot-display);font-size:22px;font-weight:400;line-height:1;color:var(--ot-accent)}
.otpg-more6{margin-top:72px}
.otpg-more6__h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-bottom:18px;padding-top:24px;border-top:var(--ot-bw) solid var(--ot-ink)}
.otpg-more6__h .otpg-h2{margin:0}
.otpg-grid6{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin:0;padding:0;list-style:none}
.otpg-mini{display:flex;flex-direction:column;gap:8px;color:var(--ot-ink);text-decoration:none}
.otpg-mini__img{display:block;aspect-ratio:1/1;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r-sm);background:var(--ot-paper);overflow:hidden}
.otpg-mini__img--dark{background:var(--ot-ink)}   /* mẫu mực sáng (in cho áo tối) — ảnh WebP trong suốt */
.otpg-mini__img--light{background:var(--ot-paper)}
.otpg-mini__img img{width:100%;height:100%;object-fit:contain;transition:transform .25s var(--ot-ease)}
.otpg-mini:hover .otpg-mini__img img{transform:scale(1.04)}
.otpg-mini__t{min-height:2.7em;font-size:13px;font-weight:800;line-height:1.35;text-transform:uppercase;letter-spacing:.04em;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.otpg-mini.is-skel .otpg-mini__img{border-color:var(--ot-line-soft);background:repeating-linear-gradient(45deg,transparent 0 8px,var(--ot-line-soft) 8px 9px)}

/* ── /size-guide ── */
.otpg-head--sg{align-items:flex-end}
.otpg-sg__unit{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.otpg-sg__unit .ot-label{margin:0}
.otpg-jump{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 36px}
.otpg-sg__grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:48px;align-items:start}
.otpg-sg__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
.otpg-sg__one{min-width:0;scroll-margin-top:calc(var(--ot-header-h) + 24px)}
.otpg-sg__t{display:flex;align-items:baseline;gap:12px;margin:0 0 10px;font-size:34px;line-height:1}
.otpg-sg__t span{font-family:var(--ot-font);font-size:12px;font-weight:800;letter-spacing:.1em;color:var(--ot-accent-2)}
.otpg-sg__how{position:sticky;top:calc(var(--ot-header-h) + 24px);padding:22px 24px;border:var(--ot-bw) solid var(--ot-ink);border-radius:var(--ot-r);background:var(--ot-paper)}
.otpg-sg__how ol{margin:0 0 14px;padding-left:20px;font-size:14px;line-height:1.6}
.otpg-sg__how li+li{margin-top:8px}
.otpg-sg__tip{margin:0 0 12px;font-size:14px;line-height:1.55;color:var(--ot-muted)}
.otpg-sg__mto{margin:0 0 14px;padding:12px 14px;border-radius:var(--ot-r-sm);background:var(--ot-ink);color:var(--ot-on-ink);font-size:13px;font-weight:700;line-height:1.5}

/* ── /shipping ── */
.otpg-hero{padding:8px 0 36px}
.otpg-hero__t{max-width:12ch;margin:14px 0 22px;font-size:120px;line-height:.88}
:lang(vi) .otpg-hero__t{line-height:1.2}
.otpg-hero__lead{max-width:58ch;margin:0;font-size:19px;line-height:1.55}
.otpg-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin:0 0 56px;padding:0;list-style:none;border-radius:var(--ot-r);background:var(--ot-ink);color:var(--ot-on-ink);overflow:hidden}
.otpg-steps li{display:flex;flex-direction:column;gap:8px;padding:26px 26px 30px}
.otpg-steps li+li{border-left:var(--ot-bw) solid rgba(244,241,234,.22)}
.otpg-steps b{font-family:var(--ot-display);font-size:40px;font-weight:400;line-height:1;color:var(--ot-accent)}
.otpg-steps__t{font-family:var(--ot-display);font-size:28px;line-height:1;text-transform:uppercase}
.otpg-steps__b{font-size:15px;line-height:1.5;color:rgba(244,241,234,.86)}
.otpg-sec{margin:0 0 48px}
.otpg-sec:last-child{margin-bottom:0}
.otpg-zones{border-top:var(--ot-bw) solid var(--ot-ink)}
.otpg-zones__h,.otpg-zones__r{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr) minmax(0,.7fr) minmax(0,.8fr);gap:20px;align-items:baseline;padding:16px 0;border-bottom:var(--ot-bw) solid var(--ot-line-soft)}
.otpg-zones__h{padding:12px 0;border-bottom-color:var(--ot-ink);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.otpg-zones__z{font-family:var(--ot-display);font-size:26px;line-height:1;text-transform:uppercase}
.otpg-zones__c{font-size:15px;line-height:1.5}
.otpg-zones__all{font-weight:700}
.otpg-zones__f{font-size:18px;font-weight:800;font-variant-numeric:tabular-nums}
.otpg-zones__e{font-size:15px;font-weight:700}
.otpg-notes{max-width:68ch;margin:18px 0 0;padding-left:20px;font-size:14px;line-height:1.6;color:var(--ot-muted)}
.otpg-notes li+li{margin-top:6px}
.otpg-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.otpg-two .otpg-sec{margin:0}
.otpg-two .otpg-h2{font-size:34px}

/* ── 404 ── */
.otpg-nf{padding:56px 0 96px}
.otpg-nf__in{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:48px;align-items:center}
.otpg-nf__code{margin:0;font-size:clamp(160px,24vw,340px);line-height:.8;letter-spacing:-.01em}
.otpg-nf__code span{color:var(--ot-accent)}
.otpg-nf__h{margin:12px 0 18px;font-size:76px;line-height:.92}
.otpg-nf__b{margin:0;max-width:40ch;font-size:18px;line-height:1.55;color:var(--ot-muted)}

/* ── ≤1023px ── */
@media (max-width:1023px){
  .otpg-h1{font-size:68px}
  .otpg-dp__in,.otpg-odgrid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:32px}
  .otpg-dp__title{font-size:52px}
  .otpg-grid6{grid-template-columns:repeat(3,minmax(0,1fr))}
  .otpg-sg__grid{grid-template-columns:minmax(0,1fr)}
  .otpg-sg__how{position:static}
  .otpg-hero__t{font-size:88px}
  .otpg-head{flex-direction:column;align-items:stretch}
  .otpg-search{width:100%}
  .otpg-sg__unit{align-items:flex-start}
  .otpg-empty__big{font-size:120px}
  .otpg-nf__h{font-size:60px}
  .otpg-odtee{grid-template-columns:minmax(0,1fr)}
  .otpg-odtee__act{grid-column:1;grid-row:auto;margin-top:10px}
  .otpg-dl>div{grid-template-columns:minmax(0,1fr);gap:2px}  /* mã vận đơn dài không bị bẻ 4 dòng ở 744–1023 */
  .otpg-track{flex-wrap:wrap}
}

/* ── ≤743px ── */
@media (max-width:743px){
  .otpg{padding:24px 0 24px}
  .otpg-h1{font-size:52px}
  .otpg-h2{font-size:32px}
  .otpg-head{gap:20px;margin-bottom:20px;padding-bottom:20px}
  .otpg-card__a{grid-template-columns:84px minmax(0,1fr);grid-template-areas:"img main" "img side";gap:6px 14px;padding:14px 0}
  .otpg-card__img{grid-area:img;width:84px;height:84px;align-self:start}
  .otpg-card__main{grid-area:main}
  .otpg-card__side{grid-area:side;flex-direction:row;align-items:center;justify-content:space-between}
  .otpg-card__go{display:none}
  .otpg-card__code{font-size:26px}
  .otpg-card__line{font-size:14px}
  .otpg-card__total{font-size:18px}
  .otpg-empty{grid-template-columns:minmax(0,1fr);gap:20px}
  .otpg-empty__big{font-size:84px}
  .otpg-odhead{flex-direction:column;align-items:flex-start;gap:14px}
  .otpg-prog{grid-template-columns:minmax(0,1fr);gap:0;padding:20px 0 0}
  .otpg-prog::before,.otpg-prog::after{display:none}
  .otpg-prog__s{display:grid;grid-template-columns:36px minmax(0,1fr);grid-template-areas:"dot l" "dot d";gap:0 14px;padding:0 0 18px;min-height:58px}
  .otpg-prog__s:not(:last-child)::before{content:"";position:absolute;left:16.5px;top:36px;bottom:0;width:3px;background:var(--ot-line-soft)}
  .otpg-prog__s.is-done:not(:last-child)::before{background:var(--ot-ink)}
  .otpg-prog__dot{grid-area:dot}
  .otpg-prog__l{grid-area:l;margin-top:2px}
  .otpg-prog__d{grid-area:d}
  .otpg-odgrid{grid-template-columns:minmax(0,1fr);gap:20px}
  .otpg-odmedia{position:static}
  .otpg-odimg{max-width:360px}
  .otpg-dl>div{grid-template-columns:minmax(0,1fr)}
  .otpg-track{flex-wrap:wrap}
  .otpg-dp{padding-top:16px}
  .otpg-dp__in{display:flex;flex-direction:column;align-items:stretch;gap:0}  /* stretch: không thì khung ảnh co về 0 (lỗi cũ: rộng 2px ở 390) */
  .otpg-dp__info{display:contents}
  .otpg-dp__info>*{order:2}
  .otpg-dp__info>.ot-kicker,.otpg-dp__info>.otpg-dp__title{order:0}
  .otpg-dp__media{order:1;position:static;margin:0 0 20px}
  .otpg-dp__title{font-size:44px;margin:8px 0 16px}
  .otpg-dp__quote{font-size:17px}
  .otpg-how{grid-template-columns:minmax(0,1fr);gap:10px}
  .otpg-how li{flex-direction:row;align-items:baseline;gap:12px}
  .otpg-grid6{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .otpg-more6{margin-top:48px}
  .otpg-sg__list{grid-template-columns:minmax(0,1fr);gap:32px}
  .otpg-sg__t{font-size:30px}
  .otpg-hero__t{font-size:58px}
  .otpg-hero__lead{font-size:16px}
  .otpg-steps{grid-template-columns:minmax(0,1fr);margin-bottom:40px}
  .otpg-steps li{padding:20px}
  .otpg-steps li+li{border-left:0;border-top:var(--ot-bw) solid rgba(244,241,234,.22)}
  .otpg-zones__h{display:none}
  .otpg-zones__r{grid-template-columns:minmax(0,1fr);gap:6px;padding:18px 0}
  .otpg-zones__c,.otpg-zones__f,.otpg-zones__e{display:grid;grid-template-columns:110px minmax(0,1fr);gap:10px;font-size:14px}
  .otpg-zones__c::before,.otpg-zones__f::before,.otpg-zones__e::before{content:attr(data-label);font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ot-muted);padding-top:2px}
  .otpg-two{grid-template-columns:minmax(0,1fr)}
  .otpg-box--lg{padding:20px}
  .otpg-nf{padding:32px 0 64px}
  .otpg-nf__in{grid-template-columns:minmax(0,1fr);gap:8px}
  .otpg-nf__code{font-size:150px}
  .otpg-nf__h{font-size:48px}
  .otpg-actions .ot-btn{flex:1 1 100%}
}

/* ── màn chạm: vùng bấm ≥40px (bố cục máy tính không đổi) ── */
@media (pointer:coarse){
  .otpg-chip{min-height:40px}
}

/* ── U2 13/11: tiêu đề lớn trang con KHÔNG tràn ngang ở mọi ngữ ──
   Lưới an toàn mọi ngữ: từ dài (de/fi/hu/pl…) ngắt có gạch nối theo html[lang], bí quá mới bẻ giữa chữ — en/vi không có từ
   nào dài hơn cột nên số đo không đổi. Kirin + Hy Lạp rơi về Noto Sans ĐẬM 800 (rộng gấp ~1,6 Anton) → bỏ trần 12ch (ch đo
   theo số "0" của Anton) và cỡ chữ co theo bề ngang khung (cqi của .otpg-hero), trần vẫn là cỡ gốc từng màn. */
.otpg-hero__t,.otpg-h1{overflow-wrap:anywhere;hyphens:auto}
html:is([lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]) .otpg-hero{container-type:inline-size}
html:is([lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]) .otpg-hero__t{max-width:none;font-size:min(120px,13cqi)}
@media (max-width:1023px){
  html:is([lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]) .otpg-hero__t{font-size:min(88px,13cqi)}
}
@media (max-width:743px){
  html:is([lang=ru],[lang=uk],[lang=bg],[lang=sr],[lang=kk],[lang=mn],[lang=el]) .otpg-hero__t{font-size:min(58px,13cqi)}
}
/* bảng size (/size-guide, CSS gốc ở shop-1311e.css): tiêu đề cột ngữ dài (pl/de/fi…) xuống dòng thay vì đẩy bảng tràn màn —
   en/vi vừa một dòng nên bố cục bảng không đổi */
.otpg-sg .ots-sztab thead th{white-space:normal;hyphens:auto}