/* Blog article + sidebar + author box styles. Only loaded on /blog/ pages, not site-wide. */

.featured-image{width:100%;height:auto;border-radius:10px;margin-bottom:24px;display:block;}

.blog-layout{display:flex;flex-direction:column;gap:36px;}
.blog-sidebar{display:flex;flex-direction:column;gap:20px;}
.sidebar-box{background:#fff;border:1px solid #D9D4C4;border-radius:10px;padding:20px;}
.sidebar-box h3{font-size:15px;color:var(--blue);margin-bottom:12px;text-transform:uppercase;letter-spacing:0.04em;font-family:var(--font-mono);}
.sidebar-search{display:flex;gap:8px;}
.sidebar-search input[type="search"]{flex:1;min-width:0;padding:10px 12px;border:1px solid #D9D4C4;border-radius:4px;font-size:15px;font-family:var(--font-body);}
.sidebar-search input[type="search"]:focus-visible{outline:2px solid var(--blue);outline-offset:1px;}
.sidebar-search button{background:var(--blue);color:#fff;border:0;border-radius:4px;padding:0 16px;font-weight:600;cursor:pointer;}
.sidebar-search button:focus-visible{outline:2px solid var(--red);outline-offset:2px;}
.sidebar-recent{list-style:none;padding:0;margin:0;}
.sidebar-recent li{border-bottom:1px solid #EFEDE4;padding:9px 0;}
.sidebar-recent li:last-child{border-bottom:0;}
.sidebar-recent a{font-size:14px;color:#33332F;text-decoration:none;line-height:1.4;display:block;}
.sidebar-recent a:hover{color:var(--red-dark);}
.sidebar-phones{display:flex;flex-direction:column;gap:10px;}

/* The sidebar sits inside <section class="careers">, whose global "a" styling
   (dark red, underlined) otherwise overrides the coupon button's own white text. */
.sidebar-box .coupon-btn{color:#fff;text-decoration:none;}
.sidebar-box .coupon-btn:hover{color:#fff;}

.author-box{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid #D9D4C4;border-radius:10px;padding:20px;margin-top:32px;}
.author-avatar{flex:0 0 auto;width:48px;height:48px;border-radius:50%;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-weight:700;font-size:15px;}
.author-name{font-weight:700;color:var(--blue);font-size:15px;}
.author-role{font-weight:500;color:var(--steel);font-size:12.5px;text-transform:uppercase;letter-spacing:0.04em;margin-left:6px;}
.author-bio{font-size:14.5px;color:#3C3C38;margin-top:6px;line-height:1.55;}

@media (min-width: 768px){
  .blog-layout{display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start;}
  .blog-sidebar{position:sticky;top:24px;}
}