/* Selected improvements to the existing Biraj387 website: navigation, directory, blog. */
:root{--b387-nav-height:76px}
html{scroll-padding-top:calc(var(--b387-nav-height) + 20px)}
body{padding-top:var(--b387-nav-height)}
[hidden]{display:none!important}
.skip-link{z-index:1100}
.b387-nav{position:fixed;inset:0 0 auto;z-index:1000;background:#0b1640;color:#fff;border-bottom:1px solid #ffffff1f;font-family:Inter,-apple-system,"Segoe UI",sans-serif}
.b387-nav-inner{width:min(1180px,calc(100% - 48px));height:var(--b387-nav-height);margin-inline:auto;display:flex;align-items:center;gap:28px}
.b387-nav-logo{display:inline-flex;align-items:center;background:#fff;padding:5px 9px;border-radius:12px;flex:none}
.b387-nav-logo img{display:block;width:54px;height:38px;object-fit:contain}
.b387-nav-desktop{display:flex;align-items:center;gap:25px;margin-left:auto;font-size:13px;font-weight:500}
.b387-nav a{text-decoration:none}
.b387-nav-desktop a{color:#d3daf2}
.b387-nav-desktop a:hover,.b387-nav-desktop a[aria-current=page]{color:#fff;text-decoration:underline;text-underline-offset:6px}
.b387-nav-download{background:#fecb00;color:#101e47;display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:11px 18px;font-size:13px;font-weight:600;border-radius:999px;white-space:nowrap;flex:none}
.b387-nav-download:hover{background:#ffda42}
.b387-nav-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;padding:10px;color:#fff;background:transparent;border:1px solid #ffffff50;border-radius:10px;flex:none}
.b387-nav-toggle svg{display:block}
.b387-nav-mobile{position:fixed;inset:var(--b387-nav-height) 0 0;padding:16px 24px 30px;overflow-y:auto;overscroll-behavior:contain;background:#0b1640;color:#fff}
.b387-nav-mobile a{display:flex;align-items:center;min-height:67px;border-bottom:1px solid #ffffff26;font-size:21px;font-weight:600}
.b387-nav a:focus-visible,.b387-nav button:focus-visible{outline:3px solid #fecb00;outline-offset:4px}
body.b387-menu-open{overflow:hidden}
.b387-home .hero{padding-top:74px}

/* Original artwork has room to breathe, with consistent card hierarchy. */
.brand-grid .brand-card{display:flex;flex-direction:column;align-items:flex-start;gap:0;padding:24px;border-radius:18px;min-width:0}
.brand-grid .brand-mark{width:100%;height:79px;border:0;border-radius:0;background:#fff;display:flex;align-items:center;justify-content:flex-start;margin-bottom:23px;overflow:visible}
.brand-grid .brand-mark img{width:145px;max-width:100%;height:68px;object-fit:contain;object-position:left center}
.brand-grid .brand-mark span{font-size:30px}
.brand-grid .brand-card h3{margin:0;font-size:18px;line-height:1.3;overflow-wrap:anywhere}
.brand-grid .brand-card .city{font-size:12px;margin-top:6px}
.brand-grid .brand-cats{font-size:12px;line-height:1.7;margin:17px 0 6px}
.brand-grid .company{font-size:11px;line-height:1.7;margin:0 0 20px}
.brand-grid .brand-card>a,.brand-grid .brand-card>span:last-child{width:100%;margin-top:auto;padding-top:13px;font-size:12px}

/* Keep the existing blog type, colors and content; add editorial hierarchy. */
.b387-blog-feature{display:grid;grid-template-columns:1fr 1fr;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;text-decoration:none;margin:0 0 35px}
.b387-blog-feature>img{display:block;width:100%;height:100%;min-height:300px;object-fit:cover}
.b387-blog-feature>div{padding:34px;align-self:center}
.b387-blog-feature .eyebrow{color:var(--blue);font-size:11px;margin:0 0 14px}
.b387-blog-feature h2{font:800 clamp(25px,2.5vw,33px)/1.17 Poppins,Inter,sans-serif;letter-spacing:-.025em;margin:0}
.b387-blog-feature p:not(.eyebrow){font-size:14px;line-height:1.75;color:var(--muted);margin:20px 0 0}
.b387-read{display:flex;align-items:center;gap:13px;font-size:12px;font-weight:600;color:var(--blue);margin-top:24px}
.b387-blog-feature:hover h2{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.b387-blog-topics{display:flex;flex-wrap:wrap;gap:9px;margin:0 0 55px}
.b387-blog-topics a{display:inline-flex;align-items:center;min-height:43px;padding:10px 16px;border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--blue);font-size:12px;font-weight:600;text-decoration:none}
.b387-blog-topics a:hover{border-color:var(--blue)}
.blog-grid .b387-article-link{padding:0;gap:0;border-radius:18px;overflow:hidden}
.b387-article-image{display:block;width:100%;height:175px;object-fit:cover}
.b387-article-copy{padding:23px;display:flex;flex-direction:column;flex:1;gap:10px}
.b387-article-copy strong{font-size:18px;line-height:1.35}
.b387-article-copy p{font-size:13px;line-height:1.75;color:var(--muted);margin:0}
.b387-article-copy .b387-read{margin-top:auto;padding-top:12px;font-size:11px;color:var(--blue)}
.blog-grid a .b387-article-copy .b387-read span{font-size:14px;color:var(--blue)}
.b387-blog-topics a,.blog-cluster{scroll-margin-top:20px}

@media(max-width:960px){
 .b387-nav-desktop{display:none}.b387-nav-download{margin-left:auto}.b387-nav-toggle{display:inline-flex}
 .b387-home .hero{padding-top:40px}
 .b387-blog-feature>div{padding:27px}.b387-blog-feature h2{font-size:27px}
 .blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .b387-article-image{height:160px}
}
@media(max-width:640px){
 :root{--b387-nav-height:66px}
 .b387-nav-inner{width:calc(100% - 36px);gap:10px}
 .b387-nav-logo{padding:4px 7px;border-radius:10px}.b387-nav-logo img{width:47px;height:33px}
 .b387-nav-download{font-size:11px;padding:10px 14px;min-height:42px}
 .b387-nav-toggle{width:40px;height:40px;padding:9px}
 .b387-home .hero{padding:29px 0 48px}
 .b387-home .hero .wrap{gap:25px}
 .b387-home .hero .hero-kicker{font-size:9px;letter-spacing:.11em;max-width:34ch}
 .b387-home .hero .hero-claim{font-size:clamp(42px,11.8vw,64px);margin:15px 0 20px;line-height:1.02}
 .b387-home .hero .lead{font-size:14px;line-height:1.7;max-width:35ch;margin-bottom:23px}
 .b387-home .hero .stores{gap:9px}
 .b387-home .hero .store-badge img{height:38px}
 .b387-home .hero .web{font-size:11px;margin:4px 0 0}
 .b387-home .hero .trust{font-size:10px;gap:8px 15px;margin-top:21px}
 .b387-home .hero-phone{margin-top:0}
 .b387-home .hero-phone .phone{width:205px;border-radius:36px;padding:7px}
 .b387-home .hero-phone .screen{border-radius:29px}
 .b387-home .hero-phone .phone::before{top:14px;height:17px}
 .b387-home .hero-phone .sb{height:31px;font-size:9px;padding:0 20px 4px 23px}.b387-home .hero-phone .sb i{font-size:8px}
 .brand-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
 .brand-grid .brand-card{padding:17px;border-radius:14px}
 .brand-grid .brand-mark{height:62px;margin-bottom:19px}.brand-grid .brand-mark img{height:56px;width:115px}
 .brand-grid .brand-card h3{font-size:14px;line-height:1.35}.brand-grid .brand-card .city{font-size:10px}
 .brand-grid .brand-cats{font-size:10px;margin-top:13px}.brand-grid .company{font-size:9px;line-height:1.7;margin-bottom:17px}
 .brand-grid .brand-card>a,.brand-grid .brand-card>span:last-child{font-size:10px;gap:6px}
 .b387-blog-feature{grid-template-columns:1fr;border-radius:18px;margin-bottom:25px}
 .b387-blog-feature>img{min-height:0;height:205px}.b387-blog-feature>div{padding:25px}
 .b387-blog-feature h2{font-size:25px}.b387-blog-feature p:not(.eyebrow){font-size:13px}
 .b387-blog-topics{gap:7px;margin-bottom:38px}.b387-blog-topics a{font-size:10px;padding:9px 12px;min-height:40px}
 .blog-grid{grid-template-columns:1fr;gap:20px}.b387-article-image{height:180px}.b387-article-copy{padding:22px}
}
@media(max-width:360px){.b387-nav-inner{width:calc(100% - 28px);gap:8px}.b387-nav-download{padding:10px 12px}.brand-grid .brand-card{padding:14px}.brand-grid .brand-card h3{font-size:13px}.brand-grid .brand-card>a{font-size:9px}}
@media(prefers-reduced-motion:reduce){.b387-nav *{transition:none!important}}


/* Hero: actual app result, explicitly labelled as an example. */
.b387-home .hero-phone-caption{margin:18px 0 0;text-align:center;font-size:11px;line-height:1.5;color:#c9d0ea}