/* YachtByte homepage: direct routes into the technical libraries. */
.theme-quiet-luxury.template-homepage {
  --qtl-page-inset: max(var(--yb-gutter), calc((100cqw - var(--yb-content)) / 2));
  container-type: inline-size;
  background: var(--yb-ink);
}
.template-homepage .qtl-light { color: var(--yb-ink); background: var(--yb-ivory); }
.template-homepage .qtl-kicker {
  margin: 0 0 16px; color: var(--yb-cyan-bright); font-size: 12px;
  font-weight: 750; letter-spacing: .14em; line-height: 1.5; text-transform: uppercase;
}
.template-homepage .qtl-kicker--dark { color: #416a73; }
.template-homepage .qtl-text-link {
  display: inline-flex; align-items: center; gap: 14px; min-height: 44px;
  color: var(--yb-ink); font-size: 12px; font-weight: 700; line-height: 1.5;
  text-decoration: none;
}
.template-homepage .qtl-text-link::after { content: "\2192"; font-size: 18px; }
.template-homepage .qtl-text-link--light { color: var(--yb-ivory); }
.template-homepage .qtl-text-link:hover { text-decoration: underline; text-underline-offset: 4px; }
.template-homepage #technical-domains { scroll-margin-top: 110px; }

/* Keep the yacht imagery, with content determining the hero height. */
.template-homepage .qtl-hero {
  position: relative; display: grid; grid-template-columns: 53% minmax(0, 1fr);
  min-height: 620px; color: var(--yb-ivory); background: var(--yb-ink);
}
.template-homepage .qtl-hero__copy {
  position: relative; z-index: 2; min-width: 0; align-self: center;
  padding: 132px clamp(30px, 4vw, 64px) 52px var(--qtl-page-inset);
}
.template-homepage .qtl-hero h1 {
  max-width: 740px; margin: 0; color: var(--yb-ivory); font-family: var(--yb-display);
  font-size: clamp(48px, 4.5vw, 72px); font-weight: 400; letter-spacing: -.045em; line-height: 1.02;
}
.template-homepage .qtl-hero__lede {
  max-width: 640px; margin: 22px 0 0; color: #bbc9ce;
  font-size: clamp(16px, 1.25vw, 19px); line-height: 1.6;
}
.template-homepage .qtl-home-search {
  margin-top: 26px; display: grid; grid-template-columns: minmax(0, 1fr) auto;
  border: 1px solid rgba(242, 239, 232, .4); background: rgba(255, 255, 255, .06);
}
.theme-quiet-luxury.template-homepage .qtl-home-search input[type="search"] {
  width: 100%; min-width: 0; min-height: 60px; padding: 16px 18px; border: 0;
  border-radius: 0; color: var(--yb-ivory); background: transparent; font: inherit; font-size: 16px;
}
.theme-quiet-luxury.template-homepage .qtl-home-search input[type="search"]::placeholder { color: #bbc9ce; }
.theme-quiet-luxury.template-homepage .qtl-home-search input[type="search"]:focus-visible { outline: 2px solid var(--yb-cyan-bright); outline-offset: -3px; }
.theme-quiet-luxury.template-homepage .qtl-home-search .button {
  min-width: 120px; min-height: 60px; justify-content: center; border: 0;
  color: var(--yb-ink); background: var(--yb-champagne-soft); font-size: 12px;
}
.theme-quiet-luxury.template-homepage .qtl-home-search .button:hover { background: var(--yb-ivory); }
.template-homepage .qtl-hero__access { max-width: 600px; margin: 16px 0 0; color: #bbc9ce; font-size: 13px; line-height: 1.6; }
.template-homepage .qtl-hero__visual { position: relative; min-width: 0; overflow: hidden; }
.template-homepage .qtl-hero__visual > img {
  position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover;
  object-position: 52% center; filter: saturate(.82) contrast(1.05) brightness(.8);
}
.template-homepage .qtl-hero__visual-shade {
  position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(90deg, rgba(7,16,22,.5), transparent 24%), linear-gradient(180deg, rgba(7,16,22,.2), transparent 38%);
}

/* Three destinations, with the full domain list available on demand. */
.template-homepage .qtl-start { padding: 0 var(--qtl-page-inset) 32px; background: var(--yb-ink-soft); color: var(--yb-ivory); border-top: 1px solid var(--yb-line-dark); }
.template-homepage .qtl-destinations { max-width: var(--yb-content); margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.template-homepage .qtl-destination {
  min-width: 0; padding: 28px 30px; display: flex; flex-direction: column; gap: 8px;
  color: #bbc9ce; border-bottom: 1px solid var(--yb-line-dark); text-decoration: none; font-size: 14px; line-height: 1.5;
}
.template-homepage .qtl-destination + .qtl-destination { border-left: 1px solid var(--yb-line-dark); }
.template-homepage .qtl-destination__heading {
  display: flex; justify-content: space-between; gap: 20px; color: var(--yb-ivory);
  font-family: var(--yb-display); font-size: clamp(27px, 2.1vw, 34px); letter-spacing: -.025em; line-height: 1.15;
}
.template-homepage .qtl-destination__heading > span { color: var(--yb-cyan-bright); font: 22px var(--yb-sans); }
.template-homepage .qtl-destination .qtl-destination__access { margin-top: 3px; color: var(--yb-cyan-bright); font-size: 12px; }
.template-homepage .qtl-destination:hover, .template-homepage .qtl-domain-card:hover { background: rgba(105,198,220,.06); }
.template-homepage .qtl-domain-directory { max-width: var(--yb-content); margin: 22px auto 0; border: 1px solid var(--yb-line-dark); }
.template-homepage .qtl-domain-directory > summary {
  padding: 15px 20px; cursor: pointer; color: var(--yb-ivory); font-size: 14px; line-height: 1.6;
}
.template-homepage .qtl-domain-directory > summary > span { margin-left: 16px; color: #bbc9ce; font-size: 12px; white-space: nowrap; }
.template-homepage .qtl-domain-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0 20px 16px; gap: 0 32px; }
.template-homepage .qtl-domain-card { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 13px 0; border-top: 1px solid var(--yb-line-dark); color: var(--yb-ivory); text-decoration: none; font-size: 14px; line-height: 1.4; }
.template-homepage .qtl-domain-card__count { flex-shrink: 0; color: #bbc9ce; font-size: 12px; }

/* Shared publication sections. */
.template-homepage .qtl-guides, .template-homepage .qtl-intelligence, .template-homepage .qtl-resources { padding: clamp(44px, 4vw, 64px) var(--qtl-page-inset); }
.template-homepage .qtl-intelligence { color: var(--yb-ivory); background: var(--yb-ink); }
.template-homepage .qtl-section-head { max-width: var(--yb-content); margin: 0 auto 30px; display: flex; justify-content: space-between; gap: 28px; align-items: end; }
.template-homepage .qtl-section-head > div { min-width: 0; }
.template-homepage .qtl-section-head h2 {
  max-width: 850px; margin: 0; font-family: var(--yb-display); font-size: clamp(36px, 3.3vw, 52px);
  font-weight: 400; letter-spacing: -.035em; line-height: 1.08;
}
.template-homepage .qtl-section-head__support { max-width: 670px; margin: 16px 0 0; color: #bbc9ce; font-size: 15px; line-height: 1.6; }
.template-homepage .qtl-section-head--light .qtl-section-head__support { color: #53656c; }
.template-homepage .qtl-section-head > .qtl-text-link { flex-shrink: 0; }
.template-homepage .qtl-guide-grid, .template-homepage .qtl-intelligence-grid, .template-homepage .qtl-resource-grid { max-width: var(--yb-content); margin: 0 auto; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.template-homepage .qtl-guide-card, .template-homepage .qtl-resource-card { min-width: 0; border: 1px solid var(--yb-line-light); }
.template-homepage .qtl-intelligence-card { min-width: 0; border: 1px solid var(--yb-line-dark); background: rgba(255,255,255,.018); }
.template-homepage .qtl-guide-card__link, .template-homepage .qtl-intelligence-card__link { height: 100%; display: flex; flex-direction: column; color: inherit; text-decoration: none; }
.template-homepage .qtl-guide-card__visual, .template-homepage .qtl-intelligence-card__visual { aspect-ratio: 16 / 9; overflow: hidden; background: var(--yb-ink-raised); }
.template-homepage .qtl-guide-card__visual > img, .template-homepage .qtl-intelligence-card__visual > img { display: block; width: 100%; height: 100%; object-fit: contain; }
.template-homepage .qtl-card-placeholder {
  height: 100%; display: flex; align-items: center; justify-content: center; gap: 16px; padding: 20px; color: var(--yb-cyan-bright);
  background: linear-gradient(rgba(157,230,241,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(157,230,241,.04) 1px, transparent 1px), linear-gradient(135deg, #173542, #0a1820 80%); background-size: 36px 36px, 36px 36px, auto;
}
.template-homepage .qtl-card-placeholder > svg { width: 54px; height: 54px; flex-shrink: 0; }
.template-homepage .qtl-card-placeholder > span { font-size: 15px; letter-spacing: .04em; line-height: 1.5; }
.template-homepage .qtl-card-placeholder > span > span { display: block; margin-top: 2px; color: #bbc9ce; font-size: 12px; letter-spacing: 0; }
.template-homepage .qtl-guide-card__body, .template-homepage .qtl-intelligence-card__body { padding: 24px; display: flex; flex: 1; flex-direction: column; }
.template-homepage .qtl-card-label { margin: 0 0 14px; color: #416a73; font-size: 12px; font-weight: 700; letter-spacing: .04em; line-height: 1.5; }
.template-homepage .qtl-guide-card h3, .template-homepage .qtl-intelligence-card h3, .template-homepage .qtl-resource-card h3 {
  margin: 0; font-family: var(--yb-display); font-size: clamp(26px, 2vw, 32px); font-weight: 400; letter-spacing: -.025em; line-height: 1.12;
}
.template-homepage .qtl-card-summary, .template-homepage .qtl-resource-card p {
  margin: 16px 0 0; color: #53656c; font-size: 14px; line-height: 1.65;
  display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 3;
}
.template-homepage .qtl-card-meta { margin: auto 0 0; padding-top: 22px; display: flex; gap: 6px 16px; flex-wrap: wrap; color: #53656c; font-size: 12px; line-height: 1.5; }
.template-homepage .qtl-card-action { margin-top: 18px; padding-top: 14px; display: flex; justify-content: space-between; gap: 16px; border-top: 1px solid var(--yb-line-light); font-size: 12px; font-weight: 700; line-height: 1.5; }
.template-homepage .qtl-intelligence-card .qtl-card-label { color: var(--yb-cyan-bright); }
.template-homepage .qtl-intelligence-card .qtl-card-summary, .template-homepage .qtl-intelligence-card .qtl-card-meta { color: #bbc9ce; }
.template-homepage .qtl-intelligence-card .qtl-card-action { border-top-color: var(--yb-line-dark); }
.template-homepage .qtl-guide-card__link:hover, .template-homepage .qtl-resource-card > a:hover { background: rgba(255,255,255,.4); }
.template-homepage .qtl-intelligence-card__link:hover { background: rgba(105,198,220,.04); }
.template-homepage .qtl-guide-card__link:focus-visible, .template-homepage .qtl-intelligence-card__link:focus-visible, .template-homepage .qtl-resource-card > a:focus-visible, .template-homepage .qtl-destination:focus-visible, .template-homepage .qtl-domain-card:focus-visible, .template-homepage .qtl-domain-directory > summary:focus-visible { outline: 2px solid #438495; outline-offset: -3px; }
.template-homepage .qtl-resource-card > a { height: 100%; padding: 24px; display: flex; flex-direction: column; color: var(--yb-ink); text-decoration: none; }
.template-homepage .qtl-resource-card__topline { margin-bottom: 18px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 16px; color: #416a73; font-size: 12px; line-height: 1.5; }
.template-homepage .qtl-resource-card p { margin-bottom: 22px; }
.template-homepage .qtl-resource-card .qtl-card-action { margin-top: auto; }
.template-homepage .qtl-empty { max-width: var(--yb-content); margin: 0 auto; padding: 28px; border: 1px solid var(--yb-line-light); color: #53656c; }
.template-homepage .qtl-empty--dark { border-color: var(--yb-line-dark); color: #bbc9ce; }

/* Relevant next steps for visitors and members. */
.template-homepage .qtl-membership { padding: clamp(44px, 4vw, 64px) var(--qtl-page-inset); display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 44px; align-items: center; color: var(--yb-ivory); background: var(--yb-ink-soft); border-top: 1px solid var(--yb-line-dark); }
.template-homepage .qtl-membership__copy { min-width: 0; }
.template-homepage .qtl-membership__copy h2 { max-width: 800px; margin: 0; font-family: var(--yb-display); font-size: clamp(36px, 3.3vw, 52px); font-weight: 400; letter-spacing: -.035em; line-height: 1.08; }
.template-homepage .qtl-membership__copy > p:not(.qtl-kicker) { max-width: 640px; margin: 18px 0 0; color: #bbc9ce; font-size: 16px; line-height: 1.6; }
.template-homepage .qtl-membership__copy > span { display: block; margin-top: 14px; color: #bbc9ce; font-size: 13px; line-height: 1.6; }
.template-homepage .qtl-membership__action { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.theme-quiet-luxury.template-homepage .qtl-membership__action .button { font-size: 12px; }
.template-homepage .qtl-credibility { padding: 0 var(--qtl-page-inset); background: var(--yb-ink-soft); border-top: 1px solid var(--yb-line-dark); }
.template-homepage .qtl-credibility__inner { max-width: var(--yb-content); min-height: 72px; margin: 0 auto; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; }
.template-homepage .qtl-credibility span { padding: 14px 20px; color: #bbc9ce; font-size: 12px; line-height: 1.5; text-align: center; }
.template-homepage .qtl-credibility span + span { border-left: 1px solid var(--yb-line-dark); }

@media (max-width: 1100px) {
  .template-homepage .qtl-section-head { align-items: start; flex-direction: column; gap: 16px; }
  .template-homepage .qtl-destination { padding: 24px 20px; }
}
@media (max-width: 900px) {
  .template-homepage .qtl-hero { display: block; min-height: 0; }
  .template-homepage .qtl-hero__copy { padding: 116px var(--qtl-page-inset) 44px; max-width: 740px; }
  .template-homepage .qtl-hero__visual { position: absolute; inset: 0; }
  .template-homepage .qtl-hero__visual > img { object-position: center 58%; }
  .template-homepage .qtl-hero__visual-shade { background: linear-gradient(90deg, rgba(7,16,22,.98), rgba(7,16,22,.82) 58%, rgba(7,16,22,.55)); }
  .template-homepage .qtl-guide-grid, .template-homepage .qtl-intelligence-grid, .template-homepage .qtl-resource-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .template-homepage .qtl-membership { grid-template-columns: minmax(0, 1fr); gap: 26px; }
  .template-homepage .qtl-credibility__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .template-homepage .qtl-credibility span:nth-child(3) { border-left: 0; }
}
@media (max-width: 620px) {
  .template-homepage .qtl-hero__copy { padding: 104px var(--yb-gutter) 32px; }
  .template-homepage .qtl-hero .qtl-kicker { font-size: 11px; letter-spacing: .1em; }
  .template-homepage .qtl-hero h1 { font-size: clamp(38px, 11.2vw, 56px); line-height: 1.04; }
  .template-homepage .qtl-hero__lede { margin-top: 18px; font-size: 15px; }
  .template-homepage .qtl-hero__access { font-size: 12px; }
  .theme-quiet-luxury.template-homepage .qtl-home-search input[type="search"] { min-height: 56px; padding: 14px 12px; }
  .theme-quiet-luxury.template-homepage .qtl-home-search .button { min-width: 84px; min-height: 56px; padding: 14px 12px; }
  .theme-quiet-luxury.template-homepage .qtl-home-search .button::after { display: none; }
  .template-homepage .qtl-destinations { grid-template-columns: minmax(0, 1fr); }
  .template-homepage .qtl-destination { padding: 18px 4px; gap: 5px; }
  .template-homepage .qtl-destination + .qtl-destination { border-left: 0; }
  .template-homepage .qtl-destination__heading { font-size: 27px; }
  .template-homepage .qtl-domain-directory > summary { padding: 14px 12px; font-size: 13px; }
  .template-homepage .qtl-domain-directory > summary > span { margin-left: 6px; }
  .template-homepage .qtl-domain-grid { grid-template-columns: minmax(0, 1fr); padding: 0 12px 12px; }
  .template-homepage .qtl-domain-card { gap: 12px; }
  .template-homepage .qtl-guide-grid, .template-homepage .qtl-intelligence-grid, .template-homepage .qtl-resource-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
  .template-homepage .qtl-section-head { margin-bottom: 24px; }
  .template-homepage .qtl-section-head h2, .template-homepage .qtl-membership__copy h2 { font-size: 36px; }
  .template-homepage .qtl-guide-card__body, .template-homepage .qtl-intelligence-card__body, .template-homepage .qtl-resource-card > a { padding: 22px; }
  .template-homepage .qtl-guide-card h3, .template-homepage .qtl-intelligence-card h3, .template-homepage .qtl-resource-card h3 { font-size: 28px; }
  .template-homepage .qtl-credibility span { padding: 14px 10px; }
}
