/* Salesopedia — site-specific styles. A dictionary page: answer first, index as the product. */

h1,h2,h3{font-weight:600;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,1.6rem + 3vw,3.6rem);line-height:1.05}
h2{font-size:clamp(1.5rem,1.3rem + 1vw,2rem)}
h3{font-size:var(--fs-lg)}
.brand img{height:30px;width:auto}
.nav a{font-size:var(--fs-md);font-weight:600;color:var(--ink)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--brand)}
.lede{color:var(--ink-2);font-size:var(--fs-lg);max-width:52ch}

/* ---- Homepage intro ------------------------------------------------ */
.intro{padding-block:clamp(2.5rem,6vw,4.5rem) var(--s-5)}
.intro h1{max-width:16ch;margin-bottom:var(--s-4)}

/* ---- The dictionary index (the memorable thing) --------------------- */
.index{padding-bottom:var(--section)}
.finder{display:grid;gap:.4rem;max-width:34rem;margin-bottom:var(--s-4)}
.finder label{font-weight:600;font-size:var(--fs-sm)}
.finder input{font:inherit;font-size:var(--fs-lg);padding:.7em .9em;border:2px solid var(--ink);border-radius:var(--radius);background:#fff;color:var(--ink);width:100%;min-height:52px}
.finder input:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px color-mix(in srgb,var(--brand) 18%,transparent)}
.finder-empty{color:var(--ink-2);margin:.25rem 0 0}
.az-nav{display:flex;flex-wrap:wrap;gap:0;margin:0 0 var(--s-6);border-bottom:1px solid var(--line);padding-bottom:var(--s-3)}
.az-nav a,.az-nav span{display:inline-grid;place-items:center;min-width:44px;min-height:44px;font-family:var(--font-display);font-size:1.15rem;text-decoration:none}
@media(min-width:760px){.az-nav a,.az-nav span{min-width:40px}}
.az-nav a{color:var(--brand);font-weight:600}
.az-nav a:hover{background:var(--wash)}
.az-nav span{color:#cbbfc3}
.letter{display:grid;grid-template-columns:1fr;gap:var(--s-2) var(--s-6);padding-block:var(--s-5);border-bottom:1px solid var(--line)}
@media(min-width:760px){.letter{grid-template-columns:5rem 1fr}}
.letter-head{font-family:var(--font-display);font-size:clamp(2.6rem,2rem + 2.5vw,4rem);line-height:.9;color:var(--brand);margin:0;font-weight:600}
.letter dl{margin:0;display:grid;gap:0}
.entry{display:grid;grid-template-columns:1fr;gap:.15rem var(--s-6);padding:.7rem 0;border-top:1px solid var(--line)}
.entry:first-child{border-top:0;padding-top:0}
@media(min-width:900px){.entry{grid-template-columns:minmax(14rem,19rem) 1fr}}
.entry dt a{font-weight:600;font-size:var(--fs-md);color:var(--ink);text-decoration:none;display:inline-block;padding-block:.2rem}
.entry dt a:hover{color:var(--brand);text-decoration:underline}
.entry dd{margin:0;color:var(--ink-2);max-width:62ch}
.entry[hidden],.letter[hidden]{display:none}

/* ---- Long-form reading (homepage overview + term pages) ------------ */
.prose{font-family:var(--font-read);font-size:1.1rem;line-height:1.65;max-width:42rem}
.prose p,.prose li{max-width:65ch}
.prose h2{margin-top:var(--s-7);font-size:clamp(1.4rem,1.2rem + .8vw,1.75rem)}
.prose ul{padding-left:1.1em}
.prose li{margin-bottom:.4em}
.prose li::marker{color:var(--brand)}
.prose a{color:var(--brand)}
.overview{padding-block:var(--section);border-top:1px solid var(--line)}
.overview .prose>h2:first-child{margin-top:0}
.takeaways{border-left:3px solid var(--brand);padding:var(--s-4) var(--s-5);margin:var(--s-6) 0;background:var(--wash)}
.prose .takeaways-title{font-size:var(--fs-lg);margin:0 0 var(--s-3)}
.takeaways ul{margin:0}

/* ---- Term pages ---------------------------------------------------- */
.term{padding-block:clamp(1.5rem,4vw,3rem) var(--section)}
.crumbs{font-size:var(--fs-sm);color:var(--ink-2);margin-bottom:var(--s-4)}
.crumbs a{color:var(--ink-2);display:inline-block;padding-block:.6rem}
.term-head{max-width:46rem;margin-bottom:var(--s-6)}
.term-head h1{font-size:clamp(2rem,1.5rem + 2.4vw,3.1rem);margin-bottom:var(--s-5)}
.term-def{font-family:var(--font-read);font-size:clamp(1.25rem,1.1rem + .7vw,1.6rem);line-height:1.4;max-width:none;margin:0;padding:var(--s-4) var(--s-5);border-left:4px solid var(--brand);background:var(--wash);color:var(--ink)}
.term-aka{margin-top:var(--s-3);color:var(--ink-2);font-size:var(--fs-sm)}
.term-grid{display:grid;gap:var(--s-6)}
@media(min-width:1000px){.term-grid{grid-template-columns:14rem minmax(0,1fr)}.term-rail{position:sticky;top:calc(var(--header-h) + 1.5rem);align-self:start}}
.rail-title{font-weight:600;font-size:var(--fs-sm);margin-bottom:var(--s-2)}
.toc{list-style:none;padding:0;margin:0;font-size:var(--fs-sm);border-left:1px solid var(--line)}
.toc li{margin:0}
.toc a{display:block;padding:.45rem 0 .45rem .9rem;color:var(--ink-2);text-decoration:none;line-height:1.35}
.toc a:hover{color:var(--brand)}
.term-section{scroll-margin-top:calc(var(--header-h) + 1rem)}
.faq-block{margin-top:var(--s-7)}
.faq details{border-radius:var(--radius);font-family:var(--font-body);font-size:var(--fs-md)}
.faq details>div p{max-width:62ch}
.related{margin-top:var(--section);padding-top:var(--s-6);border-top:1px solid var(--line);max-width:56rem}
.related h2{font-size:var(--fs-xl)}
.defs{margin:0}
.defs>div{display:grid;gap:.15rem var(--s-6);padding:.8rem 0;border-top:1px solid var(--line)}
@media(min-width:900px){.defs>div{grid-template-columns:16rem 1fr}}
.defs dt a{font-weight:600;color:var(--ink);text-decoration:none}
.defs dt a:hover{color:var(--brand);text-decoration:underline}
.defs dd{margin:0;color:var(--ink-2)}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-4);margin-top:var(--s-7);max-width:56rem}
.pager a{display:grid;gap:.2rem;padding:var(--s-4);border:1px solid var(--line);border-radius:var(--radius);text-decoration:none;color:var(--ink);font-weight:600}
.pager a:hover{border-color:var(--brand)}
.pager a[rel="next"]{text-align:right}
.pager small{color:var(--ink-2);font-weight:400}

/* ---- Simple pages --------------------------------------------------- */
.page{padding-block:clamp(2rem,5vw,4rem) var(--section)}
.page .prose h1{font-family:var(--font-display);margin-bottom:var(--s-5)}
.page .form{font-family:var(--font-body);font-size:var(--fs-md);max-width:36rem;margin-top:var(--s-6)}
.page .form-success{font-family:var(--font-body)}

/* ---- Footer: quiet, light ------------------------------------------ */
.site-footer{background:var(--bg-alt);color:var(--ink-2);border-top:1px solid var(--line);padding-block:var(--s-7) var(--s-5)}
.site-footer .brand{color:var(--ink);font-family:var(--font-display);font-weight:600}
.site-footer a:hover{color:var(--brand)}
.footer-row{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-6)}
.footer-row p{margin-top:var(--s-2);max-width:40ch}
.footer-row ul{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5)}
.footer-row ul a{display:inline-block;padding-block:.6rem}
.footer-bottom{border-top:1px solid var(--line);color:var(--ink-3);margin-top:var(--s-6)}
