/* Practical field guides, using Unclog's existing type, colors and spacing. */
.guide-body{background:var(--ink)}
.guide-header .header-inner{justify-content:space-between}
.guide-header .main-nav{margin-left:auto}
.guide-shell{max-width:1160px;margin-inline:auto;padding:38px 40px 90px}
.guide-breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:12px;color:var(--muted);margin-bottom:52px;line-height:1.6}
.guide-breadcrumbs a:hover{color:var(--lavender)}
.guide-breadcrumbs span[aria-current]{color:var(--paper)}
.guide-heading{max-width:920px}
.guide-heading h1{font-size:clamp(40px,5.5vw,72px);max-width:850px;line-height:1.06;margin:18px 0 20px;letter-spacing:-.055em;text-wrap:balance}
.guide-heading h1 em{color:var(--lavender)}
.guide-description{max-width:700px;font-size:18px;color:var(--muted);line-height:1.7}
.guide-byline{font-size:11px;color:var(--muted);margin-top:23px}
.guide-byline span{padding-inline:8px;color:#776980}
.guide-answer{margin-top:38px;max-width:810px;background:#24202f;border:1px solid #4a3b60;border-left:3px solid var(--lavender);border-radius:0 14px 14px 0;padding:24px 27px}
.guide-answer .eyebrow{margin-bottom:9px}
.guide-answer>p:last-child{font-size:16px;line-height:1.75;color:#e5dfea}
.guide-layout{display:grid;grid-template-columns:minmax(0,720px) minmax(180px,240px);gap:80px;margin-top:54px;align-items:start}
.guide-article{min-width:0}
.guide-article section{scroll-margin-top:110px;margin-bottom:42px}
.guide-article h2{font-size:29px;letter-spacing:-.035em;line-height:1.2;margin-bottom:17px}
.guide-article h3{font-size:20px;margin:24px 0 10px;letter-spacing:-.025em}
.guide-article p,.guide-article li{font-size:16px;line-height:1.8;color:#c8bfcd}
.guide-article p+p{margin-top:16px}
.guide-article strong{color:var(--paper);font-weight:600}
.guide-article a:not(.button){color:var(--lavender);text-decoration:underline;text-underline-offset:4px;text-decoration-color:#806b9b}
.guide-article ul,.guide-article ol{margin:15px 0 22px;padding-left:23px}
.guide-article li+li{margin-top:10px}
.guide-article .guide-source{font-size:12px;margin-top:13px;color:var(--muted)}
.guide-note{padding:20px 23px;background:#211e26;border-radius:12px;margin-top:22px;border:1px solid var(--line)}
.guide-note p{font-size:14px;line-height:1.75}
.guide-note strong{display:block;margin-bottom:6px;color:var(--acid)}
.guide-sidebar{position:sticky;top:120px}
.guide-toc{border-top:1px solid var(--line);padding-top:18px}
.guide-toc>p{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-bottom:13px}
.guide-toc a{display:block;color:#c6bbc9;font-size:12px;line-height:1.6;padding:8px 0}
.guide-toc a:hover{color:var(--lavender)}
.guide-sidebar .guide-screenshot{margin-top:27px;overflow:hidden;background:#24202b;border:1px solid var(--line);border-radius:17px;padding:16px 17px 12px}
.guide-screenshot img{width:100%;border-radius:11px}
.guide-screenshot figcaption{font-size:10px;line-height:1.6;color:var(--muted);margin-top:12px}
.guide-cta{padding:29px;background:var(--lavender);color:var(--ink);border-radius:16px;margin-top:38px}
.guide-cta .eyebrow{color:#4f3769}
.guide-cta h2{font-size:30px;margin-top:12px;margin-bottom:13px}
.guide-cta p{font-size:14px;color:#40324e;line-height:1.7;max-width:560px}
.guide-cta .guide-cta-actions{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center;margin-top:20px}
.guide-cta .text-link{color:#392747!important;text-decoration:none!important;font-size:13px}
.guide-cta .text-link>span{color:inherit}
.guide-cta .guide-cta-note{font-size:11px;color:#4c3a5d;margin-top:14px;line-height:1.7}
.guide-related{margin-top:62px;padding-top:26px;border-top:1px solid var(--line)}
.guide-related>h2{font-size:25px;margin-bottom:21px}
.guide-related-links{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.guide-related-links>a{background:#211c28;padding:20px;border-radius:12px;border:1px solid var(--line);font-size:16px;font-weight:600;line-height:1.5;text-decoration:none!important;transition:border-color .2s}
.guide-related-links>a:hover{border-color:var(--lavender)}
.guide-related-links>a>span{display:block;font-size:11px;color:var(--muted);font-weight:400;margin-bottom:7px}
.guide-index-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin-top:47px}
.guide-index-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:#211c28;transition:transform .2s,border-color .2s}
.guide-index-card:hover{transform:translateY(-4px);border-color:#8e74af}
.guide-index-image{position:relative;overflow:hidden;aspect-ratio:1.55}
.guide-index-image img{width:100%;height:100%;object-fit:cover}
.guide-index-image::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#211c28)}
.guide-index-card-copy{padding:23px;display:flex;flex-direction:column;flex:1}
.guide-index-card .eyebrow{font-size:10px}
.guide-index-card h2{font-size:25px;line-height:1.2;margin:13px 0;letter-spacing:-.04em}
.guide-index-card p:not(.eyebrow){color:var(--muted);font-size:13px;line-height:1.75}
.guide-index-card .guide-read{margin-top:auto;padding-top:24px;color:var(--lavender);font-size:12px;font-weight:600}
.guide-index-about{display:flex;gap:35px;align-items:center;border-top:1px solid var(--line);padding-top:35px;margin-top:50px}
.guide-index-about h2{font-size:29px;min-width:230px}
.guide-index-about p{font-size:14px;color:var(--muted);max-width:590px;line-height:1.8}
.guide-footer{max-width:1160px;width:calc(100% - 80px)}
@media(max-width:1000px){.guide-layout{gap:38px;grid-template-columns:minmax(0,1fr) 200px}.guide-shell{padding-inline:28px}.guide-index-grid{gap:17px}.guide-index-card-copy{padding:19px}}
@media(max-width:760px){.guide-shell{padding:28px 20px 60px}.guide-breadcrumbs{margin-bottom:34px;font-size:11px}.guide-description{font-size:16px}.guide-heading h1{font-size:clamp(39px,8.7vw,59px)}.guide-layout{display:flex;flex-direction:column;gap:32px;margin-top:35px}.guide-sidebar{order:-1;position:static;width:100%}.guide-toc{display:flex;flex-wrap:wrap;gap:4px 16px;padding-bottom:18px;border-bottom:1px solid var(--line)}.guide-toc>p{width:100%;margin-bottom:5px}.guide-toc a{font-size:12px;padding:5px 0;text-decoration:underline;text-decoration-color:#655371;text-underline-offset:4px}.guide-sidebar .guide-screenshot{display:none}.guide-answer{padding:21px;margin-top:29px}.guide-answer>p:last-child{font-size:15px}.guide-article h2{font-size:27px}.guide-article p,.guide-article li{font-size:15px}.guide-cta{padding:24px}.guide-cta h2{font-size:28px}.guide-related-links{grid-template-columns:1fr}.guide-index-grid{grid-template-columns:1fr;margin-top:31px}.guide-index-image{aspect-ratio:2.2}.guide-index-card-copy{padding:23px}.guide-index-about{display:block}.guide-index-about p{margin-top:17px}.guide-footer{width:calc(100% - 40px)}.guide-header .main-nav{display:none}}
@media(prefers-reduced-motion:reduce){.guide-index-card{transition:none}.guide-index-card:hover{transform:none}}