.header .brand-logo,.footer-brand .brand-logo{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:10px;overflow:hidden;flex-shrink:0;background:#fff}
.brand-logo img{width:160%;height:160%;max-width:none;object-fit:cover;display:block}
a.btn:not(.secondary),button.btn:not(.secondary),.final .btn,.hero .btn{color:#fff!important}
@media(max-width:767px){
 .header{overflow:visible}.header .nav{position:relative;display:flex!important;align-items:center;gap:10px;min-height:64px;padding:10px 12px;width:100%;max-width:100%}
 .header .brand{min-width:0;margin-right:auto;font-size:17px;gap:8px;white-space:nowrap}.header .brand .mark{width:30px;height:30px;flex-shrink:0}
 .header .sign{width:auto!important;min-width:0;min-height:40px;padding:8px 12px;font-size:12px;white-space:nowrap;flex:0 0 auto}
 .header .menu{display:grid!important;place-items:center;width:40px!important;min-width:40px;max-width:40px;height:40px;min-height:40px;padding:0!important;border-radius:12px;flex:0 0 40px;font-size:20px}
 .header .links{display:none!important;position:absolute;top:calc(100% + 8px);left:0;right:0;padding:8px;margin:0;border:1px solid #e8dff4;border-radius:16px;background:#fff;box-shadow:0 12px 28px #291c4415;gap:2px;max-height:40dvh;overflow-y:auto}
 .header .links.open{display:flex!important;flex-direction:column}.header .links a{display:block;padding:10px 14px;min-height:40px;line-height:1.4;font-size:14px;border-radius:10px}
 main>section:not(.hero):not(.final){padding-top:40px;padding-bottom:40px}.section-title{margin-bottom:26px}.section-title h2{margin-top:0}.steps{padding-top:40px;padding-bottom:40px}
 .hero p{margin-bottom:24px}.hero .btn,.center .btn,.final .btn,.page-cta .btn,.contact-cta .btn,.guide-cta-card .btn{width:auto!important;min-width:144px;max-width:100%;display:inline-flex;padding:12px 24px;min-height:46px}
 .center{display:flex;justify-content:center;margin-top:28px}.hero .btn{align-self:center}.final h2{margin-bottom:24px}
 #shot-viewer,#image-viewer{max-height:88dvh;width:calc(100vw - 24px);padding:54px 12px 12px;margin:auto;border-radius:18px}
 #shot-viewer .shot-scroll{max-height:calc(88dvh - 70px);overflow:auto}#shot-viewer #shot-full-image,#image-viewer>img{width:auto;height:auto;max-width:100%;max-height:calc(88dvh - 76px);object-fit:contain;margin:auto}
}
@media(max-width:767px){
 .header .nav{box-sizing:border-box;width:100%!important;gap:8px;padding:8px 10px!important;min-height:58px}
 .header .brand{flex:1 1 auto;font-size:15px;letter-spacing:-.4px;gap:6px;overflow:hidden}.header .brand-logo{width:29px;height:29px}
 .header .sign{padding:8px 10px;font-size:11px;flex-shrink:0}.header .menu{width:36px!important;min-width:36px;max-width:36px;height:36px;min-height:36px;flex-basis:36px;margin:0}
 #features{padding-bottom:28px!important}#companions{padding-top:40px!important;padding-bottom:28px!important}#guide.steps{padding-top:40px!important}#companions .section-title{margin-top:0;margin-bottom:24px}
 .focus-stage{height:calc(var(--card-width) * 1.33334 + 8px)!important}#companions .center{margin-top:16px!important}
}
.wb-zoom-viewer{padding:0!important;width:min(1200px,calc(100vw - 24px))!important;height:min(88dvh,900px);max-height:88dvh!important;overflow:hidden!important}
.wb-zoom-toolbar{height:56px;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:8px 12px;background:#f9f7fc;border-bottom:1px solid #e8def3;position:relative;z-index:2}
.wb-zoom-toolbar button{width:38px;height:38px;min-width:38px;padding:0;border:1px solid #ded3ed;border-radius:10px;background:white;color:#6331c7;font-size:17px;display:grid;place-items:center}
.wb-zoom-toolbar button:last-child{background:#7540df;color:white;border-color:#7540df}.wb-zoom-toolbar output{margin-right:auto;font-size:13px;color:#625b71;padding:0 8px}
.wb-zoom-stage{height:calc(100% - 56px);overflow:auto;background:#eee9f3;touch-action:none;cursor:grab;overscroll-behavior:contain}
.wb-zoom-stage:active{cursor:grabbing}.wb-zoom-viewer .wb-zoom-stage img{display:block!important;max-width:none!important;max-height:none!important;height:auto!important;margin:0!important;user-select:none;-webkit-user-drag:none}
/* Reset the shared header's horizontal margins, which otherwise add to width:100%. */
@media(max-width:767px){
 .header .nav{margin:0!important;width:100%!important;max-width:100%!important;padding:8px 10px!important;box-sizing:border-box}
 .header .brand{min-width:0;flex:1 1 0}.header .sign{flex:0 0 auto}.header .menu{flex:0 0 36px}
 .hero-grid>div:first-child .btn{display:flex;width:max-content!important;margin:0 auto;max-width:100%}
 #features .feature,#guide .step,.steps .step{display:flex;flex-direction:column;min-width:0}
 #features .feature h3{order:0;margin:0 0 12px}#features .feature p{order:1;margin:0}
 #features .feature .feature-visual{order:2;margin:18px 0 0}
 .steps .step .step-heading{order:0;margin:0 0 12px}.steps .step>p{order:1;margin:0}.steps .step .step-art{order:2;margin:18px 0 0!important}
}
#shot-viewer.wb-lightbox,#image-viewer.wb-lightbox{width:100vw!important;max-width:none!important;height:100dvh!important;max-height:none!important;margin:0!important;padding:12px!important;position:fixed;inset:0;box-sizing:border-box;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important;cursor:zoom-out}
.wb-lightbox[open]{display:flex!important;align-items:center;justify-content:center}
.wb-lightbox::backdrop{background:#171120cc;backdrop-filter:blur(3px)}
#shot-viewer.wb-lightbox #shot-full-image,#image-viewer.wb-lightbox>img{display:block!important;width:auto!important;height:auto!important;max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important;margin:auto!important;object-fit:contain;border-radius:0;cursor:zoom-out}
#shot-viewer.wb-lightbox,#image-viewer.wb-lightbox{touch-action:none}
#shot-viewer.wb-lightbox #shot-full-image,#image-viewer.wb-lightbox>img{position:absolute;left:50%;top:50%;width:var(--wb-image-width,auto)!important;max-width:none!important;max-height:none!important;margin:0!important;transform-origin:center;user-select:none;-webkit-user-drag:none;cursor:grab}

/* Blog list card titles retain H2 semantics with a smaller visual scale. */
.content .blog-card h2{font-size:26px;line-height:1.3;letter-spacing:-.4px}
@media(max-width:767px){.content .blog-card h2{font-size:22px;line-height:1.35;letter-spacing:-.3px}}

/* Mobile hero: title, media, description, centered CTA. */
@media(max-width:767px){
 .hero .hero-grid>div:first-child{display:contents}
 .hero .hero-grid>div:first-child h1{order:1;margin:0}
 .hero .hero-grid>div:nth-child(2){order:2}
 .hero .hero-grid>div:first-child p{order:3;margin:0;font-size:16px;line-height:1.75}
 .hero .hero-grid>div:first-child .btn{order:4;margin:0 auto}
}

/* Body heading hierarchy: preserve semantic heading levels. */
main .guide-copy h3,.content.legal h3,.article-page .article-content h3{font-size:20px;line-height:1.4;font-weight:700}
main .guide-copy h4{font-size:18px;line-height:1.45;font-weight:700}
@media(max-width:767px){
 main .guide-copy h3,.content.legal h3,.article-page .article-content h3{font-size:18px;line-height:1.4}
 main .guide-copy h4{font-size:16px;line-height:1.5}
}