:root {
  --td-brand:#FF4300;
  --td-brand-text:#C63100;
  --td-brand-btn:#C63100;
  --td-brand-btn-hover:#A82A00;
  --td-brand-dark:#D63500;
  --td-brand-tint:#FDF0EB;
  --td-brand-tint-2:#FFF4EE;
  --td-brand-tint-3:#FFEDDF;
  --td-brand-line:#FFD9C7;
  --td-brand-on-navy:#FF8A5B;
  --td-navy:#0b1423;
  --td-navy-2:#0E1F28;
  --td-navy-3:#243B49;
  --td-teal:#C63100;
  --td-teal-hover:#A82A00;
  --td-coral:#FF4300;
  --td-coral-dark:#D63500;
  --td-coral-text:#C63100;
  --td-coral-solid:#C63100;
  --td-sand:#FF8A5B;
  --td-mist:#F1F3F4;
  --td-ink:#0b1423;
  --td-body:#4A5B63;
  --td-muted:#5C6D76;
  --td-line:#E3E7EA;
  --td-line-soft:#F1F4F5;
  --td-soft:#FFF4EE;
  --td-bg:#F7F8F9;
  --td-white:#fff;
  --td-success:#0B5D3B;
  --td-success-soft:#E7F6EE;
  --td-success-line:#BFE5D0;
  --td-danger:#9A1B1B;
  --td-danger-soft:#FDECEC;
  --td-danger-line:#F2C9C9;
  --td-warning:#8A5A00;
  --td-warning-soft:#FFF6E0;
  --td-warning-line:#F0DCA8;
  --td-radius:14px;
  --td-radius-sm:10px;
  --td-radius-lg:22px;
  --td-radius-pill:999px;
  --td-shadow-xs:0 1px 2px #1528320a;
  --td-shadow-sm:0 4px 16px #1528320f;
  --td-shadow:0 12px 30px #15283214;
  --td-shadow-lg:0 22px 56px #1528321f;
  --td-shadow-brand:0 10px 26px #FF430033;
  --td-max:100%;
  --td-gap:18px;
  --td-header-h:132px;
  --td-mobile-nav-h:64px;
  --td-font:"Manrope",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif
}
@font-face {
  font-family:Manrope;
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(../fonts/manrope/manrope-latin.woff2)format("woff2");
  unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+2000-206F,U+2122,U+2212,U+FEFF,U+FFFD
}
@font-face {
  font-family:Manrope;
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url(../fonts/manrope/manrope-latin-ext.woff2)format("woff2");
  unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+1E00-1E9F,U+2020,U+20A0-20AB,U+2113,U+A720-A7FF
}

/* The palette is declared once, at the top of this file. A second :root
   block used to follow the two @font-face rules; declared after the new one
   it silently overrode every value, so it was removed rather than merged. */

*,:before,:after {
  box-sizing:border-box
}

html {
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
  scroll-padding-top:176px
}

body {
  background:var(--td-bg);
  color:var(--td-body);
  font-family:var(--td-font);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizelegibility;
  margin:0;
  font-size:15px;
  line-height:1.65;
  overflow-x:hidden
}

img {
  max-width:100%;
  height:auto;
  display:block
}

a {
  color:inherit;
  text-decoration:none
}

button,input,select,textarea {
  font:inherit;
  color:inherit
}

button {
  cursor:pointer
}

h1,h2,h3,h4,h5 {
  color:var(--td-ink);
  margin:0;
  font-weight:800;
  line-height:1.22
}

p {
  margin:0
}

ul,ol {
  margin:0;
  padding:0;
  list-style:none
}

:focus-visible {
  outline:2px solid var(--td-teal);
  outline-offset:2px;
  border-radius:4px
}

.td-sr-only {
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
  width:1px!important;
  height:1px!important;
  margin:-1px!important;
  padding:0!important;
  position:absolute!important;
  overflow:hidden!important
}

.td-skip {
  z-index:999999;
  background:var(--td-teal);
  color:#fff;
  border-radius:0 0 8px;
  padding:12px 20px;
  position:absolute;
  top:0;
  left:-9999px
}

.td-skip:focus {
  left:0
}

.td-container {
  width:min(100% - 32px,var(--td-max));
  margin-inline:auto
}

.td-main {
  padding-bottom:0
}

.td-btn {
  border-radius:var(--td-radius-sm);
  white-space:nowrap;
  border:1px solid #0000;
  justify-content:center;
  align-items:center;
  gap:8px;
  height:44px;
  padding:0 20px;
  font-size:14px;
  font-weight:800;
  line-height:1;
  transition:background-color .18s,border-color .18s,color .18s,transform .18s,box-shadow .18s;
  display:inline-flex
}

.td-btn:active {
  transform:scale(.975)
}

.td-btn-teal {
  background:var(--td-teal);
  border-color:var(--td-teal);
  color:#fff
}

.td-btn-teal:hover {
  background:var(--td-teal-hover);
  border-color:var(--td-teal-hover);
  color:#fff
}

.td-btn-coral {
    background:var(--td-coral-solid);
    border-color:var(--td-coral-solid);
    color:#fff;
    box-shadow:0 4px 12px #FF430038
  }
  
  .td-btn-coral:hover {
    background:var(--td-brand-btn-hover);
    border-color:var(--td-brand-btn-hover);
    color:#fff
  }

.td-btn-ghost {
  border-color:var(--td-line);
  color:var(--td-ink);
  background:#fff
}

.td-btn-ghost:hover {
  border-color:var(--td-teal);
  color:var(--td-teal)
}

.td-btn-sm {
  height:36px;
  padding:0 14px;
  font-size:12.5px
}

.td-pill {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-pill);
  height:34px;
  color:var(--td-ink);
  white-space:nowrap;
  background:#fff;
  align-items:center;
  gap:6px;
  padding:0 15px;
  font-size:12.5px;
  font-weight:800;
  line-height:1;
  transition:border-color .18s,color .18s,background-color .18s,transform .18s;
  display:inline-flex
}

.td-pill:hover {
  border-color:var(--td-teal);
  color:var(--td-teal);
  transform:translateY(-1px)
}

.td-pill-solid {
  background:var(--td-teal);
  border-color:var(--td-teal);
  color:#fff;
  box-shadow:0 4px 12px #FF430029
}

.td-pill-solid:hover {
  background:var(--td-teal-hover);
  border-color:var(--td-teal-hover);
  color:#fff
}

.td-arrow {
  border:1px solid var(--td-line);
  width:34px;
  height:34px;
  color:var(--td-ink);
  background:#fff;
  border-radius:50%;
  flex:none;
  place-items:center;
  padding:0;
  font-size:16px;
  line-height:1;
  transition:border-color .18s,color .18s,background-color .18s,transform .18s;
  display:inline-grid
}

.td-arrow:hover {
  border-color:var(--td-teal);
  background:var(--td-teal);
  color:#fff
}

.td-arrow:disabled {
  opacity:.35;
  pointer-events:none
}

.td-header {
  z-index:900;
  box-shadow:0 1px 0 var(--td-line),0 10px 34px #15283212;
  background:#fff;
  position:sticky;
  top:0
}

/* Brand hairline: the one place the raw #FF4300 sits under text, and it is a
   3px decoration, not content. */
.td-header:after {
  content:"";
  background:linear-gradient(90deg,var(--td-brand) 0%,var(--td-brand) 38%,var(--td-navy) 38%,var(--td-navy) 100%);
  height:3px;
  position:absolute;
  bottom:0;
  left:0;
  right:0
}

.td-topbar {
  background:var(--td-navy);
  color:#ffffffe0;
font-size:12.5px;
  position:relative
}

.td-topbar-inner {
  justify-content:space-between;
  align-items:center;
  gap:16px;
  min-height:38px;
  display:flex
}

.td-topbar-promo {
  text-overflow:ellipsis;
  white-space:nowrap;
  align-items:center;
  gap:8px;
  margin:0;
  display:flex;
  overflow:hidden
}

.td-topbar-promo svg {
  flex:none;
  width:14px;
  height:14px;
  color:var(--td-brand-on-navy)
}

.td-topbar-right {
  flex:none;
  align-items:center;
  gap:14px;
  display:flex
}

.td-topbar-link {
  color:#fff;
  align-items:center;
  gap:7px;
  font-weight:800;
  border-radius:var(--td-radius-pill);
  background:#ffffff14;
  padding:4px 10px;
  transition:background-color .18s;
  display:inline-flex
}

.td-topbar-link:hover {
  background:#ffffff26
}

.td-topbar-link svg {
  width:14px;
  height:14px
}

/* ---------- main bar ---------- */

.td-mainbar {
  background:#fff
}

.td-mainbar-grid {
  grid-template-columns:auto minmax(180px,230px) minmax(280px,1fr) auto;
  grid-template-areas:"burger logo search actions";
  align-items:center;
  gap:24px;
  min-height:84px;
  display:grid
}

.td-burger {
  grid-area:burger
}

.td-logo {
  grid-area:logo
}

.td-search {
  grid-area:search
}

.td-actions {
  grid-area:actions
}

.td-logo {
  align-items:center;
  min-width:0;
  display:inline-flex;
  position:relative
}

.td-logo img {
  object-fit:contain;
  width:auto;
  max-width:210px;
  max-height:54px
}

.td-logo-txt {
  color:var(--td-navy);
  letter-spacing:-.03em;
  font-size:25px;
  font-weight:900
}

/* Brand underline that appears under the wordmark on hover. */
.td-logo:after {
  content:"";
  background:var(--td-brand);
  border-radius:2px;
  height:3px;
  width:0;
  transition:width .24s ease;
  position:absolute;
  bottom:-7px;
  left:0
}

.td-logo:hover:after {
  width:100%
}

/* ---------- search ---------- */

.td-search {
  border:1.5px solid var(--td-line);
  border-radius:var(--td-radius-pill);
  background:var(--td-soft);
  align-items:center;
  height:50px;
  transition:border-color .18s,box-shadow .18s,background-color .18s;
  display:flex;
  overflow:hidden
}

.td-search:focus-within {
  border-color:var(--td-brand);
  background:#fff;
  box-shadow:0 0 0 4px #FF430026
}

.td-search svg {
  width:18px;
  height:18px;
  color:var(--td-muted);
  flex:none;
  margin-left:17px
}

.td-search input {
  min-width:0;
  height:48px;
  color:var(--td-ink);
  background:0 0;
  border:0;
  outline:0;
  flex:1;
  padding:0 12px;
  font-size:14.5px;
  font-weight:600
}

.td-search input::placeholder {
  color:var(--td-muted);
  opacity:1;
  font-weight:500
}

.td-search button {
  background:var(--td-brand-btn);
  color:#fff;
  border:0;
  flex:none;
  align-self:stretch;
  place-items:center;
  width:58px;
  margin:4px;
  border-radius:var(--td-radius-pill);
  transition:background-color .18s;
  display:grid
}

.td-search button:hover {
  background:var(--td-brand-btn-hover)
}

.td-search button svg {
  color:#fff;
  width:20px;
  height:20px;
  margin:0
}

.td-actions {
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  display:flex
}

.td-icon-link {
  border-radius:var(--td-radius-sm);
  height:44px;
  color:var(--td-ink);
  align-items:center;
  gap:7px;
  padding:0 12px;
  font-size:13px;
  font-weight:800;
  transition:color .18s,background-color .18s;
  display:inline-flex
}

.td-icon-link:hover {
  background:var(--td-brand-tint);
  color:var(--td-brand-text)
}

.td-icon-link svg {
  width:20px;
  height:20px
}

/* Brand-filled cart button. #C63100 carries white text at 5.47:1, so the label
   clears AA at its 13.5px / 800 weight. */
.td-cart-btn {
  border:1px solid var(--td-brand-btn);
  border-radius:var(--td-radius-sm);
  background:var(--td-brand-btn);
  color:#fff;
  align-items:center;
  gap:9px;
  height:46px;
  padding:0 18px;
  font-size:13.5px;
  font-weight:800;
  line-height:1;
  box-shadow:var(--td-shadow-brand);
  transition:background-color .18s,border-color .18s,transform .18s,box-shadow .18s;
  display:inline-flex;
  position:relative
}

.td-cart-btn:hover {
  background:var(--td-brand-btn-hover);
  border-color:var(--td-brand-btn-hover);
  box-shadow:0 12px 28px #FF430047
}

.td-cart-btn:active {
  transform:scale(.97)
}

.td-cart-btn svg {
  width:20px;
  height:20px
}

.td-cart-count {
  border-radius:var(--td-radius-pill);
  background:var(--td-navy);
  min-width:21px;
  height:21px;
  color:#fff;
  text-align:center;
  padding:0 5px;
  font-size:11px;
  font-weight:900;
  line-height:21px;
  position:absolute;
  top:-8px;
  right:-8px;
  box-shadow:0 2px 8px #1528324d
}

.td-cart-count[data-empty="1"] {
  display:none
}

.td-cart-count.is-bump {
  animation:.45s tdBump
}
@keyframes tdBump {

  0%,to {
    transform:scale(1)
  }

  45% {
    transform:scale(1.35)
  }
}

.td-burger {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  width:44px;
  height:44px;
  color:var(--td-navy);
  background:#fff;
  justify-content:center;
  align-items:center;
  transition:border-color .18s,color .18s,background-color .18s;
  display:none
}

.td-burger:hover {
  border-color:var(--td-brand);
  color:var(--td-brand-text);
  background:var(--td-brand-tint)
}

.td-burger svg {
  width:21px;
  height:21px
}

.td-nav {
  border-top:1px solid var(--td-line-soft);
  background:#fff
}

.td-nav-inner {
  scrollbar-width:none;
  align-items:center;
  gap:26px;
  min-height:52px;
  display:flex;
  overflow-x:auto
}

.td-nav-inner::-webkit-scrollbar {
  display:none
}

.td-nav a {
  color:var(--td-navy);
  white-space:nowrap;
  flex:none;
  padding:2px 0;
  font-size:13.5px;
  font-weight:800;
  transition:color .18s;
  position:relative
}

.td-nav a:after {
  content:"";
  background:var(--td-brand);
  border-radius:2px;
  width:0;
  height:3px;
  transition:width .2s;
  position:absolute;
  bottom:-1px;
  left:0
}

.td-nav a:hover {
  color:var(--td-brand-text)
}

.td-nav a:hover:after {
  width:100%
}

.td-nav a.is-active {
  color:var(--td-brand-text)
}

.td-nav a.is-active:after {
  width:100%
}

.td-dept-toggle {
  background:var(--td-teal);
  color:#fff;
  border:0;
  flex:none;
  align-items:center;
  gap:8px;
  height:52px;
  padding:0 16px;
  font-size:13px;
  font-weight:800;
  display:none
}

.td-dept-toggle svg {
  width:16px;
  height:16px
}

.td-overlay {
  z-index:1040;
  opacity:0;
  visibility:hidden;
  background:#15283280;
  transition:opacity .22s,visibility .22s;
  position:fixed;
  inset:0
}

.td-overlay.is-open {
  opacity:1;
  visibility:visible
}

.td-drawer {
  z-index:1050;
  height:100dvh;
  max-height:100dvh;
  box-shadow:var(--td-shadow-lg);
  background:#fff;
  flex-direction:column;
  transition:transform .26s cubic-bezier(.3,.8,.3,1);
  display:flex;
  position:fixed;
  top:0
}

.td-drawer-right {
  width:min(440px,100vw);
  right:0;
  transform:translate(101%)
}

.td-drawer-right.is-open {
  transform:translate(0)
}

.td-drawer-left {
  width:min(340px,88vw);
  left:0;
  transform:translate(-101%)
}

.td-drawer-left.is-open {
  transform:translate(0)
}

.td-drawer-head {
  border-bottom:1px solid var(--td-line);
  background:var(--td-navy);
  color:#fff;
  flex:none;
  justify-content:space-between;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  display:flex
}

.td-drawer-head strong {
  letter-spacing:-.02em;
  font-size:16px;
  font-weight:900
}

.td-drawer-head small {
  color:#ffffffa8;
  margin-top:2px;
  font-size:12px;
  font-weight:500;
  display:block
}

.td-drawer-close {
    border-radius:var(--td-radius-sm);
    color:var(--td-ink);
    background:var(--td-soft);
    border:1px solid var(--td-line);
    flex:none;
    place-items:center;
    width:36px;
    height:36px;
    transition:background-color .18s,transform .15s,color .18s,border-color .18s;
    display:grid
  }

.td-drawer-close:hover {
  background:var(--td-brand-tint);
  border-color:var(--td-brand);
  color:var(--td-brand-text)
}

.td-drawer-close:active {
  transform:scale(.94)
}

.td-drawer-close svg {
  width:18px;
  height:18px
}

.td-drawer-body {
  overscroll-behavior:contain;
  flex:auto;
  min-height:0;
  padding:16px 18px;
  overflow-y:auto
}

.td-menu-logo {
  margin-bottom:16px;
  display:block
}

.td-menu-logo img {
  max-width:150px;
  max-height:40px
}

.td-menu-label {
  letter-spacing:.1em;
  text-transform:uppercase;
  color:var(--td-muted);
  margin:0;
  font-size:10.5px;
  font-weight:900
}

.td-menu-head {
  justify-content:space-between;
  align-items:center;
  gap:10px;
  min-height:30px;
  margin:18px 0 2px;
  padding:0 10px;
  display:flex
}

.td-menu-caret {
  width:28px;
  height:28px;
  color:var(--td-muted);
  cursor:pointer;
  background:0 0;
  border:0;
  border-radius:8px;
  justify-content:center;
  align-items:center;
  margin:-6px -6px -6px 0;
  transition:background-color .16s,color .16s;
  display:flex
}

.td-menu-caret:hover {
  background:var(--td-soft);
  color:var(--td-teal)
}

.td-menu-caret svg {
  width:16px;
  height:16px;
  transition:transform .22s
}

.td-menu-caret[aria-expanded=true] svg {
  transform:rotate(180deg)
}

.td-menu-panel[hidden] {
  display:none
}

.td-menu-link {
  border-bottom:1px solid var(--td-line-soft);
  color:var(--td-ink);
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:11px 10px;
  font-size:14px;
  font-weight:800;
  transition:background-color .16s,color .16s,padding-left .16s;
  display:flex
}

.td-menu-link>span {
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  overflow:hidden
}

.td-menu-link:hover {
  background:var(--td-soft);
  color:var(--td-teal);
  padding-left:14px
}

.td-menu-link small {
  border-radius:var(--td-radius-pill);
  background:var(--td-soft);
  min-width:26px;
  color:var(--td-muted);
  text-align:center;
  flex:none;
  padding:2px 7px;
  font-size:11px;
  font-weight:800
}

.td-menu-contact {
  border-radius:var(--td-radius);
  background:var(--td-soft);
  border:1px solid var(--td-line);
  margin-top:18px;
  padding:14px
}

.td-menu-contact a {
  color:var(--td-teal);
  align-items:center;
  gap:10px;
  padding:7px 0;
  font-size:13.5px;
  font-weight:800;
  display:flex
}

.td-menu-contact svg {
  flex:none;
  width:17px;
  height:17px
}

.td-hero {
  background:linear-gradient(#fbf8f4 0,#fff 240px);
  padding:22px 0 0
}

.td-hero-grid {
  gap:var(--td-gap);
  grid-template-columns:262px minmax(0,1fr) 340px;
  align-items:stretch;
  display:grid
}

.td-dept {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-sm);
  background:#fff;
  flex-direction:column;
  display:flex;
  overflow:hidden
}

.td-dept-title {
  background:var(--td-teal);
  color:#fff;
  letter-spacing:-.01em;
  flex:none;
  margin:0;
  padding:13px 16px;
  font-size:14.5px;
  font-weight:900
}

.td-dept-list {
  flex:auto;
  padding:6px;
  overflow-y:auto
}

.td-dept-list a {
  border-radius:var(--td-radius-sm);
  color:#33454d;
  justify-content:space-between;
  align-items:center;
  gap:8px;
  padding:9px 10px;
  font-size:13.5px;
  font-weight:700;
  transition:background-color .16s,color .16s,padding-left .16s;
  display:flex
}

.td-dept-list a:hover {
  background:var(--td-soft);
  color:var(--td-teal);
  padding-left:14px
}

.td-dept-list small {
  color:var(--td-muted);
  font-size:11px;
  font-weight:600
}

.td-hero-main {
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow);
  background:var(--td-teal);
  min-height:440px;
  position:relative;
  overflow:hidden
}

.td-hero-slide {
  opacity:0;
  visibility:hidden;
  background-position:50%;
  background-size:cover;
  transition:opacity .5s,visibility .5s;
  display:block;
  position:absolute;
  inset:0
}

.td-hero-slide.is-active {
  opacity:1;
  visibility:visible
}

.td-hero-img {
  object-fit:cover;
  object-position:center;
  width:100%;
  height:100%;
  position:absolute;
  inset:0
}

.td-hero-slide:after {
  content:"";
  background:linear-gradient(90deg,#091c26f0 0,#091c26d6 34%,#091c2694 58%,#091c261f 100%);
  position:absolute;
  inset:0
}

.td-hero-copy {
  z-index:2;
  opacity:0;
  width:min(620px,84%);
  padding:36px 34px;
  transition:opacity .4s 60ms,transform .4s 60ms;
  position:absolute;
  top:50%;
  left:0;
  transform:translateY(-50%)
}

.td-hero-slide.is-active .td-hero-copy {
  opacity:1;
  transform:translateY(-50%)
}

.td-hero-eyebrow {
  border-radius:var(--td-radius-sm);
  color:#ffd0bd;
  letter-spacing:.11em;
  text-transform:uppercase;
  background:#FF430029;
  border:1px solid #FF430066;
  padding:6px 11px;
  font-size:11px;
  font-weight:900;
  display:inline-flex
}

.td-hero-copy h1,.td-hero-copy .td-hero-h2 {
  color:#fff;
  letter-spacing:-.035em;
  margin:14px 0 12px;
  font-size:clamp(28px,3.2vw,44px);
  font-weight:900;
  line-height:1.08
}

.td-hero-copy p {
  color:#ffffffd6;
  max-width:520px;
  font-size:15px;
  line-height:1.7
}

.td-hero-copy .td-btn {
  margin-top:20px
}

.td-hero-dots {
  z-index:3;
  gap:7px;
  display:flex;
  position:absolute;
  bottom:22px;
  left:34px
}

.td-hero-dots button {
  border-radius:var(--td-radius-pill);
  background:#ffffff73;
  border:0;
  width:8px;
  height:8px;
  padding:0;
  transition:width .2s,background-color .2s
}

.td-hero-dots button.is-active {
  background:var(--td-coral);
  width:26px
}

.td-hero-side {
  gap:var(--td-gap);
  grid-template-rows:1fr 1fr;
  display:grid
}

.td-side-banner {
  border-radius:var(--td-radius);
  min-height:190px;
  box-shadow:var(--td-shadow-sm);
  isolation:isolate;
  background-position:50%;
  background-size:cover;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  padding:22px;
  display:flex;
  position:relative;
  overflow:hidden
}

.td-banner-img {
  z-index:-2;
  object-fit:cover;
  object-position:center;
  width:100%;
  height:100%;
  position:absolute;
  inset:0
}

.td-side-banner:after {
  content:"";
  z-index:-1;
  background:linear-gradient(90deg,#fffffff0,#ffffffb3 48%,#ffffff3d);
  position:absolute;
  inset:0
}

.td-side-banner.is-photo:after {
  background:linear-gradient(90deg,#fffffff5,#ffffffd6 42%,#ffffff5c)
}

.td-side-banner span {
  color:var(--td-coral-text);
  letter-spacing:.11em;
  text-transform:uppercase;
  font-size:11.5px;
  font-weight:900
}

.td-side-banner strong {
  max-width:210px;
  color:var(--td-navy);
  letter-spacing:-.03em;
  font-size:25px;
  font-weight:900;
  line-height:1.14
}

.td-side-banner .td-pill {
  background:#ffffffb3;
  width:max-content;
  margin-top:8px
}

.td-trust {
  margin-top:var(--td-gap);
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-sm);
  background:#fff;
  grid-template-columns:repeat(4,1fr);
  display:grid;
  overflow:hidden
}

.td-trust-item {
  border-right:1px solid var(--td-line-soft);
  align-items:center;
  gap:13px;
  min-width:0;
  padding:16px 20px;
  display:flex
}

.td-trust-item:last-child {
  border-right:0
}

.td-trust-item>div {
  min-width:0
}

.td-trust-ico {
  width:34px;
  height:34px;
  color:var(--td-teal);
  background:#FF430012;
  border-radius:10px;
  flex:0 0 34px;
  place-items:center;
  margin:0;
  display:grid
}

.td-trust-ico svg {
  width:19px;
  height:19px
}

.td-trust-item strong {
  color:var(--td-ink);
  font-size:14px;
  font-weight:800;
  line-height:1.3;
  display:block
}

.td-trust-item>div>span {
  color:var(--td-muted);
  margin-top:2px;
  font-size:12.5px;
  line-height:1.45;
  display:block
}

.td-section {
  margin:52px 0
}

.td-section-head {
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-bottom:22px;
  display:flex
}

/* Eyebrow: brand pill rather than plain grey caps, so the section label reads
   as part of the identity. #C63100 on #FDF0EB is 4.91:1. */
.td-eyebrow {
  letter-spacing:.13em;
  text-transform:uppercase;
  color:var(--td-brand-text);
  background:var(--td-brand-tint);
  border:1px solid var(--td-brand-line);
  border-radius:var(--td-radius-pill);
  align-self:flex-start;
  padding:5px 12px;
  margin-bottom:10px;
  font-size:10.5px;
  font-weight:900;
  display:inline-block
}

.td-section-head h2 {
  letter-spacing:-.035em;
  font-size:clamp(22px,2.2vw,30px);
  font-weight:900;
  line-height:1.14
}

.td-section-head p {
  max-width:720px;
  color:var(--td-muted);
  margin-top:6px;
  font-size:14px;
  line-height:1.6
}

.td-section-actions {
  flex:none;
  align-items:center;
  gap:8px;
  display:flex
}

.td-scroller {
  position:relative
}

.td-track {
  scroll-snap-type:x proximity;
  scroll-behavior:smooth;
  scrollbar-width:none;
  overscroll-behavior-x:contain;
  gap:16px;
  padding:2px 2px 6px;
  display:flex;
  overflow-x:auto
}

.td-track::-webkit-scrollbar {
  display:none
}

.td-track>* {
  scroll-snap-align:start
}

/* ---------- category card ----------
   Square media on top, label + "Explore" beneath. The hover state lifts the
   card, tints the frame with the brand colour and slides the arrow, so the
   whole card reads as one object rather than a list of tiles. */

.td-cat-card {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  flex-direction:column;
  flex:0 0 208px;
  transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s,border-color .24s;
  display:flex;
  overflow:hidden;
  position:relative
}

.td-cat-card:after {
  content:"";
  background:var(--td-brand);
  width:0;
  height:3px;
  transition:width .28s cubic-bezier(.2,.7,.3,1);
  position:absolute;
  bottom:0;
  left:0
}

.td-cat-card:hover {
  border-color:var(--td-sand);
  box-shadow:var(--td-shadow-lg);
  transform:translateY(-6px)
}

.td-cat-card:hover:after {
  width:100%
}

.td-cat-card:focus-visible {
  outline:3px solid var(--td-brand);
  outline-offset:3px
}

.td-cat-media {
  aspect-ratio:1;
  background:var(--td-soft);
  overflow:hidden;
  position:relative
}

.td-cat-media img {
  object-fit:cover;
  width:100%;
  height:100%;
  transition:transform .4s cubic-bezier(.2,.7,.3,1)
}

.td-cat-card:hover .td-cat-media img {
  transform:scale(1.08)
}

.td-cat-body {
  text-align:center;
  padding:14px 14px 16px;
  display:flex;
  flex-direction:column;
  flex:1
}

.td-cat-body strong {
  -webkit-line-clamp:2;
  min-height:38px;
  color:var(--td-ink);
  -webkit-box-orient:vertical;
  font-size:14px;
  font-weight:800;
  line-height:1.38;
  display:-webkit-box;
  overflow:hidden
}

.td-cat-card:hover .td-cat-body strong {
  color:var(--td-brand-text)
}

.td-cat-go {
  color:var(--td-brand-text);
  align-items:center;
  justify-content:center;
  gap:5px;
  margin-top:auto;
  padding-top:10px;
  font-size:11.5px;
  font-weight:800;
  transition:gap .18s;
  display:inline-flex
}

.td-cat-go svg {
  transition:transform .18s
}

.td-cat-card:hover .td-cat-go {
  gap:9px
}

.td-cat-card:hover .td-cat-go svg {
  transform:translateX(2px)
}

/* ---------- product card ----------
   Media block, then category / title / meta / price+add. The add button is the
   only brand-filled control on the card so the eye lands on it first; every
   other brand use is text-safe (#C63100, 5.47:1 on white). */

.td-prod-card {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  flex-direction:column;
  flex:0 0 226px;
  transition:transform .24s cubic-bezier(.2,.7,.3,1),box-shadow .24s,border-color .24s;
  display:flex;
  overflow:hidden;
  position:relative
}

.td-prod-card:before {
  content:"";
  background:linear-gradient(180deg,var(--td-brand) 0%,var(--td-brand-dark) 100%);
  width:0;
  height:4px;
  transition:width .28s cubic-bezier(.2,.7,.3,1);
  position:absolute;
  top:0;
  left:0;
  z-index:3
}

.td-prod-card:hover {
  border-color:var(--td-sand);
  box-shadow:var(--td-shadow-lg);
  transform:translateY(-6px)
}

.td-prod-card:hover:before {
  width:100%
}

.td-prod-card:focus-within {
  border-color:var(--td-sand)
}

.td-prod-media {
  aspect-ratio:1;
  border-bottom:1px solid var(--td-line-soft);
  background:var(--td-soft);
  position:relative;
  overflow:hidden
}

.td-prod-media img {
  object-fit:contain;
  width:100%;
  height:100%;
  padding:14px;
  transition:transform .38s cubic-bezier(.2,.7,.3,1)
}

.td-prod-card:hover .td-prod-media img {
  transform:scale(1.06)
}

/* Discount pill. Small bold caps need 4.5:1, so the fill is #C63100 with
   white text (5.47:1) rather than the raw #FF4300 (3.47:1). */
.td-badge-sale {
  z-index:2;
  background:var(--td-brand-btn);
  color:#fff;
  letter-spacing:.05em;
  text-transform:uppercase;
  border-radius:var(--td-radius-pill);
  box-shadow:0 4px 12px #FF430040;
  padding:5px 10px;
  font-size:10px;
  font-weight:900;
  position:absolute;
  top:10px;
  left:10px
}

.td-badge-stock {
  z-index:2;
  border-radius:var(--td-radius-pill);
  background:var(--td-navy);
  color:#fff;
  padding:5px 10px;
  font-size:10px;
  font-weight:800;
  position:absolute;
  top:10px;
  right:10px
}

.td-prod-body {
  flex-direction:column;
  flex:auto;
  gap:7px;
  padding:14px;
  display:flex
}

.td-prod-cat {
  color:var(--td-brand-text);
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  text-transform:uppercase;
  transition:color .16s;
  display:block;
  overflow:hidden
}

.td-prod-cat:hover {
  color:var(--td-brand-btn-hover);
  text-decoration:underline
}

.td-prod-title {
  -webkit-line-clamp:2;
  min-height:40px;
  color:var(--td-ink);
  -webkit-box-orient:vertical;
  margin:0;
  font-size:14px;
  font-weight:700;
  line-height:1.42;
  display:-webkit-box;
  overflow:hidden
}

.td-prod-title a {
  transition:color .16s
}

.td-prod-title a:hover {
  color:var(--td-brand-text)
}

.td-prod-meta {
  color:var(--td-muted);
  align-items:center;
  gap:6px;
  font-size:11px;
  font-weight:600;
  line-height:1.4;
  display:flex
}

.td-prod-meta svg {
  width:12px;
  height:12px;
  color:var(--td-success);
  flex:none
}

.td-prod-foot {
  justify-content:space-between;
  align-items:flex-end;
  gap:10px;
  margin-top:auto;
  border-top:1px solid var(--td-line-soft);
  padding-top:11px;
  display:flex
}

.td-price {
  flex-direction:column;
  min-width:0;
  line-height:1.15;
  display:flex
}

.td-price strong {
  color:var(--td-ink);
  letter-spacing:-.025em;
  font-size:18px;
  font-weight:900
}

.td-price del {
  color:var(--td-muted);
  font-size:11.5px;
  font-weight:700
}

/* Brand-filled add-to-cart. */
.td-add-btn {
  border-radius:var(--td-radius-sm);
  background:var(--td-brand-btn);
  color:#fff;
  white-space:nowrap;
  border:0;
  justify-content:center;
  align-items:center;
  gap:6px;
  min-width:70px;
  height:38px;
  padding:0 13px;
  font-size:11.5px;
  font-weight:900;
  line-height:1;
  box-shadow:0 6px 16px #FF43002e;
  transition:background-color .18s,transform .15s,box-shadow .18s;
  display:inline-flex;
  cursor:pointer
}

.td-add-btn:hover {
  background:var(--td-brand-btn-hover);
  box-shadow:0 10px 22px #FF430047
}

.td-add-btn:active {
  transform:scale(.95)
}

.td-add-btn svg {
  width:15px;
  height:15px
}

.td-add-btn.is-added {
  background:var(--td-success);
  box-shadow:none
}

.td-add-btn[disabled] {
  cursor:not-allowed;
  background:#8A979D;
  box-shadow:none
}

.td-prod-card.is-out .td-prod-media img {
  opacity:.55
}

.td-prod-grid {
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:16px;
  display:grid
}

.td-prod-grid .td-prod-card {
  flex:auto;
  min-width:0
}

.td-banner-grid {
  gap:var(--td-gap);
  grid-template-columns:1fr 1fr;
  display:grid
}

.td-wide-banner {
  border-radius:var(--td-radius);
  min-height:196px;
  box-shadow:var(--td-shadow-sm);
  isolation:isolate;
  background-position:50%;
  background-size:cover;
  flex-direction:column;
  justify-content:center;
  gap:6px;
  padding:28px 30px;
  display:flex;
  position:relative;
  overflow:hidden
}

.td-wide-banner:after {
  content:"";
  z-index:-1;
  background:linear-gradient(90deg,#fffffff0,#ffffffad 48%,#fff3);
  position:absolute;
  inset:0
}

.td-wide-banner.is-photo:after {
  background:linear-gradient(90deg,#fffffff2,#fffc 40%,#ffffff4d)
}

.td-wide-banner span {
  color:var(--td-coral-text);
  letter-spacing:.11em;
  text-transform:uppercase;
  font-size:11.5px;
  font-weight:900
}

.td-wide-banner strong {
  max-width:420px;
  color:var(--td-navy);
  letter-spacing:-.03em;
  font-size:28px;
  font-weight:900;
  line-height:1.12
}

.td-wide-banner .td-pill {
  background:#ffffffb8;
  width:max-content;
  margin-top:10px
}

.td-special {
  gap:var(--td-gap);
  grid-template-columns:330px minmax(0,1fr);
  align-items:stretch;
  display:grid
}

.td-special .td-prod-grid {
  grid-template-columns:repeat(3,minmax(0,1fr))
}

.td-deal {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-sm);
  background:#fff;
  flex-direction:column;
  display:flex;
  position:relative;
  overflow:hidden
}

.td-deal-media {
  isolation:isolate;
  background:linear-gradient(140deg,#e6f0ef,#fdf1ec) 50%/cover;
  flex-direction:column;
  flex:auto;
  justify-content:flex-end;
  gap:6px;
  min-height:250px;
  padding:24px;
  display:flex;
  position:relative;
  overflow:hidden
}

.td-deal-media:after {
  content:"";
  z-index:-1;
  background:linear-gradient(#ffffffb8 0,#fff6 42%,#ffffffe6 100%);
  position:absolute;
  inset:0
}

.td-deal-media.is-photo:after {
  background:linear-gradient(#091c263d 0,#091c2680 45%,#091c26e0 100%)
}

.td-deal-media.is-photo>* {
  color:#fff
}

.td-deal-media.is-photo .td-pill {
  color:var(--td-navy);
  background:#ffffffe6;
  border-color:#0000
}

.td-deal-media span {
  color:var(--td-coral-text);
  letter-spacing:.11em;
  text-transform:uppercase;
  font-size:11.5px;
  font-weight:900
}

.td-deal-media strong {
  max-width:270px;
  color:var(--td-navy);
  letter-spacing:-.035em;
  font-size:28px;
  font-weight:900;
  line-height:1.1
}

.td-deal-media p {
  color:var(--td-muted);
  margin-top:4px;
  font-size:13.5px;
  line-height:1.6
}

.td-deal-media .td-pill {
  width:max-content;
  margin-top:12px
}

.td-countdown {
  color:#92400e;
  background:#fffbeb;
  border-top:1px solid #fde68a;
  justify-content:center;
  align-items:center;
  gap:9px;
  margin:0;
  padding:11px 14px;
  font-size:12.5px;
  font-weight:800;
  display:flex
}

.td-countdown b {
  font-variant-numeric:tabular-nums;
  color:#b45309;
  font-weight:900
}

.td-tag-card {
  border:1px solid var(--td-line);
  border-left:4px solid var(--td-teal);
  border-radius:var(--td-radius-sm);
  min-height:92px;
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  flex-direction:column;
  flex:0 0 190px;
  justify-content:space-between;
  gap:10px;
  padding:15px 16px;
  transition:transform .2s,box-shadow .2s,border-color .2s;
  display:flex
}

.td-tag-card:hover {
  border-color:var(--td-sand);
  border-left-color:var(--td-coral);
  box-shadow:var(--td-shadow-sm);
  transform:translateY(-2px)
}

.td-tag-card strong {
  color:var(--td-ink);
  word-break:break-word;
  font-size:14px;
  font-weight:800;
  line-height:1.35
}

.td-tag-card span {
  color:var(--td-teal);
  align-items:center;
  gap:5px;
  font-size:11.5px;
  font-weight:800;
  display:inline-flex
}

.td-info-grid {
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  display:grid
}

.td-info-item {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  gap:14px;
  padding:20px;
  transition:transform .22s,box-shadow .22s,border-color .22s;
  display:flex;
  position:relative;
  overflow:hidden
}

.td-info-item:after {
  content:"";
  background:linear-gradient(90deg,var(--td-teal),var(--td-coral));
  transform-origin:0;
  height:3px;
  transition:transform .28s;
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  transform:scaleX(0)
}

.td-info-item:hover {
  box-shadow:var(--td-shadow);
  border-color:var(--td-sand);
  transform:translateY(-4px)
}

.td-info-item:hover:after {
  transform:scaleX(1)
}

.td-info-ico {
  width:38px;
  height:38px;
  color:var(--td-teal);
  background:#FF430014;
  border-radius:11px;
  flex:0 0 38px;
  place-items:center;
  display:grid
}

.td-info-ico svg {
  width:20px;
  height:20px
}

.td-info-item strong {
  color:var(--td-ink);
  font-size:14.5px;
  font-weight:800;
  line-height:1.35;
  display:block
}

.td-info-item p {
  color:var(--td-muted);
  margin-top:3px;
  font-size:13px;
  line-height:1.55
}

.td-collection {
  padding:26px 0 56px
}

.td-collection-hero {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:linear-gradient(140deg,#fff,#f6faf9);
  justify-content:space-between;
  align-items:flex-end;
  gap:22px;
  margin-bottom:22px;
  padding:24px 26px;
  display:flex
}

.td-collection-hero h1 {
  letter-spacing:-.035em;
  font-size:clamp(24px,2.6vw,34px);
  font-weight:900;
  line-height:1.12
}

.td-collection-hero p {
  max-width:760px;
  color:var(--td-muted);
  margin-top:6px;
  font-size:14px;
  line-height:1.6
}

.td-collection-count {
  color:var(--td-muted);
  margin-top:8px;
  font-size:13px;
  font-weight:700;
  display:block
}

.td-collection-tools {
  flex-wrap:wrap;
  flex:none;
  align-items:center;
  gap:10px;
  display:flex
}

.td-csearch {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  background:#fff;
  align-items:center;
  height:44px;
  transition:border-color .18s,box-shadow .18s;
  display:flex;
  overflow:hidden
}

.td-csearch:focus-within {
  border-color:var(--td-teal);
  box-shadow:0 0 0 3px #FF430017
}

.td-csearch input {
  width:220px;
  height:42px;
  color:var(--td-ink);
  background:0 0;
  border:0;
  outline:0;
  padding:0 12px;
  font-size:13.5px;
  font-weight:600
}

.td-csearch button {
  background:var(--td-teal);
  color:#fff;
  white-space:nowrap;
  border:0;
  height:44px;
  padding:0 18px;
  font-size:13px;
  font-weight:800;
  transition:background-color .18s
}

.td-csearch button:hover {
  background:var(--td-teal-hover)
}

.td-csort {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  appearance:none;
  height:44px;
  color:var(--td-ink);
  cursor:pointer;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236b7c85' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") right 10px center/14px no-repeat;
  padding:0 34px 0 12px;
  font-size:13px;
  font-weight:700
}

.td-empty {
  text-align:center;
  border:1px dashed var(--td-line);
  border-radius:var(--td-radius-lg);
  background:#fff;
  grid-column:1/-1;
  padding:56px 24px
}

.td-empty h2 {
  margin-bottom:8px;
  font-size:21px;
  font-weight:900
}

.td-empty p {
  color:var(--td-muted);
  margin-bottom:18px
}

.td-empty svg {
  color:#c4d0d5;
  width:48px;
  height:48px;
  margin:0 auto 14px
}

.td-pager {
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  gap:6px;
  margin-top:28px;
  display:flex
}

.td-pager a,.td-pager span {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  min-width:38px;
  height:38px;
  color:var(--td-ink);
  background:#fff;
  justify-content:center;
  align-items:center;
  padding:0 10px;
  font-size:13px;
  font-weight:800;
  transition:border-color .18s,color .18s,background-color .18s;
  display:inline-flex
}

.td-pager a:hover {
  border-color:var(--td-teal);
  color:var(--td-teal)
}

.td-pager .is-current {
  border-color:var(--td-teal);
  background:var(--td-teal);
  color:#fff
}

.td-pager .is-off {
  color:var(--td-muted);
  pointer-events:none
}

.td-pd {
  padding:18px 0 56px
}

.td-crumbs {
  color:var(--td-muted);
  flex-wrap:wrap;
  align-items:center;
  gap:7px;
  margin-bottom:16px;
  font-size:12.5px;
  display:flex
}

.td-crumbs a {
  color:var(--td-ink);
  font-weight:800;
  transition:color .16s
}

.td-crumbs a:hover {
  color:var(--td-brand-text)
}

.td-crumbs span[aria-hidden] {
  opacity:.6
}

.td-pd-top {
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:start;
  gap:34px;
  margin-bottom:32px;
  display:grid
}

.td-pd-gallery {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-sm);
  background:#fff;
  padding:18px;
  position:relative;
  overflow:hidden
}

.td-pd-gallery:before {
  content:"";
  background:linear-gradient(90deg,var(--td-brand) 0%,var(--td-brand-dark) 100%);
  height:4px;
  position:absolute;
  top:0;
  left:0;
  right:0
}

.td-pd-main {
  aspect-ratio:1;
  border:1px solid var(--td-line-soft);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  place-items:center;
  display:grid;
  position:relative;
  overflow:hidden
}

.td-pd-main img {
  object-fit:contain;
  width:100%;
  height:100%;
  padding:22px
}

/* Same rule as the card badge: small caps text needs #C63100, not #FF4300. */
.td-pd-off {
  z-index:2;
  background:var(--td-brand-btn);
  color:#fff;
  letter-spacing:.04em;
  border-radius:var(--td-radius-pill);
  box-shadow:0 6px 16px #FF430047;
  padding:6px 12px;
  font-size:11px;
  font-weight:900;
  position:absolute;
  top:14px;
  left:14px
}

.td-pd-thumbs {
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
  display:flex
}

.td-pd-thumb {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  cursor:pointer;
  background:#fff;
  place-items:center;
  width:68px;
  height:68px;
  padding:5px;
  transition:border-color .16s,box-shadow .16s,transform .16s;
  display:grid
}

.td-pd-thumb:hover {
  border-color:var(--td-sand);
  transform:translateY(-2px)
}

.td-pd-thumb.is-active {
  border-color:var(--td-brand);
  box-shadow:0 0 0 3px #FF430026
}

.td-pd-thumb img {
  object-fit:contain;
  width:100%;
  height:100%
}

.td-pd-sum {
  min-width:0
}

.td-pills {
  flex-wrap:wrap;
  gap:7px;
  margin-bottom:12px;
  display:flex
}

.td-pills a,.td-pills span {
  border-radius:var(--td-radius-pill);
  color:#1d4ed8;
  background:#f1f7ff;
  border:1px solid #dbe7f5;
  padding:5px 10px;
  font-size:11.5px;
  font-weight:800;
  display:inline-flex
}

.td-pd-sum h1 {
  letter-spacing:-.035em;
  margin-bottom:10px;
  font-size:clamp(22px,2.6vw,32px);
  font-weight:900;
  line-height:1.16
}

.td-rating {
  color:var(--td-muted);
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
  font-size:13px;
  display:flex
}

.td-stars {
  gap:2px;
  display:inline-flex
}

.td-stars svg {
  color:#e6b422;
  width:15px;
  height:15px
}

.td-stars svg.is-off {
  color:#dbe2e6
}

.td-stock {
  align-items:center;
  gap:6px;
  font-weight:800;
  display:inline-flex
}

.td-stock.is-in {
  color:var(--td-success)
}

.td-stock.is-out {
  color:var(--td-danger)
}

/* Price block: tinted brand panel so the number is the heaviest thing on the
   right-hand column. 32px / 900 weight is large text, so #FF4300 would be
   legal here, but the ink colour is kept for consistency with every card. */
.td-pricebox {
  border:1px solid var(--td-brand-line);
  border-radius:var(--td-radius-lg);
  background:var(--td-brand-tint);
  flex-wrap:wrap;
  align-items:center;
  gap:14px;
  margin-bottom:16px;
  padding:16px 18px;
  display:flex
}

.td-pricebox strong {
  color:var(--td-brand-text);
  letter-spacing:-.035em;
  font-size:34px;
  font-weight:900;
  line-height:1
}

.td-pricebox del {
  color:var(--td-muted);
  font-size:15px;
  font-weight:700
}

.td-pricebox em {
  color:#fff;
  background:var(--td-brand-btn);
  border-radius:var(--td-radius-pill);
  padding:5px 12px;
  font-size:12px;
  font-style:normal;
  font-weight:900
}

.td-shortdesc {
  color:var(--td-body);
  margin-bottom:20px;
  font-size:14.5px;
  line-height:1.75
}

.td-shortdesc p {
  margin:0 0 8px
}

.td-shortdesc p:last-child {
  margin-bottom:0
}

.td-buyrow {
  grid-template-columns:112px 1fr 1fr;
  gap:10px;
  margin-bottom:16px;
  display:grid
}

.td-qty-lg {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  background:#fff;
  align-items:center;
  height:52px;
  display:flex;
  overflow:hidden
}

.td-qty-lg button {
  background:var(--td-soft);
  width:38px;
  height:100%;
  color:var(--td-ink);
  border:0;
  font-size:18px;
  font-weight:900;
  transition:background-color .16s,color .16s
}

.td-qty-lg button:hover {
  background:var(--td-brand-btn);
  color:#fff
}

.td-qty-lg input {
  text-align:center;
  background:#fff;
  border:0;
  flex:1;
  align-self:stretch;
  width:32px;
  min-width:0;
  min-height:26px;
  font-size:15px;
  font-weight:900
}

.td-add-lg,.td-buy-lg {
  border-radius:var(--td-radius-sm);
  white-space:nowrap;
  border:1px solid #0000;
  justify-content:center;
  align-items:center;
  gap:8px;
  height:52px;
  font-size:14px;
  font-weight:900;
  transition:background-color .18s,border-color .18s,color .18s,transform .15s,box-shadow .18s;
  display:flex;
  cursor:pointer
}

.td-add-lg {
  background:var(--td-brand-btn);
  color:#fff;
  box-shadow:var(--td-shadow-brand)
}

.td-add-lg:hover {
  background:var(--td-brand-btn-hover);
  box-shadow:0 12px 28px #FF430047
}

.td-add-lg.is-added {
  background:var(--td-success);
  box-shadow:none
}

/* Buy-now stays navy: two brand-orange buttons side by side would compete,
   and navy-on-brand-tint is the strongest pairing on the page. */
.td-buy-lg {
  background:var(--td-navy);
  color:#fff
}

.td-buy-lg:hover {
  background:var(--td-navy-2)
}

.td-buy-lg.is-added {
  background:var(--td-success)
}

.td-add-lg:active,.td-buy-lg:active {
  transform:scale(.98)
}

.td-add-lg svg,.td-buy-lg svg {
  width:17px;
  height:17px
}

.td-add-lg[disabled],.td-buy-lg.is-disabled {
  pointer-events:none;
  background:#8A979D;
  box-shadow:none
}

.td-promises {
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:16px;
  display:grid
}

.td-promise {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  background:#fff;
  align-items:center;
  gap:10px;
  padding:11px 12px;
  display:flex
}

.td-promise svg {
  width:19px;
  height:19px;
  color:var(--td-teal);
  flex:none
}

.td-promise strong {
  color:var(--td-ink);
  font-size:12.5px;
  font-weight:800;
  line-height:1.25;
  display:block
}

.td-promise span {
  color:var(--td-muted);
  margin-top:1px;
  font-size:11.5px;
  line-height:1.35;
  display:block
}

.td-accord {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:#fff;
  overflow:hidden
}

.td-accord summary {
  cursor:pointer;
  color:var(--td-ink);
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:14px 16px;
  font-size:14.5px;
  font-weight:900;
  list-style:none;
  transition:background-color .16s;
  display:flex
}

.td-accord summary::-webkit-details-marker {
  display:none
}

.td-accord summary:after {
  content:"▾";
  color:var(--td-muted);
  font-size:13px;
  transition:transform .2s
}

.td-accord[open] summary:after {
  transform:rotate(180deg)
}

.td-accord summary:hover {
  background:var(--td-soft)
}

.td-accord-body {
  padding:0 16px 16px
}

.td-accord-body table {
  border-collapse:collapse;
  width:100%;
  font-size:13.5px
}

.td-accord-body td {
  border-top:1px solid var(--td-line-soft);
  vertical-align:top;
  padding:9px 0
}

.td-accord-body td:first-child {
  width:44%;
  color:var(--td-muted);
  padding-right:14px;
  font-weight:700
}

.td-accord-body td:last-child {
  color:var(--td-ink);
  font-weight:700
}

.td-share {
  border-top:1px solid var(--td-line-soft);
  align-items:center;
  gap:8px;
  margin-top:4px;
  padding-top:14px;
  display:flex
}

.td-share span {
  color:var(--td-muted);
  font-size:12.5px;
  font-weight:800
}

.td-share a {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  width:34px;
  height:34px;
  color:var(--td-navy);
  background:#fff;
  place-items:center;
  transition:background-color .16s,border-color .16s,color .16s;
  display:grid
}

.td-share a:hover {
  background:var(--td-teal);
  border-color:var(--td-teal);
  color:#fff
}

.td-share svg {
  width:15px;
  height:15px
}

/* ---------- detail panels ---------- */

.td-panel {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  margin-bottom:20px;
  padding:24px 26px
}

.td-panel>h2 {
  letter-spacing:-.02em;
  color:var(--td-ink);
  border-left:4px solid var(--td-brand);
  border-radius:2px;
  padding-left:12px;
  margin-bottom:10px;
  font-size:clamp(18px,2vw,23px);
  font-weight:900
}

.td-panel>h3 {
  color:var(--td-ink);
  margin-bottom:8px;
  font-size:16px;
  font-weight:900
}

.td-prose {
  color:var(--td-body);
  overflow-wrap:anywhere;
  font-size:14.5px;
  line-height:1.8
}

.td-prose h2,.td-prose h3,.td-prose h4 {
  color:var(--td-ink);
  margin:24px 0 10px;
  font-weight:900;
  line-height:1.3
}

.td-prose h2 {
  font-size:19px
}

.td-prose h3 {
  font-size:17px
}

.td-prose h4 {
  font-size:15.5px
}

.td-prose p {
  margin:0 0 12px
}

.td-prose ul,.td-prose ol {
  margin:10px 0 14px;
  padding-left:22px
}

.td-prose ul {
  list-style:outside
}

.td-prose ol {
  list-style:decimal
}

.td-prose li {
  margin:5px 0
}

.td-prose li::marker {
  color:var(--td-brand-text)
}

.td-prose a {
  color:var(--td-brand-text);
  text-underline-offset:2px;
  font-weight:700
}

.td-prose a:hover {
  color:var(--td-brand-btn-hover)
}

.td-prose img {
  border-radius:var(--td-radius);
  max-width:100%;
  height:auto;
  margin:14px auto
}

.td-prose table {
  border-collapse:collapse;
  width:100%;
  margin:12px 0
}

.td-prose th,.td-prose td {
  border:1px solid var(--td-line);
  vertical-align:top;
  padding:9px 10px
}

.td-prose td:empty {
  display:none
}

/* Header row tint. Written against thead rather than "th" so it does not
   collide with the existing ".td-prose th,.td-prose td" rule below. */
.td-prose thead td {
  color:var(--td-ink);
  background:var(--td-soft);
  font-weight:800
}

.td-prose iframe,.td-prose video {
  max-width:100%
}

/* Spec sheet: each cell carries a hairline and a brand-tinted label. */
.td-spec {
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:16px;
  display:grid
}

.td-spec>div {
  border:1px solid var(--td-line-soft);
  border-radius:var(--td-radius-sm);
  background:var(--td-soft);
  padding:12px 14px
}

.td-spec span {
  color:var(--td-brand-text);
  letter-spacing:.06em;
  text-transform:uppercase;
  font-size:10.5px;
  font-weight:900;
  display:block
}

.td-spec strong {
  color:var(--td-ink);
  word-break:break-word;
  margin-top:4px;
  font-size:13.5px;
  font-weight:800;
  line-height:1.5;
  display:block
}

.td-tagcloud {
  flex-wrap:wrap;
  gap:8px;
  margin-top:12px;
  display:flex
}

.td-tagcloud a {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  color:var(--td-ink);
  background:#fff;
  padding:7px 12px;
  font-size:12.5px;
  font-weight:800;
  transition:background-color .16s,border-color .16s,color .16s;
  display:inline-flex
}

.td-tagcloud a:hover {
  background:var(--td-teal);
  border-color:var(--td-teal);
  color:#fff
}

.td-faq {
  gap:9px;
  margin-top:14px;
  display:grid
}

.td-faq details {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  background:#fff
}

.td-faq summary {
  cursor:pointer;
  color:var(--td-ink);
  justify-content:space-between;
  align-items:center;
  gap:10px;
  padding:13px 15px;
  font-size:14px;
  font-weight:800;
  list-style:none;
  display:flex
}

.td-faq summary::-webkit-details-marker {
  display:none
}

.td-faq summary:after {
  content:"+";
  color:var(--td-muted);
  font-size:17px;
  line-height:1
}

.td-faq details[open] summary:after {
  content:"−"
}

.td-faq p {
  color:#43555d;
  margin:0;
  padding:0 15px 14px;
  font-size:13.5px;
  line-height:1.7
}

.td-reviews {
  grid-template-columns:320px minmax(0,1fr);
  align-items:start;
  gap:18px;
  display:grid
}

.td-revsum {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  padding:20px;
  position:sticky;
  top:150px
}

.td-revsum-score {
  color:var(--td-ink);
  font-size:30px;
  font-weight:900;
  line-height:1
}

.td-revsum small {
  color:var(--td-muted);
  margin-top:6px;
  font-size:12px;
  line-height:1.4;
  display:block
}

.td-revsum .td-stars {
  margin:8px 0 16px
}

.td-bars {
  gap:6px;
  margin-bottom:16px;
  display:grid
}

.td-bar {
  color:var(--td-muted);
  grid-template-columns:44px 1fr 34px;
  align-items:center;
  gap:8px;
  font-size:11.5px;
  display:grid
}

.td-bar i {
  background:#eef2f4;
  border-radius:999px;
  height:6px;
  display:block;
  overflow:hidden
}

.td-bar i b {
  background:#e6b422;
  border-radius:999px;
  height:100%;
  display:block
}

.td-revlist {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  padding:20px 22px
}

.td-revlist-head {
  border-bottom:1px solid var(--td-line-soft);
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:14px;
  padding-bottom:14px;
  display:flex
}

.td-revlist-head h3 {
  font-size:16px;
  font-weight:900
}

.td-rev-item {
  border-bottom:1px solid var(--td-line-soft);
  padding:16px 0
}

.td-rev-item:last-child {
  border-bottom:0;
  padding-bottom:0
}

.td-rev-item-top {
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:7px;
  display:flex
}

.td-rev-item strong {
  color:var(--td-ink);
  font-size:13.5px;
  font-weight:800
}

.td-rev-item time {
  color:var(--td-muted);
  font-size:11.5px
}

.td-rev-item p {
  color:#43555d;
  margin:0;
  font-size:13.5px;
  line-height:1.7
}

.td-rev-empty {
  text-align:center;
  color:var(--td-muted);
  border:1px dashed var(--td-line);
  border-radius:var(--td-radius);
  padding:26px;
  font-size:13.5px
}

.td-revform {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  margin-top:18px;
  padding:20px 22px
}

.td-revform h3 {
  margin-bottom:14px;
  font-size:16px;
  font-weight:900
}

.td-revform form {
  gap:12px;
  display:grid
}

.td-starpick {
  flex-direction:row-reverse;
  justify-content:flex-end;
  gap:2px;
  display:flex
}

.td-starpick input {
  opacity:0;
  width:0;
  height:0;
  position:absolute
}

.td-starpick label {
  cursor:pointer;
  color:#d6dee3;
  font-size:22px;
  line-height:1;
  transition:color .12s
}

.td-starpick label:hover,.td-starpick label:hover~label,.td-starpick input:checked~label {
  color:#e6b422
}

.td-formgrid {
  grid-template-columns:1fr 1fr;
  gap:12px;
  display:grid
}

.td-formgrid .full {
  grid-column:1/-1
}

.td-helpnote {
  color:var(--td-muted);
  font-size:11.5px;
  line-height:1.5
}

.td-wa-float {
  z-index:1010;
  border-radius:var(--td-radius-pill);
  color:#fff;
  background:#0f7f72;
  align-items:center;
  gap:10px;
  height:52px;
  padding:0 20px 0 16px;
  font-size:14px;
  font-weight:800;
  line-height:1;
  transition:transform .18s,box-shadow .18s,background-color .18s;
  display:inline-flex;
  position:fixed;
  bottom:76px;
  right:18px;
  box-shadow:0 10px 30px #0f7f7261
}

.td-wa-float:hover {
  color:#fff;
  background:#0f766e;
  transform:translateY(-2px);
  box-shadow:0 14px 36px #128c7e75
}

.td-wa-float:active {
  transform:scale(.97)
}

.td-wa-float svg {
  flex:0 0 24px;
  width:24px;
  height:24px
}

.td-buybar {
  display:none
}

.td-page {
  padding:22px 0 56px
}

.td-page-hero {
  border-radius:var(--td-radius-lg);
  background:linear-gradient(135deg,var(--td-navy),#0d3b46);
  color:#fff;
  box-shadow:var(--td-shadow);
  margin-bottom:20px;
  padding:30px 32px;
  position:relative;
  overflow:hidden
}

.td-page-hero:after {
  content:"";
  background:radial-gradient(circle,#FF43003d,#0000 68%);
  border-radius:50%;
  width:260px;
  height:260px;
  position:absolute;
  top:-60px;
  right:-60px
}

.td-page-hero>* {
  z-index:1;
  position:relative
}

.td-page-hero span {
  border-radius:var(--td-radius-pill);
  letter-spacing:.12em;
  text-transform:uppercase;
  background:#ffffff14;
  border:1px solid #ffffff38;
  margin-bottom:8px;
  padding:5px 11px;
  font-size:10.5px;
  font-weight:900;
  display:inline-block
}

.td-page-hero h1 {
  color:#fff;
  letter-spacing:-.035em;
  margin:0 0 8px;
  font-size:clamp(24px,3vw,38px);
  font-weight:900;
  line-height:1.12
}

.td-page-hero p {
  color:#ffffffd1;
  max-width:760px;
  margin:0;
  font-size:14.5px;
  line-height:1.7
}

.td-page-hero .td-hero-meta {
  color:#ffffff9e;
  margin-top:14px;
  font-size:12.5px
}

.td-page-body {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  padding:clamp(20px,3.4vw,40px)
}

.td-page-body.is-empty {
  text-align:center;
  color:var(--td-muted);
  padding:52px 24px
}

.td-page-body.is-empty svg {
  color:#c4d0d5;
  width:46px;
  height:46px;
  margin:0 auto 14px
}

.td-page-body.is-empty h2 {
  margin-bottom:8px;
  font-size:20px;
  font-weight:900
}

.td-points {
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-top:20px;
  display:grid
}

.td-point {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  flex-direction:column;
  gap:8px;
  padding:20px;
  transition:transform .22s,box-shadow .22s,border-color .22s;
  display:flex
}

.td-point:hover {
  box-shadow:var(--td-shadow);
  border-color:var(--td-sand);
  transform:translateY(-4px)
}

.td-point-ico {
  width:38px;
  height:38px;
  color:var(--td-teal);
  background:#FF430014;
  border-radius:11px;
  place-items:center;
  display:grid
}

.td-point-ico svg {
  width:20px;
  height:20px
}

.td-point strong {
  color:var(--td-ink);
  font-size:14.5px;
  font-weight:800;
  line-height:1.35
}

.td-point p {
  color:var(--td-muted);
  font-size:13px;
  line-height:1.55
}

.td-contact {
  grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);
  align-items:start;
  gap:20px;
  display:grid
}

.td-contact-cards {
  gap:12px;
  display:grid
}

.td-contact-card {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  gap:13px;
  padding:18px;
  display:flex
}

.td-contact-card .td-point-ico {
  flex:0 0 40px;
  width:40px;
  height:40px
}

.td-contact-card strong {
  color:var(--td-ink);
  font-size:13px;
  font-weight:800;
  display:block
}

.td-contact-card a,.td-contact-card p {
  color:var(--td-body);
  word-break:break-word;
  margin-top:3px;
  font-size:14px;
  font-weight:700;
  display:block
}

.td-contact-card a:hover {
  color:var(--td-teal)
}

.td-contact-form {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  padding:clamp(20px,3vw,30px)
}

.td-contact-form h2 {
  margin-bottom:4px;
  font-size:20px;
  font-weight:900
}

.td-contact-form>p {
  color:var(--td-muted);
  margin-bottom:18px;
  font-size:13.5px
}

.td-contact-form form {
  grid-template-columns:1fr 1fr;
  gap:14px;
  display:grid
}

.td-contact-form .full {
  grid-column:1/-1
}

.td-contact-form .td-btn {
  justify-self:start
}

.td-notice {
  border-radius:var(--td-radius);
  align-items:flex-start;
  gap:10px;
  margin-bottom:16px;
  padding:14px 16px;
  font-size:14px;
  font-weight:700;
  line-height:1.5;
  display:flex
}

.td-notice svg {
  flex:none;
  width:19px;
  height:19px;
  margin-top:1px
}

.td-notice-ok {
  background:var(--td-success-soft);
  border:1px solid var(--td-success-line);
  color:#166534
}

.td-notice-err {
  background:var(--td-danger-soft);
  border:1px solid var(--td-danger-line);
  color:#991b1b
}

.td-thanks {
  text-align:center;
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  width:min(100%,720px);
  box-shadow:var(--td-shadow);
  background:#fff;
  margin:0 auto;
  padding:clamp(28px,5vw,56px)
}

.td-thanks-ico {
  background:var(--td-success-soft);
  border:1px solid var(--td-success-line);
  width:70px;
  height:70px;
  color:var(--td-success);
  border-radius:50%;
  place-items:center;
  margin:0 auto 18px;
  display:grid
}

.td-thanks-ico svg {
  width:34px;
  height:34px
}

.td-thanks h1 {
  letter-spacing:-.035em;
  margin:0 0 10px;
  font-size:clamp(24px,3.4vw,34px);
  font-weight:900
}

.td-thanks p {
  max-width:520px;
  color:var(--td-muted);
  margin:0 auto;
  font-size:14.5px;
  line-height:1.75
}

.td-thanks-actions {
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:24px;
  display:flex
}

.td-thanks-steps {
  text-align:left;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:28px;
  display:grid
}

.td-thanks-step {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  padding:16px
}

.td-thanks-step b {
  color:var(--td-teal);
  letter-spacing:.1em;
  text-transform:uppercase;
  margin-bottom:5px;
  font-size:11px;
  font-weight:900;
  display:block
}

.td-thanks-step strong {
  color:var(--td-ink);
  font-size:13.5px;
  font-weight:800;
  line-height:1.4;
  display:block
}

.td-thanks-step p {
  margin-top:4px;
  font-size:12.5px
}

.td-trackbox {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  padding:clamp(20px,3vw,28px)
}

.td-trackbox form {
  grid-template-columns:1fr auto;
  gap:10px;
  margin-top:6px;
  display:grid
}

.td-track-result {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  margin-top:18px;
  padding:16px
}

.td-footer {
  background:var(--td-navy);
  color:#ffffffb8;
  margin-top:56px
}

.td-footer-help {
  margin-top:-34px
}

.td-footer-help-inner {
  border-radius:var(--td-radius-lg);
  background:linear-gradient(105deg,var(--td-teal),#173f49);
  color:#fff;
  box-shadow:var(--td-shadow);
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:20px 24px;
  display:flex
}

.td-footer-help-inner strong {
  letter-spacing:-.02em;
  font-size:18px;
  font-weight:900;
  display:block
}

.td-footer-help-inner span {
  color:#ffffffd1;
  margin-top:3px;
  font-size:13.5px;
  display:block
}

.td-footer-grid {
  grid-template-columns:1.7fr 1fr 1fr 1fr;
  gap:34px;
  padding:40px 0 26px;
  display:grid
}

.td-footer-brand p {
  max-width:520px;
  margin:14px 0 18px;
  font-size:13.5px;
  line-height:1.75
}

.td-footer-logo {
  border-radius:var(--td-radius);
  background:#fff;
  padding:10px 14px;
  display:inline-flex
}

.td-footer-logo img {
  object-fit:contain;
  width:auto;
  max-width:170px;
  max-height:42px
}

.td-footer-badges {
  flex-wrap:wrap;
  gap:7px;
  display:flex
}

.td-footer-badges span {
  border-radius:var(--td-radius-sm);
  color:#ffffffdb;
  border:1px solid #ffffff29;
  padding:6px 10px;
  font-size:11.5px;
  font-weight:700
}

.td-footer h3 {
  color:#fff;
  letter-spacing:-.01em;
  margin:0 0 14px;
  font-size:14.5px;
  font-weight:900
}

.td-footer li a {
  color:#ffffffbd;
  padding:5px 0;
  font-size:13.5px;
  font-weight:600;
  transition:color .18s,transform .18s;
  display:inline-block;
  position:relative
}

.td-footer li a:after {
  content:"";
  background:currentColor;
  width:0;
  height:1px;
  transition:width .2s;
  position:absolute;
  bottom:2px;
  left:0
}

.td-footer li a:hover {
  color:#fff;
  transform:translate(2px)
}

.td-footer li a:hover:after {
  width:100%
}

.td-footer-bottom {
  color:#ffffff80;
  border-top:1px solid #ffffff1a;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  padding:18px 0;
  font-size:12.5px;
  display:flex
}

.td-footer-bottom a {
  color:var(--td-coral-text);
  font-weight:800
}

.td-mnav {
  display:none
}

.td-cart-scroll {
  overscroll-behavior:contain;
  flex:auto;
  min-height:0;
  padding:14px 18px 0;
  overflow-y:auto
}

.td-cart-line {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  grid-template-columns:72px minmax(0,1fr);
  gap:12px;
  margin-bottom:10px;
  padding:13px;
  display:grid
}

.td-cart-line>img {
  object-fit:contain;
  border:1px solid var(--td-line-soft);
  border-radius:var(--td-radius-sm);
  background:#fff;
  width:72px;
  height:72px;
  padding:4px
}

.td-cart-line strong {
  -webkit-line-clamp:2;
  color:var(--td-ink);
  -webkit-box-orient:vertical;
  font-size:13px;
  font-weight:800;
  line-height:1.4;
  display:-webkit-box;
  overflow:hidden
}

.td-cart-line .td-cart-meta {
  color:var(--td-muted);
  margin:3px 0 8px;
  font-size:11.5px;
  font-weight:600
}

.td-cart-line-foot {
  justify-content:space-between;
  align-items:center;
  gap:10px;
  display:flex
}

.td-qty {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  background:#fff;
  grid-template-columns:30px 34px 30px;
  height:32px;
  display:inline-grid;
  overflow:hidden
}

.td-qty button {
  background:var(--td-soft);
  color:var(--td-ink);
  border:0;
  font-size:15px;
  font-weight:900;
  line-height:1;
  transition:background-color .16s,color .16s
}

.td-qty button:hover {
  background:var(--td-teal);
  color:#fff
}

.td-qty input {
  text-align:center;
  background:#fff;
  border:0;
  width:34px;
  font-size:13px;
  font-weight:800
}

.td-cart-line-price {
  color:var(--td-coral-text);
  white-space:nowrap;
  font-size:14px;
  font-weight:900
}

.td-cart-remove {
  color:var(--td-danger);
  background:0 0;
  border:0;
  padding:0;
  font-size:11.5px;
  font-weight:800
}

.td-cart-remove:hover {
  text-decoration:underline
}

.td-cart-empty {
  text-align:center;
  color:var(--td-muted);
  place-items:center;
  gap:8px;
  padding:56px 16px;
  display:grid
}

.td-cart-empty svg {
  opacity:.4;
  width:46px;
  height:46px
}

.td-cart-empty strong {
  color:var(--td-ink);
  font-size:16px
}

.td-cart-foot {
  border-top:1px solid var(--td-line);
  padding:14px 18px max(16px,env(safe-area-inset-bottom));
  background:#fff;
  flex:none;
  box-shadow:0 -8px 22px #1528320f
}

.td-cart-summary {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  margin-bottom:11px;
  padding:11px 13px
}

.td-cart-row {
  color:var(--td-body);
  justify-content:space-between;
  align-items:center;
  gap:12px;
  font-size:12.5px;
  display:flex
}

.td-cart-row+.td-cart-row {
  border-top:1px solid var(--td-line);
  margin-top:6px;
  padding-top:8px
}

.td-cart-row.is-total {
  padding-top:9px
}

.td-cart-row.is-total span {
  color:var(--td-ink);
  font-size:14px;
  font-weight:800
}

.td-cart-row.is-total strong {
  color:var(--td-coral-text);
  letter-spacing:-.02em;
  font-size:22px;
  font-weight:900
}

.td-cart-actions {
  grid-template-columns:1fr 1fr;
  gap:9px;
  display:grid
}

.td-sum-line {
  border-bottom:1px solid var(--td-line-soft);
  grid-template-columns:64px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:14px 18px;
  transition:opacity .18s;
  display:grid
}

.td-sum-line.is-busy {
  opacity:.5;
  pointer-events:none
}

.td-sum-line img {
  object-fit:contain;
  border:1px solid var(--td-line);
  background:#fff;
  border-radius:8px;
  width:64px;
  height:64px;
  padding:4px
}

.td-sum-info {
  min-width:0
}

.td-sum-info strong {
  color:var(--td-ink);
  font-size:13px;
  font-weight:800;
  line-height:1.4;
  display:block
}

.td-sum-info span {
  color:var(--td-muted);
  margin-top:3px;
  font-size:12px;
  display:block
}

.td-sum-info span em {
  color:var(--td-coral-text);
  font-style:normal;
  font-weight:800
}

.td-sum-foot {
  flex-wrap:wrap;
  align-items:center;
  gap:9px;
  margin-top:8px;
  display:flex
}

.td-sum-rm {
  color:var(--td-muted);
  cursor:pointer;
  background:0 0;
  border:0;
  padding:0;
  font-size:12px;
  font-weight:800;
  text-decoration:underline;
  transition:color .16s
}

.td-sum-rm:hover {
  color:var(--td-coral-text)
}

.td-sum-amt {
  color:var(--td-coral-text);
  white-space:nowrap;
  font-size:14px;
  font-weight:900
}

.td-sum-lines .td-sum-line:last-child {
  border-bottom:0
}

.td-checkout {
  grid-template-columns:minmax(0,1.15fr) minmax(330px,.85fr);
  align-items:start;
  gap:20px;
  margin-top:24px;
  display:grid
}

.td-checkout>* {
  min-width:0
}

.td-checkout-card {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  overflow:hidden
}

.td-checkout-head {
  border-bottom:1px solid var(--td-line);
  padding:16px 20px
}

.td-checkout-head strong,.td-summary-head strong {
  color:var(--td-ink);
  letter-spacing:-.02em;
  font-size:17px;
  font-weight:900;
  display:block
}

.td-checkout-head span,.td-summary-head span {
  margin-top:3px;
  color:var(--td-muted);
  font-size:13px;
  display:block
}

.td-form-grid {
  grid-template-columns:1fr 1fr;
  gap:14px;
  padding:20px;
  display:grid
}

.td-form-grid>* {
  min-width:0
}

.td-form-grid>.full {
  grid-column:1/-1
}

.td-summary {
  top:150px;
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  position:sticky;
  overflow:hidden
}

.td-summary-head {
  border-bottom:1px solid var(--td-line);
  padding:16px 20px
}

.td-sum-lines {
  overscroll-behavior:contain;
  max-height:340px;
  overflow-y:auto
}

.td-sum-product {
  border-bottom:1px solid var(--td-line-soft);
  align-items:center;
  gap:12px;
  padding:16px 18px;
  display:grid;
  grid-template-columns:76px minmax(0,1fr)
}

.td-sum-product img {
  object-fit:contain;
  border:1px solid var(--td-line);
  border-radius:8px;
  width:76px;
  height:76px;
  padding:5px
}

.td-sum-product a {
  color:var(--td-ink);
  font-size:14px;
  font-weight:800;
  line-height:1.4;
  display:block
}

.td-sum-product a:hover {
  color:var(--td-teal)
}

.td-sum-product span {
  margin-top:4px;
  color:var(--td-muted);
  font-size:12px;
  display:block
}

.td-summary-foot {
  padding:16px 18px
}

.td-totals {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  padding:12px 14px
}

.td-totals .td-cart-row del {
  color:var(--td-muted);
  font-weight:600
}

.td-summary-foot>.td-btn-block {
  width:100%
}

.td-summary-foot>.td-btn-lg {
  height:50px;
  margin-top:14px
}

.td-summary-foot>.td-btn-ghost {
  margin-top:9px
}

.td-summary-legal {
  margin-top:12px;
  color:var(--td-muted);
  text-align:center;
  font-size:12px;
  line-height:1.55
}

.td-summary-legal a {
  color:var(--td-teal);
  font-weight:800
}

.td-toast {
  z-index:1080;
  border:1px solid var(--td-line);
  border-left:4px solid var(--td-success);
  border-radius:var(--td-radius);
  width:min(420px,100vw - 28px);
  box-shadow:var(--td-shadow-lg);
  opacity:0;
  visibility:hidden;
  background:#fffffffc;
  grid-template-columns:52px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  padding:12px 14px;
  transition:opacity .22s,transform .22s,visibility .22s,border-color .22s;
  display:grid;
  position:fixed;
  top:20px;
  right:20px;
  transform:translateY(-14px)
}

.td-toast.is-open {
  opacity:1;
  visibility:visible;
  transform:translateY(0)
}

.td-toast.is-error {
  border-left-color:var(--td-danger)
}

.td-toast.is-info {
  border-left-color:var(--td-teal)
}

.td-toast-ico {
  border-radius:var(--td-radius-sm);
  background:var(--td-soft);
  width:52px;
  height:52px;
  color:var(--td-teal);
  place-items:center;
  display:grid
}

.td-toast-ico svg {
  width:26px;
  height:26px
}

.td-toast.is-success .td-toast-ico {
  color:var(--td-success);
  background:#128c781a
}

.td-toast.is-error .td-toast-ico {
  color:var(--td-danger);
  background:#c9403a1a
}

.td-toast img {
  object-fit:contain;
  border:1px solid var(--td-line-soft);
  border-radius:var(--td-radius-sm);
  background:#fff;
  width:100%;
  height:100%;
  padding:3px
}

.td-toast-txt {
  min-width:0
}

.td-toast strong {
  color:var(--td-ink);
  font-size:13.5px;
  font-weight:800;
  line-height:1.35;
  display:block
}

.td-toast small {
  color:var(--td-muted);
  overflow-wrap:anywhere;
  margin-top:2px;
  font-size:11.5px;
  line-height:1.45;
  display:block
}

.td-toast-x {
  width:26px;
  height:26px;
  color:var(--td-muted);
  background:0 0;
  border:0;
  border-radius:50%;
  place-items:center;
  transition:background-color .16s,color .16s;
  display:grid
}

.td-toast-x:hover {
  background:var(--td-soft);
  color:var(--td-ink)
}

.td-toast-x svg {
  width:15px;
  height:15px
}

.td-toast-view {
  border-radius:var(--td-radius-sm);
  background:var(--td-teal);
  color:#fff;
  white-space:nowrap;
  border:0;
  padding:9px 13px;
  font-size:12px;
  font-weight:800
}

.td-toast-view:hover {
  background:var(--td-teal-hover)
}

.td-label {
  color:var(--td-ink);
  margin-bottom:6px;
  font-size:12.5px;
  font-weight:800;
  display:block
}

.td-input {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-sm);
  width:100%;
  min-height:46px;
  color:var(--td-ink);
  background:#fff;
  outline:0;
  padding:11px 13px;
  font-size:14px;
  font-weight:600;
  transition:border-color .18s,box-shadow .18s
}

.td-input:focus {
  border-color:var(--td-teal);
  box-shadow:0 0 0 3px #FF43001a
}

textarea.td-input {
  resize:vertical;
  min-height:88px
}

.td-top-btn {
  z-index:800;
  border:1px solid var(--td-line);
  width:44px;
  height:44px;
  color:var(--td-navy);
  box-shadow:var(--td-shadow);
  opacity:0;
  visibility:hidden;
  background:#fff;
  border-radius:50%;
  place-items:center;
  transition:opacity .2s,visibility .2s,transform .2s,background-color .18s,color .18s;
  display:grid;
  position:fixed;
  bottom:18px;
  right:18px;
  transform:translateY(8px)
}

.td-top-btn.is-on {
  opacity:1;
  visibility:visible;
  transform:translateY(0)
}

.td-top-btn:hover {
  background:var(--td-teal);
  border-color:var(--td-teal);
  color:#fff
}

.td-top-btn svg {
  width:19px;
  height:19px
}
@media (max-width:1400px) {

  .td-hero-grid {
    grid-template-columns:238px minmax(0,1fr) 300px
  }

  .td-prod-grid {
    grid-template-columns:repeat(4,minmax(0,1fr))
  }

  .td-special {
    grid-template-columns:290px minmax(0,1fr)
  }

  .td-special .td-prod-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
}
@media (max-width:1200px) {

  .td-hero-grid {
    grid-template-columns:230px minmax(0,1fr)
  }

  .td-hero-side {
    display:none
  }

  .td-mainbar-grid {
    grid-template-columns:auto minmax(160px,200px) minmax(240px,1fr) auto;
    gap:16px
  }

  .td-footer-grid {
    grid-template-columns:1.5fr 1fr 1fr;
    gap:26px
  }

  .td-footer-grid>div:last-child {
    grid-column:2/-1
  }
}
@media (max-width:1199px) {

  .td-checkout {
    gap:16px;
    grid-template-columns:minmax(0,1fr) minmax(300px,.72fr)
  }

  .td-summary {
    top:132px
  }

  .td-sum-lines {
    max-height:300px
  }
}
@media (max-width:1023px) {

  .td-container {
    width:min(100% - 24px,var(--td-max))
  }

  .td-topbar {
    display:none
  }

  .td-mainbar-grid {
    grid-template-columns:auto 1fr auto;
    grid-template-areas:"burger logo actions";
    gap:10px;
    min-height:62px
  }

  .td-burger {
    display:inline-flex
  }

  .td-logo {
    justify-self:center
  }

  .td-logo img {
    max-width:150px;
    max-height:40px
  }

  .td-search,.td-nav,.td-actions .td-icon-link {
    display:none
  }

  .td-cart-btn {
    justify-content:center;
    width:42px;
    height:42px;
    padding:0;
    font-size:0
  }

  .td-cart-btn em {
    top:-5px;
    right:-5px
  }

  .td-hero {
    background:#fff;
    padding:10px 0 0
  }

  .td-hero-grid {
    grid-template-columns:1fr
  }

  .td-dept {
    display:none
  }

  .td-hero-main {
    min-height:330px
  }

  .td-hero-copy {
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    width:100%;
    min-height:330px;
    padding:26px 22px;
    display:flex;
    position:absolute;
    inset:auto;
    transform:none
  }

  .td-hero-slide.is-active .td-hero-copy {
    transform:none
  }

  .td-hero-slide:after {
    background:linear-gradient(#1528328c,#152832e6)
  }

  .td-hero-dots {
    bottom:18px;
    left:22px
  }

  .td-trust {
    grid-template-columns:repeat(2,1fr);
    margin-top:14px
  }

  .td-trust-item {
    border-right:0;
    border-bottom:1px solid var(--td-line-soft);
    padding:13px 15px
  }

  .td-trust-item:nth-child(2n) {
    border-right:0
  }

  .td-trust-item:nth-child(n+3) {
    border-bottom:0
  }

  .td-section {
    margin:34px 0
  }

  .td-section-head {
    flex-direction:column;
    align-items:stretch;
    gap:12px
  }

  .td-section-actions {
    align-self:flex-end
  }

.td-cat-card {
  flex:0 0 160px
}

.td-prod-card {
  flex:0 0 172px
}

  .td-prod-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px
  }

  .td-banner-grid,.td-special {
    grid-template-columns:1fr
  }

  .td-special .td-prod-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }

  .td-deal-media {
    min-height:200px;
    padding:20px
  }

  .td-checkout {
    gap:16px;
    margin-top:20px;
    grid-template-columns:1fr!important
  }

  .td-summary {
    position:static
  }

  .td-form-grid {
    grid-template-columns:1fr!important
  }

  .td-form-grid>* {
    grid-column:1/-1!important
  }

  .td-collection {
    padding:16px 0 40px
  }

  .td-collection-hero {
    flex-direction:column;
    align-items:stretch;
    margin-bottom:16px;
    padding:18px
  }

  .td-collection-hero h1 {
    font-size:25px
  }

  .td-collection-tools {
    width:100%
  }

  .td-csearch {
    flex:1
  }

  .td-csearch input {
    flex:1;
    width:auto;
    min-width:0
  }

  .td-csort {
    max-width:150px
  }

  .td-pd {
    padding:12px 0 96px
  }

  .td-pd-top {
    grid-template-columns:1fr;
    gap:16px;
    margin-bottom:16px
  }

  .td-pd-gallery {
    border-radius:var(--td-radius);
    padding:10px
  }

  .td-pd-sum h1 {
    font-size:23px
  }

  .td-pricebox strong {
    font-size:26px
  }

  .td-buyrow {
    grid-template-columns:136px 1fr;
    gap:8px
  }

  .td-buy-lg {
    grid-column:1/-1
  }

  .td-promises,.td-spec {
    grid-template-columns:1fr
  }

  .td-panel {
    padding:16px
  }

  .td-reviews {
    grid-template-columns:1fr
  }

  .td-revsum {
    position:static
  }

  .td-formgrid {
    grid-template-columns:1fr
  }

  .td-formgrid .full {
    grid-column:1/-1
  }

  .td-buybar {
    left:0;
    right:0;
    bottom:calc(var(--td-mobile-nav-h) + env(safe-area-inset-bottom));
    z-index:1029;
    border-top:1px solid var(--td-line);
    -webkit-backdrop-filter:blur(8px);
    backdrop-filter:blur(8px);
    background:#fffffffa;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:8px 12px;
    display:grid;
    position:fixed;
    box-shadow:0 -4px 16px #15283212
  }

  .td-buybar strong {
    color:var(--td-coral-text);
    font-size:16px;
    font-weight:900;
    line-height:1.1;
    display:block
  }

  .td-buybar small {
    color:var(--td-muted);
    margin-top:1px;
    font-size:11px;
    font-weight:700;
    display:block
  }

  .td-buybar .td-add-lg {
    height:44px;
    padding:0 18px;
    font-size:13px
  }

  .td-page {
    padding:14px 0 40px
  }

  .td-page-hero {
    border-radius:var(--td-radius);
    margin-bottom:14px;
    padding:20px 18px
  }

  .td-page-hero h1 {
    font-size:24px
  }

  .td-page-body {
    border-radius:var(--td-radius);
    padding:18px
  }

  .td-points {
    grid-template-columns:repeat(2,1fr);
    gap:10px;
    margin-top:14px
  }

  .td-point {
    padding:16px
  }

  .td-contact,.td-contact-form form {
    grid-template-columns:1fr
  }

  .td-contact-form .full {
    grid-column:1/-1
  }

  .td-trackbox form,.td-thanks-steps {
    grid-template-columns:1fr
  }

  .td-wa-float {
    right:14px;
    bottom:calc(var(--td-mobile-nav-h) + 78px);
    height:46px;
    padding:0 16px 0 13px;
    font-size:12.5px
  }

  .td-wa-float svg {
    flex-basis:21px;
    width:21px;
    height:21px
  }

  .td-wide-banner {
    min-height:150px;
    padding:22px
  }

  .td-wide-banner strong {
    font-size:22px
  }

  .td-info-grid {
    grid-template-columns:repeat(2,1fr)
  }

  .td-footer-grid {
    grid-template-columns:1fr 1fr;
    padding:30px 0 22px
  }

  .td-footer-brand {
    grid-column:1/-1
  }

  .td-footer-help {
    margin-top:-22px
  }

  .td-footer-help-inner {
    flex-direction:column;
    align-items:flex-start;
    padding:18px
  }

  .td-footer-bottom {
    text-align:center;
    flex-direction:column;
    gap:8px
  }

  .td-mnav {
    z-index:1030;
    height:calc(var(--td-mobile-nav-h) + env(safe-area-inset-bottom));
    padding:6px 12px calc(6px + env(safe-area-inset-bottom));
    border-top:1px solid var(--td-line);
    -webkit-backdrop-filter:blur(10px);
    backdrop-filter:blur(10px);
    box-sizing:border-box;
    background:#fffffffa;
    grid-template-columns:repeat(4,1fr);
    align-items:stretch;
    display:grid;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    box-shadow:0 -4px 18px #15283214
  }

  .td-mnav a,.td-mnav button {
    min-width:0;
    color:var(--td-navy);
    border-radius:var(--td-radius-sm);
    background:0 0;
    border:0;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:3px;
    margin:0;
    padding:4px 2px;
    font-size:10.5px;
    font-weight:800;
    line-height:1.2;
    transition:color .16s,background-color .16s;
    display:flex;
    position:relative
  }

  .td-mnav a:active,.td-mnav button:active {
    background:var(--td-soft)
  }

  .td-mnav svg {
    flex:none;
    width:21px;
    height:21px
  }

  .td-mnav span {
    text-overflow:ellipsis;
    white-space:nowrap;
    text-align:center;
    max-width:100%;
    overflow:hidden
  }

  .td-mnav .is-wa {
    color:#0f7f72
  }

  .td-mnav em {
    border-radius:var(--td-radius-pill);
    background:var(--td-brand-btn);
    color:#fff;
    box-shadow:0 2px 6px #FF43004d;
    min-width:16px;
    height:16px;
    padding:0 4px;
    font-size:9.5px;
    font-style:normal;
    font-weight:900;
    line-height:16px;
    position:absolute;
    top:0;
    right:calc(50% - 20px)
  }

  .td-mnav em[data-empty="1"] {
    display:none
  }

  .td-top-btn {
    bottom:calc(var(--td-mobile-nav-h) + 14px)
  }
}
@media (max-width:575px) {

  .td-container {
    width:min(100% - 16px,var(--td-max))
  }

  .td-mainbar-grid {
    min-height:58px
  }

  .td-logo img {
    max-width:132px;
    max-height:34px
  }

  .td-hero-main {
    min-height:300px
  }

  .td-hero-copy {
    width:100%;
    min-height:300px;
    padding:24px 18px;
    position:absolute;
    inset:auto
  }

  .td-hero-copy h1 {
    font-size:24px
  }

  .td-hero-copy p {
    font-size:13.5px
  }

  .td-hero-dots {
    bottom:16px;
    left:18px
  }

  .td-trust {
    grid-template-columns:1fr
  }

  .td-trust-item {
    border-bottom:1px solid var(--td-line-soft)!important
  }

  .td-trust-item:last-child {
    border-bottom:0!important
  }

  .td-section-head h2 {
    font-size:21px
  }

  .td-section-head p {
    font-size:13px
  }

  .td-prod-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px
  }

  .td-prod-body {
    padding:10px
  }

  .td-prod-title {
    min-height:36px;
    font-size:12.5px
  }

  .td-price strong {
    font-size:15.5px
  }

  .td-add-btn {
    min-width:56px;
    height:34px;
    padding:0 9px;
    font-size:11px
  }

  .td-info-grid {
    grid-template-columns:1fr
  }

  .td-footer-grid {
    grid-template-columns:1fr;
    gap:24px
  }

  .td-cart-line {
    grid-template-columns:62px minmax(0,1fr);
    gap:10px;
    padding:11px
  }

  .td-cart-line>img {
    width:62px;
    height:62px
  }

  .td-toast {
    top:auto;
    bottom:calc(var(--td-mobile-nav-h) + 14px);
    grid-template-columns:46px minmax(0,1fr) auto;
    right:12px
  }

  .td-toast-ico {
    width:46px;
    height:46px
  }

  .td-toast-ico svg {
    width:23px;
    height:23px
  }

  .td-toast-view {
    grid-column:1/-1;
    width:100%
  }
}
@media print {

  .td-header,.td-footer,.td-mnav,.td-top-btn,.td-toast,.td-hero-side {
    display:none!important
  }
}
@media (prefers-reduced-motion:reduce) {

  html {
    scroll-behavior:auto
  }

  *,:before,:after {
    transition-duration:.001ms!important;
    animation-duration:.001ms!important;
    animation-iteration-count:1!important
  }
}
/* Thank you / order confirmation layout */

.td-thanks-page {
  padding:26px 0 64px
}

.td-thanks {
  width:min(100% - 32px,940px);
  padding:clamp(22px,3.6vw,44px)
}

.td-thanks-hero {
  display:flex;
  flex-direction:column;
  align-items:center
}

.td-thanks-eyebrow {
  color:var(--td-success);
  letter-spacing:.14em;
  text-transform:uppercase;
  margin:0 0 8px;
  font-size:11px;
  font-weight:900;
  display:block
}

.td-thanks-ico {
  width:66px;
  height:66px;
  margin:0 auto 16px;
  position:relative
}

.td-thanks-ico:after {
  content:"";
  position:absolute;
  inset:-6px;
  border:2px solid var(--td-success);
  border-radius:50%;
  opacity:0;
  animation:tdRing 2s ease-out 3
}

.td-thanks-ico svg {
  width:30px;
  height:30px
}

.td-thanks h1 {
  font-size:clamp(23px,3.2vw,32px);
  margin:0 0 8px
}

.td-thanks p {
  max-width:56ch;
  margin:0 auto;
  font-size:14.5px;
  line-height:1.7
}

.td-thanks-meta {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:var(--td-soft);
  margin-top:24px;
  padding:16px 8px;
  gap:14px 10px;
  display:grid;
  grid-template-columns:repeat(4,1fr)
}

.td-thanks-meta-item {
  min-width:0
}

.td-thanks-meta-k {
  color:var(--td-muted);
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:4px;
  font-size:10.5px;
  font-weight:900;
  display:block
}

.td-thanks-meta-v {
  color:var(--td-ink);
  font-size:13.5px;
  font-weight:800;
  line-height:1.4;
  word-break:break-word;
  display:block
}

.td-thanks-badge {
  border-radius:var(--td-radius-pill);
  background:var(--td-success-soft);
  border:1px solid var(--td-success-line);
  color:var(--td-success);
  padding:3px 11px;
  font-size:11.5px;
  font-weight:900;
  display:inline-block
}

.td-thanks-grid {
  margin-top:18px;
  text-align:left;
  gap:16px;
  align-items:stretch;
  display:grid;
  grid-template-columns:1.55fr 1fr
}

.td-thanks-panel {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-lg);
  box-shadow:var(--td-shadow-xs);
  background:#fff;
  overflow:hidden;
  display:flex;
  flex-direction:column
}

.td-thanks-panel-h {
  border-bottom:1px solid var(--td-line-soft);
  background:var(--td-soft);
  color:var(--td-teal);
  letter-spacing:.1em;
  text-transform:uppercase;
  margin:0;
  padding:12px 16px;
  font-size:11px;
  font-weight:900
}

.td-thanks-items {
  list-style:none;
  margin:0;
  padding:2px 16px
}

.td-thanks-item {
  border-bottom:1px solid var(--td-line-soft);
  align-items:center;
  gap:12px;
  padding:13px 0;
  display:flex
}

.td-thanks-item:last-child {
  border-bottom:0
}

.td-thanks-item-main {
  min-width:0;
  flex:1
}

.td-thanks-item-name {
  color:var(--td-ink);
  font-size:14px;
  font-weight:800;
  line-height:1.45;
  display:block
}

.td-thanks-item-meta {
  color:var(--td-muted);
  margin-top:3px;
  font-size:12px;
  display:block
}

.td-thanks-item-qnt {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius-pill);
  color:var(--td-ink);
  padding:3px 10px;
  font-size:11.5px;
  font-weight:800;
  white-space:nowrap;
  flex:none
}

.td-thanks-item-line {
  color:var(--td-coral);
  font-size:14.5px;
  font-weight:900;
  white-space:nowrap;
  flex:none
}

.td-thanks-totals {
  border-top:1px solid var(--td-line);
  background:var(--td-soft);
  margin:auto 0 0;
  padding:12px 16px
}

.td-thanks-totals>div {
  align-items:baseline;
  gap:12px;
  padding:5px 0;
  display:flex
}

.td-thanks-totals dt {
  color:var(--td-muted);
  font-size:13px;
  font-weight:700
}

.td-thanks-totals dd {
  color:var(--td-ink);
  margin-left:auto;
  font-size:13.5px;
  font-weight:800
}

.td-thanks-totals .is-total {
  border-top:1px solid var(--td-line);
  margin-top:5px;
  padding-top:10px
}

.td-thanks-totals .is-total dt {
  color:var(--td-ink);
  font-size:14px;
  font-weight:900
}

.td-thanks-totals .is-total dd {
  color:var(--td-coral);
  font-size:21px;
  font-weight:900;
  letter-spacing:-.02em
}

.td-thanks-dl {
  margin:0;
  padding:14px 16px
}

.td-thanks-dl>div {
  border-bottom:1px dashed var(--td-line);
  padding:9px 0;
  display:flex;
  gap:12px
}

.td-thanks-dl>div:last-child {
  border-bottom:0;
  padding-bottom:0
}

.td-thanks-dl dt {
  color:var(--td-muted);
  font-size:12.5px;
  font-weight:800;
  width:80px;
  flex:none
}

.td-thanks-dl dd {
  color:var(--td-ink);
  margin:0;
  font-size:13.5px;
  font-weight:700;
  line-height:1.5;
  min-width:0;
  word-break:break-word
}

.td-thanks .td-thanks-note {
  border-left:3px solid var(--td-coral);
  border-radius:var(--td-radius-sm);
  background:var(--td-soft);
  color:var(--td-body);
  margin:auto 16px 16px;
  padding:10px 12px;
  font-size:13px;
  line-height:1.6;
  text-align:left;
  max-width:none
}

.td-thanks-actions {
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin:26px 0 0;
  display:flex
}

.td-thanks-actions .td-btn {
  height:46px;
  padding:0 22px
}

.td-thanks-steps {
  margin-top:30px;
  gap:14px;
  text-align:left;
  display:grid;
  grid-template-columns:repeat(3,1fr)
}

.td-thanks-step {
  border:1px solid var(--td-line);
  border-radius:var(--td-radius);
  background:#fff;
  padding:18px 16px
}

.td-thanks-step-n {
  border-radius:50%;
  background:var(--td-teal);
  color:#fff;
  width:30px;
  height:30px;
  margin-bottom:10px;
  font-size:13px;
  font-weight:900;
  display:grid;
  place-items:center
}

.td-thanks-step strong {
  font-size:13.5px;
  line-height:1.4;
  display:block
}

.td-thanks-step p {
  margin:5px 0 0;
  font-size:12.5px;
  line-height:1.6
}

.td-thanks .td-thanks-help {
  border-radius:var(--td-radius);
  background:var(--td-soft);
  color:var(--td-muted);
  margin:16px 0 0;
  padding:12px 16px;
  font-size:12.5px;
  line-height:1.65;
  max-width:none
}

.td-thanks-help b {
  color:var(--td-ink);
  font-weight:900
}
@keyframes tdRing {

  0% {
    opacity:.5;
    transform:scale(.86)
  }

  100% {
    opacity:0;
    transform:scale(1.55)
  }
}
@media (max-width:1023px) {

  .td-thanks-grid {
    grid-template-columns:1fr
  }
}
@media (max-width:900px) {

  .td-thanks-meta {
    grid-template-columns:repeat(2,1fr)
  }
}
@media (max-width:700px) {

  .td-thanks-steps {
    grid-template-columns:1fr
  }
}
@media (max-width:575px) {

  .td-thanks {
    width:min(100% - 20px,940px);
    padding:22px 16px 26px;
    border-radius:var(--td-radius)
  }

  .td-thanks-meta {
    margin-top:20px;
    padding:14px 6px;
    gap:12px 8px
  }

  .td-thanks-actions {
    gap:8px
  }

  .td-thanks-actions .td-btn {
    width:100%;
    height:46px;
    padding:0 14px
  }

  .td-thanks-item-line {
    font-size:13.5px
  }

  .td-thanks-item-qnt {
    padding:3px 8px
  }
}
@media print {

  .td-thanks-ico:after {
    display:none
  }

  .td-thanks-actions,.td-thanks-steps,.td-thanks-help {
    display:none
  }
}