/* Animal hubs and buyer pages: additions from astra's hub review (23 Sep 2026).
   Loaded with template-entity.php and template-vertical.php. */

/* Jump links under the hero */
.tt-ejump{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:18px;font-size:1rem;}
.tt-ejump a{color:#23342a;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center;}

/* Filters */
.tt-efilter{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 20px;}
.tt-efilter .tt-chip{display:inline-flex;align-items:center;height:48px;padding:0 16px !important;border:1px solid #d8d5cc !important;border-radius:22px;
  background:#fff !important;color:#1f2a22 !important;font:inherit;font-size:.95rem;cursor:pointer;min-width:0 !important;}
.tt-efilter .tt-chip span{margin-left:6px;font-size:.9rem;color:#5d655c;}
.tt-efilter .tt-chip.is-on{background:#23342a !important;border-color:#23342a !important;color:#fff !important;}
.tt-efilter .tt-chip.is-on span{color:#cfd6cb;}
.tt-efilter .tt-chip--fin{border-style:dashed !important;}
.tt-efilter .tt-chip--fin.is-on{border-style:solid !important;}

/* The pieces, as the shop's own cards */
.tt-ehub__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;}
.tt-ehub__grid.is-few{grid-template-columns:repeat(2,minmax(0,340px));}
.tt-ehub__cell > .tt-pcard{height:100%;}
.tt-ehub__cell.is-more{display:none;}
.tt-ehub__grid.is-all .tt-ehub__cell.is-more,
.tt-ehub__grid.is-filtered .tt-ehub__cell.is-more{display:block;}
.tt-ehub__cell[hidden]{display:none !important;}
.tt-ehub__more{margin:24px 0 0;text-align:center;}
@media (max-width:1100px){ .tt-ehub__grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:767px){
  .tt-ehub__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
  .tt-ehub__grid.is-few{grid-template-columns:1fr;max-width:380px;}
}

/* Finish cards act as filters */
.tt-ematrix__cell{cursor:pointer;}

/* Delivery, timing and terms */
.tt-edeliver{padding:56px 0;background:#f6f4ee;}
.tt-edeliver__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;}
.tt-edeliver h3{font-size:1.15rem;margin:0 0 8px;}
.tt-edeliver p{font-size:1.02rem;line-height:1.6;margin:0;color:#2e3a31;}
@media (max-width:767px){ .tt-edeliver{padding:40px 0;} .tt-edeliver__grid{grid-template-columns:1fr;gap:22px;} }

/* Custom ideas: two first on phones, the rest on request */
.tt-eideas__more{display:none;margin:20px 0 0;text-align:center;}
@media (max-width:767px){
  .tt-eideas__card.is-more{display:none;}
  .tt-eideas.is-all .tt-eideas__card.is-more{display:block;}
  .tt-eideas__more{display:block;}
}

/* Companion (the heart: a matching monogram letter) */
.tt-ecomp{padding:48px 0;}
.tt-ecomp__inner{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:28px;align-items:center;
  padding:28px;border:1px solid #e3dfd4;border-radius:12px;background:#fff;}
.tt-ecomp h2{font-size:1.5rem;margin:0 0 8px;}
.tt-ecomp p{margin:0;font-size:1.02rem;line-height:1.6;}
.tt-ecomp__cta{display:flex;flex-wrap:wrap;gap:12px;justify-content:flex-end;}
@media (max-width:767px){ .tt-ecomp__inner{grid-template-columns:1fr;padding:22px;} .tt-ecomp__cta{justify-content:flex-start;} }

/* Phone readability: section heads stack, and small gold text is darkened to 4.5:1 or better */
@media (max-width:767px){
  .tt-vertical .tt-sec-head,
  .tt-vertical .tt-sec-head--split{display:block !important;}
  .tt-vertical .tt-sec-head > *{max-width:none !important;width:auto !important;}
}
.tt-vertical .tt-eyebrow,
.tt-vertical .tt-vpath__count,
.tt-vertical a.tt-link-gold{color:#7a5a24 !important;}

/* Buyer pages on phones: the build photos swipe in one row, and the two illustrations that
   repeat the build story (stand drawings, scale drawing) stay on larger screens. About
   2,400px shorter on a phone. */
@media (max-width:767px){
  .tt-vseq__grid{display:flex !important;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:6px;grid-template-columns:none !important;}
  .tt-vseq__grid > li{flex:0 0 82%;scroll-snap-align:start;}
  .tt-vdraw,.tt-vscale{display:none;}
}
/* ...except on the dark engineering band, where the light gold is the readable one. */
.tt-vertical .tt-vbuild .tt-eyebrow{color:#e4d3ab !important;}
.tt-vertical .tt-vpiece__meta span{color:#7a5a24 !important;}
.tt-vstory__note{margin:10px 0 0;font-size:.85rem;color:#5d655c;}

@media (max-width:767px){ .tt-efilter .tt-chip{height:48px;font-size:1rem;} }
.tt-ecomp__near{margin:-6px 0 18px;font-size:1rem;color:#3c443e;}
.tt-ecomp__near a,.tt-ecomp__near .tt-q-link{color:#1f2a22;font-weight:600;text-decoration:underline;text-underline-offset:3px;background:none;border:0;padding:0;font:inherit;font-weight:600;cursor:pointer;}
