/* =====================================================================
   Portfolio theme — Bootstrap 5.3 following the zerodha.com style system
   (values measured from zerodha.com): Inter; text #424242 / #666; headings
   weight 500; a single blue accent #387ed1; flat 3px buttons with #222 hover;
   white + #f6fbff sections; no shadows or dark bands; 1100px content width.
   Blue text/buttons use #2f73c9 (4.8:1 on white) because #387ed1 is 4.2:1,
   just under WCAG AA for normal-size text. #387ed1 stays for fills and hovers.
   ===================================================================== */
:root{
  --z-blue:#387ed1;   --z-blue-text:#2f73c9;  --z-blue-tint:#f6fbff;  --z-blue-soft:#e8f1fb;
  --z-ink:#424242;    --z-grey:#666666;       --z-grey-2:#707070;     --z-line:#eeeeee;   --z-footer:#fbfbfb;  --z-hover:#222222;

  /* Bootstrap overrides */
  --bs-body-font-family:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --bs-body-font-size:1rem;                --bs-body-line-height:1.7;
  --bs-body-color:var(--z-ink);            --bs-body-color-rgb:66,66,66;
  --bs-emphasis-color:var(--z-ink);        --bs-heading-color:var(--z-ink);
  --bs-secondary-color:var(--z-grey);      --bs-secondary-color-rgb:102,102,102;
  --bs-primary:#2f73c9;                    --bs-primary-rgb:47,115,201;
  --bs-primary-bg-subtle:var(--z-blue-soft); --bs-primary-text-emphasis:#255a9e; --bs-primary-border-subtle:#c9dcf3;
  --bs-link-color:var(--z-blue-text);      --bs-link-color-rgb:47,115,201;
  --bs-link-hover-color:var(--z-hover);    --bs-link-hover-color-rgb:34,34,34;
  --bs-border-color:var(--z-line);
  --bs-light-rgb:246,251,255;              --bs-tertiary-bg:var(--z-blue-tint);
  --bs-border-radius:.1875rem; --bs-border-radius-sm:.1875rem; --bs-border-radius-lg:.375rem; --bs-border-radius-xl:.5rem; --bs-border-radius-pill:50rem;
  --bs-focus-ring-color:rgba(56,126,209,.45);
}
@media(min-width:1200px){.container{max-width:1132px}}  /* 1100px content + gutters, as on zerodha.com */
html{scroll-padding-top:5rem}
body{-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3,.h4,.h5,.h6{font-weight:500;letter-spacing:normal;color:var(--z-ink)}
.display-4,.display-5,.display-6{font-weight:500;letter-spacing:-.01em;line-height:1.25}
.display-4{font-size:calc(1.6rem + 1.6vw)} .display-5{font-size:calc(1.5rem + 1.2vw)} .display-6{font-size:calc(1.4rem + .8vw)}
@media(min-width:1200px){.display-4{font-size:2.75rem}.display-5{font-size:2.4rem}.display-6{font-size:2rem}}
.lead{font-size:1.25rem;line-height:1.8;color:var(--z-grey);font-weight:400}
.fw-semibold{font-weight:500!important}
.fw-bold{font-weight:600!important}
a{text-underline-offset:.2em}
p{margin-bottom:1.1rem}

/* ---------- accessibility ---------- */
:focus-visible{outline:3px solid var(--z-blue);outline-offset:2px}
[tabindex="-1"]:focus{outline:none}
.skip-link{position:fixed;left:1rem;top:-120px;z-index:1100;background:var(--z-ink);color:#fff;padding:.6rem 1rem;border-radius:3px;font-weight:500;text-decoration:none}
.skip-link:focus{top:1rem;color:#fff}

/* ---------- colour utilities (names kept so pages stay unchanged) ---------- */
.text-brand,.text-blue{color:var(--z-blue-text)!important}
.bg-brand-subtle,.bg-blue-subtle,.bg-light{background:var(--z-blue-tint)!important}
/* "bg-ink" sections become Zerodha's light-blue band */
.bg-ink{background:var(--z-blue-tint)!important;color:var(--z-ink)}
.bg-ink .text-body-secondary{color:var(--z-grey)!important}
.bg-ink .lead{color:var(--z-grey)!important}

/* ---------- buttons: flat, 3px, blue, #222 hover ---------- */
.btn{font-weight:500;--bs-btn-padding-x:1.5rem;--bs-btn-padding-y:.55rem;--bs-btn-border-radius:3px;--bs-btn-font-size:1rem}
.btn-lg{--bs-btn-padding-y:.625rem;--bs-btn-padding-x:1.875rem;--bs-btn-font-size:1.2rem;--bs-btn-border-radius:3px}
.btn-sm{--bs-btn-padding-y:.3rem;--bs-btn-padding-x:.9rem;--bs-btn-font-size:.875rem;--bs-btn-border-radius:3px}
.btn-primary,.btn-blue{--bs-btn-color:#fff;--bs-btn-bg:#2f73c9;--bs-btn-border-color:#2f73c9;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#222;--bs-btn-hover-border-color:#222;--bs-btn-active-color:#fff;--bs-btn-active-bg:#000;--bs-btn-active-border-color:#000;--bs-btn-disabled-bg:#2f73c9;--bs-btn-disabled-border-color:#2f73c9;--bs-btn-focus-shadow-rgb:56,126,209}
.btn-outline-primary,.btn-outline-blue{--bs-btn-color:#2f73c9;--bs-btn-border-color:#2f73c9;--bs-btn-hover-color:#fff;--bs-btn-hover-bg:#2f73c9;--bs-btn-hover-border-color:#2f73c9;--bs-btn-active-color:#fff;--bs-btn-active-bg:#222;--bs-btn-active-border-color:#222;--bs-btn-focus-shadow-rgb:56,126,209}
.btn-outline-secondary{--bs-btn-color:var(--z-grey);--bs-btn-border-color:#dcdcdc;--bs-btn-hover-bg:#f5f5f5;--bs-btn-hover-color:var(--z-ink);--bs-btn-hover-border-color:#dcdcdc}
.btn-outline-dark{--bs-btn-color:var(--z-ink);--bs-btn-border-color:var(--z-ink);--bs-btn-hover-bg:var(--z-ink)}
.btn-filter{--bs-btn-color:var(--z-grey);--bs-btn-border-color:#dcdcdc;--bs-btn-hover-bg:#fff;--bs-btn-hover-border-color:var(--z-blue);--bs-btn-hover-color:var(--z-blue-text);--bs-btn-border-radius:3px;--bs-btn-padding-y:.4rem;--bs-btn-padding-x:1rem;font-size:.9rem;font-weight:400}
.btn-check:checked+.btn-filter,.btn-filter.active{background:#2f73c9;border-color:#2f73c9;color:#fff}

/* ---------- header (zerodha.com: white, 64px, faint shadow, #666 links, blue on hover) ---------- */
.site-header{background:#fff;box-shadow:2px 1px 2px 0 var(--z-line);z-index:1030}
.site-header .navbar{min-height:64px;--bs-navbar-padding-y:0}
.site-header .navbar-brand{padding:0;margin-right:0}
.brand-word{font-weight:600;font-size:1.3rem;letter-spacing:-.02em;color:var(--z-ink);line-height:1}
.brand-word span{color:var(--z-blue)}
.site-header .nav-link{color:var(--z-grey);font-size:.9rem;font-weight:400;padding:.5rem 0!important}
@media(min-width:992px){.site-header .navbar-nav{gap:2.6rem}}
.site-header .nav-link:hover,.site-header .nav-link:focus-visible{color:var(--z-blue-text)}
.site-header .nav-link[aria-current="page"]{color:var(--z-blue-text)}
.site-header .navbar-toggler{border:0;padding:.5rem;color:var(--z-grey);box-shadow:none}
.site-header .navbar-toggler:hover{color:var(--z-blue)}
.site-header .navbar-toggler:focus-visible{outline:3px solid var(--z-blue)}
@media(max-width:991.98px){
  .site-header .navbar-collapse{border-top:1px solid var(--z-line);margin:0 calc(-.5*var(--bs-gutter-x));padding:.5rem calc(.5*var(--bs-gutter-x)) 1.25rem}
  .site-header .navbar-nav .nav-link{font-size:1rem;padding:.75rem 0!important;border-bottom:1px solid var(--z-line)}
}

/* ---------- sections & headings ---------- */
.section{padding:5rem 0}
.section-sm{padding:3rem 0}
@media(max-width:767.98px){.section{padding:3.5rem 0}}
.eyebrow{display:inline-block;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;font-weight:500;color:var(--z-grey);margin-bottom:.5rem}
.section-title{font-weight:500;font-size:calc(1.35rem + .9vw);line-height:1.3;margin-bottom:1rem}
@media(min-width:1200px){.section-title{font-size:2rem}}
.page-hero{background:#fff;padding:4.5rem 0 3.5rem;border-bottom:1px solid var(--z-line)}
.hero{background:#fff;padding:4.5rem 0 5rem}
.hl{color:var(--z-blue-text)}

/* portrait: plain image, as zerodha.com uses imagery without decoration */
.portrait{position:relative;max-width:420px;margin-inline:auto}
.portrait img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:var(--bs-border-radius-lg)}

/* stats */
.stat .num{font-size:calc(1.6rem + 1vw);font-weight:500;line-height:1.1;color:var(--z-ink)}
@media(min-width:1200px){.stat .num{font-size:2.4rem}}
.stat .num sup{color:var(--z-blue);font-size:.5em;top:-.9em}

/* cards: flat, hairline border, no shadow */
.card{--bs-card-border-color:var(--z-line);--bs-card-border-radius:var(--bs-border-radius-lg);--bs-card-cap-bg:#fff;box-shadow:none!important}
.card-lift{transition:border-color .2s ease}
.card-lift:hover,.card-lift:focus-within{border-color:#c9dcf3}
.card-img-top.thumb{aspect-ratio:16/10;object-fit:cover;background:var(--z-blue-tint);border-bottom:1px solid var(--z-line)}
.card .stretched-link:focus-visible{outline:none}
.card:has(.stretched-link:focus-visible){outline:3px solid var(--z-blue);outline-offset:2px}
.shadow,.shadow-sm{box-shadow:none!important}
.icon-tile{width:44px;height:44px;border-radius:3px;display:inline-grid;place-items:center;background:var(--z-blue-tint);color:var(--z-blue-text);font-size:1.3rem}
.icon-tile.blue{background:var(--z-blue-tint);color:var(--z-blue-text)}
.meta-list{display:grid;grid-template-columns:6.5rem 1fr;gap:.35rem 1rem;font-size:.9rem;margin:0}
.meta-list dt{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--z-grey);font-weight:500;padding-top:.15rem}
.meta-list dd{margin:0;color:var(--z-ink)}
@media(max-width:400px){.meta-list{grid-template-columns:1fr}.meta-list dd{margin-bottom:.4rem}}

/* public / protected labels */
.badge{font-weight:500;border-radius:3px!important}
.badge-public{background:var(--z-blue-soft);color:#255a9e;border:1px solid #c9dcf3}
.badge-protected{background:var(--z-ink);color:#fff}
.badge-request{background:#fff;color:var(--z-grey);border:1px solid #dcdcdc}
.ico{width:1em;height:1em;flex:none;vertical-align:-.125em}
.lock-thumb{background:var(--z-blue-tint);color:var(--z-blue-text)}
.lock-thumb .thumb-label{color:var(--z-grey)!important}

/* progress bars & legends */
.progress,.progress-stacked{--bs-progress-bar-bg:var(--z-blue);--bs-progress-bg:#eef2f6;--bs-progress-border-radius:3px}
.progress-bar.bg-blue{background:#9cc3ef!important}
.progress-bar.bg-dark-ink{background:var(--z-ink)!important}
.progress-bar.bg-soft{background:#c9dcf3!important}
.legend{display:flex;flex-wrap:wrap;gap:.4rem 1.25rem;font-size:.85rem;color:var(--z-grey)}
.legend i{display:inline-block;width:12px;height:12px;border-radius:2px;margin-right:.4rem;vertical-align:-1px}

/* chips, timeline */
.chip{display:inline-block;font-size:.875rem;padding:.3rem .8rem;margin:0 .35rem .5rem 0;border-radius:3px;background:#fff;border:1px solid #dcdcdc;color:var(--z-ink)}
.chip b{color:var(--z-blue-text);margin-right:.3rem;font-weight:500}
.timeline{position:relative;list-style:none;padding:0;margin:0}
.timeline>li{position:relative;padding:0 0 2rem 2rem;border-left:1px solid #dcdcdc;margin-left:.5rem}
.timeline>li:last-child{padding-bottom:0}
.timeline>li::before{content:"";position:absolute;left:-7px;top:.45rem;width:13px;height:13px;border-radius:50%;background:#fff;border:2px solid var(--z-blue)}
.timeline>li:first-child::before{background:var(--z-blue)}
.timeline .when{font-size:.85rem;color:var(--z-grey)}

/* figures, quotes, tables, steps */
.figure-shot{display:block;border:1px solid var(--z-line);border-radius:var(--bs-border-radius-lg);overflow:hidden;background:#fff;text-decoration:none;color:var(--z-ink);transition:border-color .2s}
.figure-shot:hover{border-color:#c9dcf3;color:var(--z-blue-text)}
.figure-shot img{display:block;width:100%;height:auto}
.pull-quote{border-left:3px solid var(--z-blue);padding:.25rem 0 .25rem 1.25rem;font-size:calc(1.1rem + .4vw);font-weight:400;line-height:1.6;color:var(--z-ink)}
.pull-quote footer{font-size:.8rem;letter-spacing:.04em;text-transform:uppercase;margin-top:.75rem;color:var(--z-grey)}
.table-data{--bs-table-hover-bg:var(--z-blue-tint);font-variant-numeric:tabular-nums}
.table-data thead th{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--z-grey);font-weight:500;white-space:nowrap}
.step-list{counter-reset:s;list-style:none;padding:0;margin:0}
.step-list li{counter-increment:s;display:grid;grid-template-columns:2.75rem 1fr;gap:.75rem;padding:1rem 0;border-top:1px solid var(--z-line)}
.step-list li::before{content:counter(s,decimal-leading-zero);font-weight:500;color:var(--z-blue-text)}
.step-list b{display:block;color:var(--z-ink);font-weight:500}

/* coverage vs agreement chart (QIA case), on the light band */
.dumbbell{display:grid;grid-template-columns:3.5rem 1fr 3.5rem;gap:1rem;align-items:center;margin:1.1rem 0}
.dumbbell .rail{position:relative;height:2px;background:#dcdcdc}
.dumbbell .gap{position:absolute;top:0;height:2px;background:var(--z-blue)}
.dumbbell .dot{position:absolute;top:-6px;width:14px;height:14px;border-radius:50%;transform:translateX(-50%)}
.dumbbell .cov{background:#fff;border:2px solid var(--z-ink)}.dumbbell .agr{background:var(--z-blue)}
.dumbbell .v{text-align:right;font-variant-numeric:tabular-nums;font-size:.9rem}
.axis{display:grid;grid-template-columns:3.5rem 1fr 3.5rem;gap:1rem;font-size:.75rem;color:var(--z-grey)}
.axis div{display:flex;justify-content:space-between}

/* protected gate */
.gate{padding:3.5rem 0 5rem;background:#fff}
.gate-card{border-top:3px solid var(--z-blue)}
.form-control,.form-select{border-color:#dcdcdc;border-radius:3px}
.form-control:focus,.form-select:focus{border-color:var(--z-blue);box-shadow:0 0 0 .2rem rgba(56,126,209,.25)}
.input-group>.form-control,.input-group>.btn{border-radius:3px}

/* CTA band: zerodha.com's light, centred-feel call to action */
.cta-band{background:var(--z-blue-tint);color:var(--z-ink);border-radius:var(--bs-border-radius-lg);border:1px solid #e3eefb}
.cta-band p{color:var(--z-grey)}

/* ---------- footer (zerodha.com: #fbfbfb, #eee top border, 18px/500 headings, 14px #666 links) ---------- */
.site-footer{background:var(--z-footer);border-top:1px solid var(--z-line);color:var(--z-grey);font-size:.875rem}
.site-footer .brand-word{font-size:1.25rem}
.footer-copy{font-size:.8rem;color:var(--z-grey);margin:.9rem 0 1rem;line-height:1.8}
.footer-social{display:inline-grid;place-items:center;width:32px;height:32px;color:var(--z-grey);font-size:1.25rem;text-decoration:none}
.footer-social:hover{color:var(--z-blue)}
.footer-h{font-size:1.125rem;font-weight:500;color:var(--z-ink);margin-bottom:.625rem;line-height:2}
.footer-links{margin:0}
.footer-links li{line-height:1.75rem}
.footer-links a{color:var(--z-grey);text-decoration:none;font-size:.875rem;overflow-wrap:anywhere}
.footer-links a:hover{color:var(--z-blue-text)}
.footer-muted{color:var(--z-grey);font-size:.875rem}
.footer-note{font-size:.75rem;line-height:1.8;color:var(--z-grey-2);margin:0 0 1rem}
.footer-bottom{border-top:1px solid var(--z-line);font-size:.75rem;color:var(--z-grey-2)}
.footer-bottom a{color:var(--z-grey-2);text-decoration:none}
.footer-bottom a:hover{color:var(--z-blue-text)}

/* reveal on scroll (content stays visible without JS) */
.js .rv{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

/* print (resume) */
@media print{
  .site-header,.site-footer,.no-print,.skip-link{display:none!important}
  .js .rv{opacity:1!important;transform:none!important}
  .page-hero,.hero{padding:0 0 1rem;border:0}
  .section{padding:1rem 0}
  .card{break-inside:avoid}
  a{text-decoration:none}
}
