/* The guide introduction shares the page background, rather than a banner box. */
.guide-page{padding-bottom:64px}
.guide-page>.breadcrumb{padding-bottom:8px}
.guide-hero{position:relative;isolation:isolate;display:flex;align-items:center;min-height:430px;margin-bottom:16px}
.guide-hero-copy{position:relative;z-index:1;width:55%;padding:32px 0 40px}
.guide-kicker{color:var(--primary-text);font-size:15px;font-weight:700;margin-bottom:18px}
.guide-hero h1{font-size:clamp(30px,3.1vw,40px);font-weight:800;line-height:1.55;letter-spacing:-.055em;color:var(--heading);word-break:keep-all}
.guide-hero h1 span{position:relative;white-space:nowrap}
.guide-hero h1 span:after{content:'';position:absolute;left:0;right:0;bottom:-6px;height:4px;background:var(--primary);border-radius:80% 35% 70% 20%;transform:rotate(-1deg)}
.guide-intro{margin-top:28px;color:#686868;font-size:16px;line-height:1.9;word-break:keep-all}
.guide-hero-art{position:absolute;z-index:0;right:-20px;top:-8px;bottom:0;width:80%;pointer-events:none;overflow:hidden}
.guide-hero-art img{width:100%;height:100%;object-fit:cover;object-position:right center;display:block}
.guide-hero-art:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#fff 0%,#fffffff2 16%,#ffffff8c 33%,transparent 49%,transparent 94%,#fff 100%),linear-gradient(0deg,#fff 0%,transparent 24%,transparent 86%,#fff 100%)}
.guide-content{max-width:920px;margin:0 auto}
.guide-section-heading{display:flex;align-items:center;gap:24px;font-size:26px;font-weight:750;line-height:1.5;letter-spacing:-.05em;color:var(--heading);margin-bottom:10px}
.guide-section-heading:after{content:'';height:1px;background:var(--line);flex:1}
.guide-step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:28px;padding:30px 12px;border-bottom:1px solid var(--line)}
.guide-step .step-number{width:40px;height:40px;font-size:17px;margin:0;border-radius:12px;background:#fff3e9}
.guide-step h3{font-size:22px;line-height:1.6;color:var(--heading);font-weight:700;letter-spacing:-.045em;word-break:keep-all;margin-bottom:12px}
.guide-step p,.guide-faq p{font-size:14px;color:#767676;line-height:1.95;margin:7px 0;word-break:keep-all;overflow-wrap:anywhere}
.guide-step .action-link{margin-top:10px}
.guide-faq{margin-top:44px}
.guide-faq>.guide-section-heading{margin-bottom:18px}
.guide-faq .faq a{color:var(--primary-text);text-decoration:underline;text-underline-offset:3px}
@media(max-width:1020px){
 .guide-hero{min-height:370px}
 .guide-hero-copy{width:60%}
 .guide-hero h1{font-size:32px}
 .guide-intro{font-size:14px}
 .guide-hero-art{width:83%}
}
@media(max-width:760px){
 .guide-page{padding-bottom:44px}
 .guide-hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;margin-bottom:22px}
 .guide-hero-copy{width:100%;padding:22px 0 0}
 .guide-kicker{font-size:12px;margin-bottom:12px}
 .guide-hero h1{font-size:clamp(25px,6.7vw,34px);line-height:1.5}
 .guide-hero h1 span:after{height:3px;bottom:-5px}
 .guide-intro{font-size:13px;line-height:1.85;margin-top:22px}
 .guide-hero-art{position:relative;right:auto;top:auto;bottom:auto;width:calc(100% + 40px);height:clamp(210px,64vw,330px);margin:4px -20px -12px}
 .guide-hero-art:after{background:linear-gradient(90deg,#fff 0%,transparent 14%,transparent 94%,#fff 100%),linear-gradient(0deg,#fff 0%,transparent 26%,transparent 81%,#fff 100%)}
 .guide-section-heading{font-size:22px;gap:15px;margin-bottom:6px}
 .guide-step{grid-template-columns:32px minmax(0,1fr);gap:14px;padding:23px 0}
 .guide-step .step-number{width:32px;height:32px;font-size:14px;border-radius:9px}
 .guide-step h3{font-size:18px;line-height:1.55;margin-bottom:11px}
 .guide-step p,.guide-faq p{font-size:13px;line-height:1.85}
 .guide-faq{margin-top:32px}
}