.guides-page{background:var(--sp-porcelain);padding:clamp(32px,4vw,56px) 0 clamp(72px,10vw,128px)}.guides-container{width:min(100% - 48px,1120px);margin-inline:auto}.guides-back{display:inline-flex;align-items:center;color:var(--sp-muted);font-size:var(--sp-text-sm);text-decoration:none;transition:color .18s ease}.guides-back:hover{color:var(--sp-ink)}.guides-hero{max-width:810px;margin-top:clamp(46px,7vw,84px)}.guides-hero>p:first-child,.guides-section-heading>div>p{margin:0;color:var(--sp-brass);font-size:var(--sp-text-xs);font-weight:var(--sp-weight-semibold);letter-spacing:.1em;line-height:1.4}.guides-hero h1{margin:12px 0 0;color:var(--sp-ink);font-family:var(--sp-font-sans);font-size:clamp(2.55rem,5.4vw,4.35rem);font-weight:var(--sp-weight-medium);letter-spacing:.035em;line-height:1.14}.guides-hero-description{margin:22px 0 0;color:var(--sp-text);font-size:clamp(1.08rem,1.7vw,1.28rem);line-height:1.7}.guides-hero-introduction{max-width:650px;margin:14px 0 0;color:var(--sp-muted);font-size:var(--sp-text-sm);line-height:1.76}.guides-collection{margin-top:clamp(62px,8vw,98px)}.guides-section-heading{border-top:1px solid var(--sp-line);padding:24px 0 25px}.guides-section-heading h2{margin:6px 0 0;color:var(--sp-ink);font-family:var(--sp-font-sans);font-size:clamp(1.65rem,3vw,2.15rem);font-weight:var(--sp-weight-medium);line-height:1.2}.guide-groups{border-top:1px solid var(--sp-line)}.guide-group{display:grid;grid-template-columns:140px minmax(0,1fr);gap:clamp(var(--sp-space-5),3vw,var(--sp-space-8));border-bottom:1px solid var(--sp-line)}.guide-group-heading{align-self:start;padding:var(--sp-space-5) 0}.guide-group-heading h3{margin:0;color:var(--sp-brass);font-size:var(--sp-text-sm);font-weight:var(--sp-weight-semibold);letter-spacing:.04em;line-height:1.5}.guide-index{list-style:none;margin:0;padding:0}.guide-index>li{border-bottom:1px solid var(--sp-line)}.guide-index>li:last-child{border-bottom:0}.guide-index-entry{display:grid;grid-template-columns:72px minmax(220px,.82fr) minmax(260px,1.18fr) 28px;align-items:center;gap:clamp(var(--sp-space-4),2.4vw,var(--sp-space-7));min-height:80px;padding:var(--sp-space-4) 0;color:var(--sp-ink);text-decoration:none;transition:color .18s ease}.guide-index-media{display:block;width:72px;aspect-ratio:3 / 2;overflow:hidden;border-radius:4px;background:var(--sp-surface-soft)}.guide-index-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .24s ease}.guide-index-entry h4{margin:0;color:inherit;font-size:clamp(1rem,1.25vw,1.12rem);font-weight:var(--sp-weight-semibold);line-height:1.45;text-wrap:balance}.guide-index-entry>p{margin:0;color:var(--sp-text);font-size:var(--sp-text-sm);line-height:1.65;text-wrap:pretty}.guide-index-action{justify-self:end;color:var(--sp-moss);font-size:1.08rem;transition:transform .18s ease}.guide-index-entry:hover,.guide-index-entry:focus-visible{color:var(--sp-moss)}.guide-index-entry:hover .guide-index-action,.guide-index-entry:focus-visible .guide-index-action{transform:translate(3px)}.guide-index-entry:hover .guide-index-media img,.guide-index-entry:focus-visible .guide-index-media img{transform:scale(1.035)}.guide-index-entry:focus-visible{outline:2px solid var(--sp-moss);outline-offset:5px}@media(max-width:860px){.guide-group{display:block}.guide-group-heading{padding:var(--sp-space-5) 0 var(--sp-space-2)}.guide-index-entry{grid-template-columns:60px minmax(0,1fr) 24px;gap:var(--sp-space-3) var(--sp-space-4);min-height:0;padding:var(--sp-space-5) 0}.guide-index-media{grid-column:1;grid-row:1 / span 2;width:60px}.guide-index-entry h4{grid-column:2;grid-row:1}.guide-index-entry>p{grid-column:2;grid-row:2}.guide-index-action{grid-column:3;grid-row:1 / span 2}}@media(max-width:680px){.guides-page{padding-top:28px}.guides-container{width:min(100% - 32px,1120px)}.guides-hero{margin-top:46px}.guides-hero h1{font-size:clamp(2.3rem,12vw,3.2rem);letter-spacing:.02em}}@media(max-width:560px){.guide-index-entry{grid-template-columns:52px minmax(0,1fr) 20px;column-gap:var(--sp-space-3);padding:var(--sp-space-4) 0}.guide-index-media{width:52px}.guide-index-entry h4{font-size:1rem}.guide-index-entry>p{display:-webkit-box;overflow:hidden;font-size:.8rem;-webkit-box-orient:vertical;-webkit-line-clamp:2}}@media(prefers-reduced-motion:reduce){.guide-index-entry,.guide-index-action,.guide-index-media img{transition:none}.guide-index-entry:hover .guide-index-action,.guide-index-entry:hover .guide-index-media img{transform:none}}