/* BizSensei Blog: public stylesheet.
   Studio design system, shared with bizsensei.co.in and bizsensei.agency:
   pure monochrome (black, white and the shades between), Inter, square
   corners, 2px black borders, hard offset shadows, kickers, dark bands.
   The blog keeps its own content structure (lead story, headline rail,
   story cards, sections, article furniture) in the studio language. */

:root{
  --black:#0a0a0a; --ink:#111; --gray-9:#1a1a1a; --gray-7:#404040;
  --gray-6:#5c5c5c; --gray-5:#737373; --gray-4:#a3a3a3; --gray-3:#d4d4d4;
  --gray-2:#e5e5e5; --gray-1:#f5f5f5; --white:#fff;
  --shadow:4px 4px 0 var(--black); --shadow-sm:3px 3px 0 var(--black);
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--black);background:var(--white);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
::selection{background:var(--black);color:var(--white)}
img{max-width:100%;height:auto;display:block}
figure{margin:0}
a{color:var(--black)}
:focus-visible{outline:3px solid var(--gray-3);outline-offset:1px}
h1,h2,h3,h4{line-height:1.12;letter-spacing:-.02em;margin:0 0 14px;font-weight:800}
h1{font-size:clamp(34px,5vw,50px)}
h2{font-size:clamp(25px,3.4vw,34px)}
h3{font-size:21px}
p{margin:0 0 16px}
ul,ol{margin:0 0 16px;padding-left:22px}
table{border-collapse:collapse;width:100%}
.wrap{max-width:1180px;margin:0 auto;padding:0 20px}
.narrow{max-width:760px}
.center{text-align:center}
.muted{color:var(--gray-6)}
.lead{font-size:19px;color:var(--gray-7);max-width:680px}
main{display:block}

/* ---------- Header (studio) ---------- */
.site-header{position:sticky;top:0;z-index:50;background:var(--white);border-bottom:2px solid var(--black)}
.header-in{display:flex;align-items:center;gap:28px;padding-top:14px;padding-bottom:14px}
.brand{display:flex;align-items:center;gap:10px;font-weight:900;font-size:19px;text-decoration:none;letter-spacing:-.02em;white-space:nowrap;color:var(--black)}
.brand-logo{height:38px;width:auto;vertical-align:middle;flex:none}
.main-nav{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto}
.main-nav a{text-decoration:none;font-weight:600;font-size:15px;padding:7px 10px;color:var(--gray-7)}
.main-nav a:hover,.main-nav a.active{color:var(--black);background:var(--gray-1);box-shadow:inset 0 -3px 0 var(--black)}

/* Section bar: the blog's categories as sections, under the header */
.section-bar{border-top:2px solid var(--black);background:var(--white)}
.section-bar-in{display:flex;align-items:stretch;gap:2px;flex-wrap:wrap}
.section-bar a{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--ink);text-decoration:none;padding:11px 13px;display:inline-flex;align-items:center}
.section-bar a:hover{background:var(--gray-1)}
.section-bar a.active{background:var(--black);color:var(--white)}
.section-bar .sb-search{margin-left:auto;color:var(--gray-6)}
.section-bar .sb-search:hover{color:var(--black)}

/* ---------- Flashes ---------- */
.flash{border:2px solid var(--black);padding:13px 16px;margin:18px auto;max-width:1180px;font-weight:600;background:var(--gray-1);box-shadow:var(--shadow-sm)}
.flash-success,.flash-ok{background:var(--black);color:var(--white)}
.flash-error,.flash-err{background:var(--white);border-left:10px solid var(--black)}
.flash-info{background:var(--gray-1)}

/* ---------- Buttons ---------- */
.btn{display:inline-block;background:var(--white);color:var(--black);border:2px solid var(--black);padding:11px 22px;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;box-shadow:var(--shadow-sm);transition:transform .08s ease,box-shadow .08s ease;font-family:var(--font);line-height:1.35;text-align:center}
.btn:hover{transform:translate(-1px,-1px);box-shadow:4px 4px 0 var(--black)}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--black)}
.btn-dark{background:var(--black);color:var(--white)}
.btn-light{background:var(--white);color:var(--black);border-color:var(--white)}
.btn-sm{padding:7px 14px;font-size:14px}
.btn-lg{padding:15px 30px;font-size:17px}
.btn-block{display:block;width:100%;text-align:center}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none;box-shadow:var(--shadow-sm)}
button.btn{font-family:var(--font)}

/* ---------- Kickers ---------- */
.kicker,.page-kicker{display:inline-block;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.14em;border:2px solid var(--black);padding:4px 10px;margin-bottom:18px;background:var(--white)}

/* ---------- Front page ---------- */
.front{padding-top:36px}
.front-top{display:grid;grid-template-columns:1.9fr 1fr;gap:26px;margin-bottom:6px}
.front-top.solo{grid-template-columns:1fr}
.front-top.solo .lead-story{max-width:880px}
.lead-story{border:2px solid var(--black);background:var(--white);padding:28px;box-shadow:var(--shadow)}
.lead-story .story-kicker{margin-bottom:14px}
.lead-headline{font-size:clamp(32px,4.4vw,50px);line-height:1.06;margin-bottom:14px}
.lead-headline a{color:var(--black);text-decoration:none}
.lead-headline a:hover{text-decoration:underline;text-underline-offset:4px}
.lead-img{border:2px solid var(--black);margin:18px 0 0}
.lead-img img{width:100%;max-height:460px;object-fit:cover}
.img-note{font-size:12.5px;color:var(--gray-5);padding:8px 0 2px;margin:0}
.standfirst{font-size:19.5px;line-height:1.55;color:var(--gray-7);margin-bottom:14px}
.byline{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-6)}
.byline strong{color:var(--black)}
.byline .read-more{text-transform:none;letter-spacing:0;font-size:14.5px}
.front-rail{border:2px solid var(--black);background:var(--white);padding:22px}
.rail-title{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  color:var(--black);border-bottom:2px solid var(--black);padding-bottom:10px;margin-bottom:4px}
.rail-more{font-size:13.5px;font-weight:700;margin:12px 0 0}
.rail-more a{text-decoration:none;border-bottom:2px solid var(--black);padding-bottom:1px}
.rail-more a:hover{background:var(--gray-2)}

/* Headline lists (rail, related stories, section blocks) */
.headlines{list-style:none;margin:0;padding:0}
.headlines li{padding:11px 0;border-bottom:1px solid var(--gray-2)}
.headlines li:last-child{border-bottom:0}
.headlines a{font-size:17px;font-weight:700;line-height:1.3;color:var(--black);text-decoration:none}
.headlines a:hover{text-decoration:underline;text-underline-offset:3px}
.hl-meta{display:block;font-size:12px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:var(--gray-5);margin-top:3px}

/* Story card: the unit used in columns, lists and section blocks */
.story-kicker{font-size:12.5px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--gray-5);margin-bottom:10px}
.story-kicker a{display:inline-block;background:var(--black);color:var(--white);text-decoration:none;padding:3px 9px;margin-right:6px;letter-spacing:.08em}
.story-kicker a:hover{background:var(--gray-7)}
.story{border:2px solid var(--black);background:var(--white);padding:22px;display:flex;flex-direction:column}
.story-head{font-size:21px;line-height:1.2;margin-bottom:8px}
.story-head a{color:var(--black);text-decoration:none}
.story-head a:hover{text-decoration:underline;text-underline-offset:3px}
.story-dek{font-size:15.5px;line-height:1.55;color:var(--gray-7);margin-bottom:10px;flex:1}
.story-more{margin:0}
.read-more{font-weight:700;font-size:14.5px;color:var(--black);text-decoration:none;border-bottom:2px solid var(--black);padding-bottom:1px}
.read-more:hover{background:var(--gray-2)}

/* Latest posts columns on the front page */
.story-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin:6px 0 4px}

/* Section blocks (per category) */
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  border-top:2px solid var(--black);padding-top:18px;margin:42px 0 20px}
.sec-head h2{font-size:clamp(24px,3vw,32px);margin:0}
.sec-head .go{font-size:13.5px;font-weight:700;text-decoration:none;color:var(--black);border-bottom:2px solid var(--black);padding-bottom:1px;flex:none}
.sec-head .go:hover{background:var(--gray-2)}
.sec-split{display:grid;grid-template-columns:1.25fr 1fr;gap:26px}
.sec-split .headlines{border:2px solid var(--black);padding:10px 22px;background:var(--white)}

/* Listing pages (category, tag, search, archive) */
.page-head{padding:40px 0 4px;border-bottom:2px solid var(--black);margin-bottom:24px}
.page-head h1{margin-bottom:10px}
.story-list{display:grid;gap:18px}
.story-list .story-head{font-size:23px}
.results-line{font-size:16px;color:var(--gray-6);margin:4px 0 18px}

/* Pager */
.pager{display:flex;gap:16px;align-items:center;margin:28px 0 8px;font-size:14.5px}
.pager-link{font-weight:700;color:var(--black);text-decoration:none;border:2px solid var(--black);padding:7px 15px;background:var(--white);box-shadow:var(--shadow-sm)}
.pager-link:hover{background:var(--black);color:var(--white)}
.pager-info{color:var(--gray-6);font-weight:600}

/* Search */
.search-form{display:flex;gap:10px;max-width:560px;margin:6px 0 14px}
.search-form input{flex:1}

/* ---------- Article ---------- */
.article{padding-top:36px;padding-bottom:8px}
.art-head{border-bottom:2px solid var(--black);padding-bottom:20px;margin-bottom:24px}
.art-section{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:14px}
.art-section a{display:inline-block;background:var(--black);color:var(--white);text-decoration:none;padding:4px 11px}
.art-section a:hover{background:var(--gray-7)}
.art-headline{font-size:clamp(34px,5vw,54px);line-height:1.07;margin-bottom:14px}
.byline-bar{display:flex;gap:8px 22px;flex-wrap:wrap;align-items:baseline;margin-top:16px;
  border-top:1px solid var(--gray-2);padding-top:14px;font-size:14px;color:var(--gray-6)}
.byline-bar .byline{text-transform:none;letter-spacing:0;font-size:14px}
.byline-bar .art-date{letter-spacing:.04em;font-weight:600}
.art-img{border:2px solid var(--black);margin:4px 0 24px}
.article-body{font-size:18.5px;line-height:1.75;color:var(--gray-9)}
.article-body p{margin-bottom:20px}
.article-body h2{font-size:28px;margin:34px 0 12px}
.article-body h3{font-size:22px;margin:28px 0 10px}
.article-body h4{font-size:19px;margin:22px 0 8px}
.article-body blockquote{margin:26px 0;padding:20px 24px;border:2px solid var(--black);box-shadow:var(--shadow-sm);
  font-size:20px;font-weight:600;line-height:1.5;color:var(--black);background:var(--white)}
.article-body blockquote p{margin-bottom:8px}
.article-body blockquote p:last-child{margin-bottom:0}
.article-body table{margin:18px 0;font-size:16px}
.article-body th,.article-body td{border:1px solid var(--gray-3);padding:9px 12px;text-align:left}
.article-body th{background:var(--gray-1);font-size:13px;letter-spacing:.05em;text-transform:uppercase}
.article-body a{text-decoration:underline;text-underline-offset:3px}
.article-body hr{border:0;border-top:2px solid var(--gray-2);margin:28px 0}
.tag-list{margin:26px 0 4px;font-size:14px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.tag-label{font-weight:800;letter-spacing:.08em;text-transform:uppercase;font-size:12px;color:var(--gray-5)}
.tag-link{color:var(--black);text-decoration:none;border:2px solid var(--black);padding:3px 10px;font-weight:700;font-size:13px;background:var(--white)}
.tag-link:hover{background:var(--black);color:var(--white)}
.share-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;border-top:2px solid var(--black);border-bottom:2px solid var(--black);
  padding:12px 0;margin:22px 0 6px}
.share-row span{font-weight:800;font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-5);margin-right:2px}
.share-row a{font-size:13.5px;font-weight:700;text-decoration:none;border:2px solid var(--black);padding:5px 13px;color:var(--black);background:var(--white)}
.share-row a:hover{background:var(--black);color:var(--white)}

/* Prev / next */
.prevnext{display:flex;justify-content:space-between;gap:26px;padding-top:20px;padding-bottom:6px}
.prevnext a{font-weight:800;font-size:18px;line-height:1.3;text-decoration:none;color:var(--black);max-width:46%}
.prevnext a:hover{text-decoration:underline;text-underline-offset:3px}
.prevnext .pn-label{display:block;font-weight:800;font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--gray-5);margin-bottom:5px}
.prevnext .next{margin-left:auto;text-align:right}

/* Related stories */
.related{margin-top:38px}
.block-title{font-size:24px;border-top:2px solid var(--black);padding-top:16px;margin-bottom:4px}

/* Subscribe panel */
.subscribe-panel h3{font-size:23px}

/* Comments */
.comments{margin-top:44px;border-top:2px solid var(--black);padding-top:22px}
.comments h2{font-size:25px}
.comment{border:2px solid var(--gray-2);padding:16px 18px;margin-bottom:14px;background:var(--white)}
.comment strong{font-size:16.5px;color:var(--black)}
.comment .post-date{color:var(--gray-5);font-size:13px;margin-left:8px;font-weight:600}
.comment p{margin:5px 0 4px;font-size:16px}
.post-date{color:var(--gray-5);font-size:14px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Legal (dormant local renderer; the canonical documents live on the hub) */
.legal-links{display:flex;gap:10px;flex-wrap:wrap;padding:20px 0 10px}
.legal-links a{border:2px solid var(--black);padding:8px 14px;font-weight:700;text-decoration:none}
.legal-links a:hover{background:var(--black);color:var(--white)}

/* ---------- Forms and panels ---------- */
.form-card{border:2px solid var(--black);box-shadow:var(--shadow);padding:30px;margin:36px 0;background:var(--white)}
.form-card h2,.form-card h3{margin-bottom:8px}
label{font-weight:700;font-size:14px;display:block;margin-bottom:14px}
input[type=text],input[type=email],input[type=tel],input[type=number],input[type=password],input[type=url],input[type=search],input[type=date],select,textarea{
  width:100%;border:2px solid var(--black);padding:11px 12px;font:inherit;font-size:15px;background:var(--white);color:var(--black);margin-top:5px}
input:focus,select:focus,textarea:focus{outline:3px solid var(--gray-3);outline-offset:1px}
textarea{resize:vertical}
.form-error{color:var(--black);font-weight:700;border-left:6px solid var(--black);background:var(--gray-1);padding:8px 12px;margin:10px 0}

/* ---------- Error pages ---------- */
.error-page{padding:56px 0 20px}
.error-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}

/* ---------- Footer (studio, dark) ---------- */
.site-footer{background:var(--black);color:var(--white);margin-top:72px;padding:56px 0 0}
.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.4fr;gap:36px;padding-bottom:40px}
.site-footer h4{color:var(--white);font-size:15px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:14px}
.site-footer a{color:var(--gray-3);text-decoration:none;display:block;padding:3px 0}
.site-footer a:hover{color:var(--white);text-decoration:underline}
.site-footer p{color:var(--gray-4)}
.site-footer .brand{color:var(--white);margin-bottom:12px;display:flex}
.foot-tagline{max-width:340px}
.foot-legal{display:flex;justify-content:space-between;gap:14px 26px;flex-wrap:wrap;border-top:1px solid var(--gray-7);padding-top:18px;padding-bottom:8px;color:var(--gray-4);font-size:14px;align-items:center}
.foot-legal a{display:inline;color:var(--gray-3)}
.foot-links a{margin-left:16px;font-weight:600}
.foot-fine{font-size:13.5px;color:var(--gray-5);padding-bottom:24px;margin:0}
.news-form{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.news-form input[type=email]{background:var(--gray-9);border:2px solid var(--gray-7);color:var(--white);padding:11px 12px;font:inherit;font-size:15px;width:100%}
.news-form .btn{align-self:flex-start}
.site-footer .consent-block{background:var(--gray-9);border-color:var(--gray-7);color:var(--gray-3);font-size:13px;margin:0 0 4px}
.site-footer .consent-block a{color:var(--white)}

/* ---------- Consent (popup flow unchanged, studio dress) ---------- */
.consent-block{border:2px solid var(--gray-3);padding:14px 16px;margin:16px 0;background:var(--gray-1);font-size:14.5px}
.consent-open{display:flex;gap:9px;align-items:flex-start;font-weight:600;cursor:pointer;margin:0}
.consent-open input{margin-top:4px;width:17px;height:17px;accent-color:var(--black);flex:none}
.consent-link{background:none;border:0;padding:0;font:inherit;font-weight:800;text-decoration:underline;cursor:pointer;color:inherit}
.consent-modal{position:fixed;inset:0;background:rgba(10,10,10,.72);display:flex;align-items:center;justify-content:center;z-index:100;padding:18px;overflow:auto}
.consent-modal[hidden]{display:none}
.consent-card{background:var(--white);border:2px solid var(--black);box-shadow:8px 8px 0 var(--black);max-width:520px;width:100%;padding:30px;max-height:92vh;overflow:auto;color:var(--black)}
.consent-card label{margin-bottom:0}
.consent-doc{display:flex;gap:9px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--gray-2);cursor:pointer;margin:0;font-weight:600}
.consent-doc input{margin-top:3px;width:17px;height:17px;accent-color:var(--black);flex:none}
.consent-doc a{font-weight:800}
.consent-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:20px;flex-wrap:wrap}

/* Empty state */
.empty-state{padding:56px 20px 10px}
.empty-state .form-card{max-width:520px;margin:26px auto 0;text-align:left}

/* ---------- Responsive ---------- */
@media (max-width:1020px){
  .foot-grid{grid-template-columns:1fr 1fr}
  .story-cols{grid-template-columns:repeat(2,1fr)}
  .front-top{grid-template-columns:1fr}
  .front-rail{max-width:640px}
}
@media (max-width:820px){
  .sec-split{grid-template-columns:1fr}
}
@media (max-width:680px){
  .story-cols{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr}
  .foot-legal{flex-direction:column;align-items:flex-start}
  .foot-links a{margin-left:0;margin-right:16px}
  .header-in{gap:14px}
  .main-nav{display:none}
  .section-bar a{padding:10px 9px}
  .form-card{padding:22px}
  .lead-story{padding:22px}
  .article-body{font-size:17.5px}
  .prevnext a{max-width:48%}
  table{display:block;overflow-x:auto}
}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .btn{transition:none}
}