/* lane_shoppages v1 (2026-10-20): shop index + specialty pages. Builds on assets/brand/store-v1.css tokens
   (--dt-blue #1354ff, --dt-navy #00369a, --dt-ink #08183f, --dt-paper #f5f8ff) and the dibateb.net band language
   (eyebrow with a 28px rule, 16px cards, 10px controls, 999px pills). Mobile first, tap targets >= 44px. */

/* ---------- hero (replaces the Woodmart page title on these pages only) ---------- */
.dtt-hero{background:var(--dt-paper,#f5f8ff);border-bottom:1px solid #e6ecf8;padding:22px 0 24px;margin-bottom:22px;overflow:hidden}
.dtt-hero__in{display:grid;grid-template-columns:minmax(0,1fr) 112px;align-items:center;gap:16px}
.dtt-hero--shop .dtt-hero__in{grid-template-columns:minmax(0,1fr)}
.dtt-hero__copy{min-width:0}
.dtt-eyebrow{display:inline-flex;align-items:center;gap:10px;margin:0 0 8px;color:var(--dt-blue,#1354ff);font-weight:800;font-size:14px;line-height:1.6}
.dtt-eyebrow:before{content:"";width:28px;height:2px;background:currentColor;flex:none}
.dtt-eyebrow a{color:inherit;display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;margin-block:-12px}
.dtt-eyebrow a:hover{color:var(--dt-blue-d,#0744e6);text-decoration:underline;text-underline-offset:4px}
.dtt-hero__title{margin:0;font-size:clamp(26px,4.2vw,48px);font-weight:800;line-height:1.35;color:var(--dt-ink,#08183f);text-wrap:balance}
.dtt-hero__text{margin:10px 0 0;max-width:640px;font-size:clamp(15px,1.3vw,18px);line-height:1.95;color:#3f527a;font-weight:500}
.dtt-hero__meta{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0 0}
.dtt-hero__meta:empty{display:none}
.dtt-pill{display:inline-flex;align-items:center;min-height:32px;padding:2px 14px;border-radius:999px;background:#fff;border:1px solid #d5e1fb;
  color:#244696;font-weight:800;font-size:14px;line-height:1.6}
.dtt-pill.is-soon{background:var(--dt-blue,#1354ff);border-color:var(--dt-blue,#1354ff);color:#fff}
.dtt-hero__art{align-self:start;min-width:0}
.dtt-hero__art img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:14px;background:#0b1d4d;
  box-shadow:0 2px 6px #0b2a6614,0 14px 34px #0b2a661f}
.dtt-collage{display:none}
@media(min-width:769px){
  .dtt-hero{padding:44px 0 46px;margin-bottom:30px}
  .dtt-hero__in{grid-template-columns:minmax(0,1fr) minmax(0,400px);gap:40px}
  .dtt-hero__art{align-self:center}
  .dtt-hero--shop .dtt-hero__in{grid-template-columns:minmax(0,1fr) minmax(0,420px)}
  .dtt-collage{display:block;position:relative;height:230px}
  .dtt-collage__i{position:absolute;top:50%;width:52%}
  .dtt-collage__i img{border:3px solid #fff}
  .dtt-collage__i1{right:0;transform:translateY(-50%) rotate(3deg);z-index:3}
  .dtt-collage__i2{right:26%;transform:translateY(-58%) rotate(-4deg);z-index:2}
  .dtt-collage__i3{right:48%;transform:translateY(-42%) rotate(2deg);z-index:1}
}

/* ---------- section heads ---------- */
.dtt-sec-head{margin:0 0 16px}
.dtt-sec-title{margin:0 0 16px;font-size:clamp(21px,2.3vw,30px);font-weight:800;line-height:1.45;color:var(--dt-ink,#08183f)}
.dtt-sec-head .dtt-sec-title{margin:0}
.dtt-sec-title--grid{margin-top:8px}

/* ---------- specialty grid (shop index) ---------- */
.dtt-specs{margin:0 0 clamp(34px,4vw,56px)}
.dtt-spec-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:10px}
.dtt-spec{grid-column:span 4;min-width:0;margin:0}
.dtt-spec.is-open{grid-column:span 12}
.dtt-spec__link{display:flex;flex-direction:column;height:100%;background:#fff;border:1px solid #dfe7f6;border-radius:14px;overflow:hidden;color:inherit;
  box-shadow:0 2px 6px #0b2a6608,0 10px 26px #0b2a660d;transition:transform .2s,box-shadow .2s,border-color .2s}
a.dtt-spec__link:hover{transform:translateY(-3px);border-color:#b9ccf7;box-shadow:0 4px 10px #0b2a660d,0 18px 38px #0b2a6614;color:inherit}
a.dtt-spec__link:focus-visible{outline:3px solid var(--dt-blue,#1354ff);outline-offset:3px}
.dtt-spec__art{position:relative;display:block;aspect-ratio:4/3;background:#0b1d4d;overflow:hidden}
.dtt-spec__art img{display:block;width:100%;height:100%;object-fit:cover}
.dtt-spec__body{display:flex;flex-direction:column;gap:4px;padding:8px 10px 10px;min-width:0;flex:1}
.dtt-spec__name{font-size:14px;font-weight:800;line-height:1.6;color:var(--dt-ink,#08183f)}
.dtt-spec__desc{font-size:14px;line-height:1.85;color:#43587f;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dtt-spec__meta{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:2px 12px}
.dtt-spec__meta b{font-size:15px;font-weight:800;color:var(--dt-blue,#1354ff)}
.dtt-spec__meta small{font-size:12px;font-weight:700;color:#5f7299}
.dtt-spec__go{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:15px;font-weight:800;color:var(--dt-blue,#1354ff)}
.dtt-spec__go svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.dtt-ribbon{position:absolute;top:8px;right:8px;padding:0 9px;border-radius:999px;background:#fffffff2;color:var(--dt-ink,#08183f);
  font-size:12px;font-weight:800;line-height:22px;box-shadow:0 2px 8px #0b2a6633}
.dtt-spec.is-open .dtt-spec__link{flex-direction:row}
.dtt-spec.is-open .dtt-spec__art{flex:0 0 42%;aspect-ratio:auto;min-height:150px}
.dtt-spec.is-open .dtt-spec__body{padding:12px 14px 6px;gap:6px}
.dtt-spec.is-open .dtt-spec__name{font-size:20px;line-height:1.5}
.dtt-spec.is-empty .dtt-spec__link{box-shadow:none;background:#fbfcff}
@media(min-width:600px){
  .dtt-spec-grid{gap:14px}
  .dtt-spec{grid-column:span 3}
  .dtt-spec.is-open{grid-column:span 6}
  .dtt-spec__name{font-size:15px}
}
@media(min-width:1025px){
  .dtt-spec{grid-column:span 2}
  .dtt-spec.is-open .dtt-spec__art{min-height:190px}
  .dtt-spec.is-open .dtt-spec__body{padding:18px 20px 10px}
  .dtt-spec.is-open .dtt-spec__name{font-size:26px}
}

/* ---------- type tabs (specialty pages) ---------- */
.dtt-types{margin:0 0 20px;min-width:0}
.dtt-types__in{display:flex;flex-wrap:wrap;gap:6px;padding:6px;background:#e9f0fd;border-radius:12px;width:fit-content;max-width:100%}
.dtt-type{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:8px 16px;border-radius:10px;color:#3b527f;font-size:15px;font-weight:800;
  line-height:1.4;white-space:nowrap;transition:background .18s,color .18s,box-shadow .18s}
.dtt-type small{display:inline-grid;place-items:center;min-width:24px;height:22px;padding:0 7px;border-radius:999px;background:#ffffffb3;color:#4a5c85;
  font-size:12px;font-weight:800}
.dtt-type:hover{color:var(--dt-blue,#1354ff)}
.dtt-type.is-active{background:#fff;color:var(--dt-blue,#1354ff);box-shadow:0 2px 8px #0b2a6614}
.dtt-type.is-active small{background:#eef3ff;color:var(--dt-blue,#1354ff)}
.dtt-type:focus-visible{outline:2px solid var(--dt-blue,#1354ff);outline-offset:-2px}
@media(max-width:768px){
  .dtt-types__in{flex-wrap:nowrap;width:auto;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;scroll-snap-type:x proximity}
  .dtt-types__in::-webkit-scrollbar{display:none}
  .dtt-type{flex:none;scroll-snap-align:start;padding:8px 13px;font-size:14px}
}

/* ---------- packages band + soon note ---------- */
.dtt-packs{margin:0 0 30px;padding:16px 12px 6px;background:var(--dt-paper,#f5f8ff);border:1px solid #dfe7f6;border-radius:18px;min-width:0}
.dtt-packs .dtt-sec-title{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.dtt-packs .dtt-sec-title:before{content:"";width:28px;height:2px;background:var(--dt-blue,#1354ff);flex:none}
@media(min-width:769px){.dtt-packs{padding:24px 24px 10px}}
.dtt-soon-note{margin:0 0 18px;padding:12px 16px;border-radius:12px;background:#eef3ff;border:1px solid #d5e1fb;color:#244696;font-size:15px;font-weight:700;line-height:1.9}

/* ---------- coming-soon products in the Woodmart grid ---------- */
.dtt-soon-price{display:inline-block;padding:1px 12px;border-radius:999px;background:#eef3ff;border:1px solid #d5e1fb;color:#244696;font-size:13px;font-weight:800;line-height:1.8}
/* the dedicated covers carry their own type tags in the top-right corner: sale labels move to the free top-left corner */
.dtt-sp-index .product-labels,.dtt-sp-spec .product-labels{inset-inline-start:auto;inset-inline-end:7px;align-items:flex-end}

/* ---------- store menu: specialties dropdown ---------- */
.wd-nav .dtt-menu-all>a{font-weight:800;color:var(--dt-blue,#1354ff)!important}