/* What QHHT means — night sky. The definition opens the section, the four letters glow
   one at a time, and Dolores Cannon's lineage closes it in the same reading column.
   Gems: Q amethyst, H emerald, H sapphire, T tanzanite. */
.qhht-letters{padding:clamp(64px,9vw,128px) 0;color:var(--white);
  background:radial-gradient(120% 90% at 20% 0%,#5a2a82 0%,transparent 55%),linear-gradient(160deg,var(--amethyst-deep) 0%,#25174a 50%,var(--sapphire) 100%)}
.qhht-letters h2{color:var(--white)}
[data-gem=q]{--gem-light:#cfadf0}
[data-gem=h1]{--gem-light:#86d9bb}
[data-gem=h2]{--gem-light:#9cc3f5}
[data-gem=t]{--gem-light:#b6b3ff}

/* Heading on the left; the full definition, then Dolores Cannon's lineage, read together on the right */
.ql-head{display:grid;grid-template-columns:5fr 7fr;gap:clamp(20px,6vw,90px);align-items:start;margin-bottom:clamp(48px,7vw,96px)}
.ql-head h2{font-size:clamp(36px,4.4vw,60px);line-height:1.04;text-wrap:balance}
.ql-intro{display:grid;gap:18px;justify-items:start}
.ql-intro p{font-size:18px;line-height:1.75;color:#d9cbe8;max-width:58ch;text-wrap:pretty}
.ql-intro .ql-lead{font-size:clamp(19px,1.7vw,22px);line-height:1.6;color:#ece2f6}

.ql-hint{font-size:15px;color:#bba8d1;margin-bottom:6px}
.ql-tablist{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(4px,1vw,16px);border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:20px}
.ql-tab{appearance:none;border:0;background:none;padding:0;margin:0;cursor:pointer;font:inherit;color:inherit;text-align:center;display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0}
.ql-tab:focus-visible{outline:3px solid var(--orchid);outline-offset:6px;border-radius:12px}
.ql-giant{font:400 clamp(84px,17vw,236px)/.95 var(--display);color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.5);transition:color .35s,text-shadow .35s,-webkit-text-stroke-color .35s}
.ql-word{font-weight:600;font-size:clamp(15px,1.3vw,17px);color:#c9b8dc;transition:color .3s}
.ql-tab:hover .ql-giant{-webkit-text-stroke-color:var(--gem-light)}
.ql-tab[aria-selected=true] .ql-giant{color:var(--gem-light);-webkit-text-stroke-color:var(--gem-light);text-shadow:0 0 48px color-mix(in srgb,var(--gem-light) 55%,transparent)}
.ql-tab[aria-selected=true] .ql-word{color:var(--gem-light)}

.ql-panels{display:grid;margin-top:clamp(28px,4vw,48px)}
/* Panels stack in one cell so the section keeps the height of the longest sentence and never jumps */
.ql-panel{grid-area:1/1}
.ql-panel[hidden]{display:block!important;visibility:hidden}
.ql-panel:focus-visible{outline:2px solid var(--orchid);outline-offset:8px;border-radius:8px}
.ql-panel-word{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ql-sentence{font-family:var(--display);font-size:clamp(24px,2.6vw,36px);line-height:1.3;max-width:30ch;text-wrap:pretty}
@media (prefers-reduced-motion:no-preference){
  .ql-panel:not([hidden]) .ql-sentence{animation:ql-in .45s ease-out both}
  @keyframes ql-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
}

@media (max-width:900px){
  .ql-head{grid-template-columns:1fr}
}
@media (max-width:600px){
  .ql-giant{-webkit-text-stroke-width:1px}
  .ql-sentence{font-size:23px}
}
