/* ==========================================================================
   weeklybusinessdeal.com - site.css
   Overrides layered on top of Bulma 1.0.2 (CDN). Mobile-first: base rules
   target a 360px screen, wider layouts arrive at 480 / 768 / 1024px.
   Light theme only: every colour below is set explicitly.
   ========================================================================== */

:root{color-scheme:only light}

:root{
  --ink:#000000;
  --text:#1c1c1c;
  --muted:#595959;
  --rule:#cfcfcf;
  --rule-strong:#b9b9b9;
  --paper:#ffffff;
  --cream:#f1e9df;
  --bar:#1a1a1a;
  --caramel:#93631f;
  --caramel-dark:#74500f;
  --caramel-text:#8a5a14;
  --green:#33701a;
  --green-line:#5ca03a;
  --grey:#e8e8e8;
  --serif:"Times New Roman",Times,"Liberation Serif",Tinos,Georgia,serif;
  --sans:Arial,Helvetica,"Liberation Sans",Arimo,sans-serif;
  --cond:"Arial Narrow","Franklin Gothic Medium","Helvetica Neue",Arial,sans-serif;
  --measure:46rem;
  --gutter:16px;
}

/* ---------- base / reset (works with or without Bulma loaded) ---------- */
*,*::before,*::after{box-sizing:border-box}

html{
  background-color:#ffffff;
  color:#1c1c1c;
  font-size:100%;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  scroll-behavior:smooth;
}

html body{
  margin:0;
  background-color:#ffffff;
  color:#1c1c1c;
  font-family:"Times New Roman",Times,"Liberation Serif",Tinos,Georgia,serif;
  font-size:1.0625rem;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-wrap:break-word;
}

html body :where(header,main,section,article,aside,footer,nav,figure,div){
  background-color:transparent;
  color:inherit;
}

html body p,
html body ul,
html body ol,
html body figure,
html body blockquote,
html body h1,html body h2,html body h3,html body h4{
  margin:0;
  padding:0;
}

html body ul,html body ol{list-style:none}

html body strong{color:inherit;font-weight:700}
html body em{color:inherit}

img,video,svg{max-width:100%}
img{height:auto;display:block}

a{color:#74500f;text-underline-offset:.16em;text-decoration-thickness:1px;transition:color .18s ease,background-color .18s ease,transform .18s ease,box-shadow .18s ease}
a:hover{color:#000000}
a:focus-visible,
button:focus-visible{outline:3px solid #1a1a1a;outline-offset:3px;border-radius:2px}

.skip-link{
  position:absolute;left:8px;top:-100px;z-index:50;
  background-color:#ffffff;color:#000000;
  padding:12px 16px;border-radius:4px;
  font:700 .9375rem/1.2 var(--sans);
  box-shadow:0 2px 8px rgba(0,0,0,.4);
}
.skip-link:focus{top:8px;color:#000000}

.wrap,
html body .section .container.wrap{
  width:100%;
  max-width:1280px;
  margin-left:auto;margin-right:auto;
  padding-left:var(--gutter);padding-right:var(--gutter);
}

/* ---------- masthead: thin black bar, tiny letter-spaced label ---------- */
.masthead{background-color:#1a1a1a;color:#ffffff}
.masthead-inner{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:44px;
  max-width:1280px;margin:0 auto;
  padding:0 var(--gutter);
  background-color:#1a1a1a;color:#ffffff;
}
.site-name{
  display:inline-flex;align-items:center;min-height:44px;
  font:700 .9375rem/1 var(--serif);
  letter-spacing:.03em;
  color:#ffffff;text-decoration:none;
}
a.site-name:hover{color:#ffffff;text-decoration:underline;text-underline-offset:4px}
a.site-name:focus-visible{outline-color:#ffffff}
.ad-label{
  font:700 .6875rem/1 var(--serif);
  letter-spacing:.22em;text-transform:uppercase;
  color:#ffffff;white-space:nowrap;
}

/* ---------- article section / two-column grid ---------- */
.section.article-section{
  padding:28px 0 56px;
  background-color:#ffffff;color:#1c1c1c;
}

main .columns.article-layout{
  display:block;
  margin:0;
}
main .columns.article-layout > .column{
  display:block;
  width:100%;
  padding:0;
  min-width:0;
}
main .columns.article-layout > .column.sidebar{display:none}

.article{background-color:#ffffff;color:#1c1c1c}
.article-head{background-color:#ffffff;color:#1c1c1c}
.figure-hero{margin-top:0}

/* kicker + headline + byline */
.kicker{
  margin:0 0 12px;
  font:700 .75rem/1.4 var(--sans);
  letter-spacing:.14em;text-transform:uppercase;
  color:#8a5a14;
}
.headline{
  margin:0;
  padding-bottom:20px;
  border-bottom:1px solid #b9b9b9;
  font-family:var(--serif);
  font-weight:700;
  font-size:clamp(1.65rem,1.2rem + 2.2vw,2.4rem);
  line-height:1.3;
  letter-spacing:-.005em;
  color:#000000;
}

.byline{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:4px 20px;
  margin:16px 0 18px;
  font-size:.9375rem;line-height:1.5;
  color:#333333;
}
.byline-by{display:flex;flex-wrap:wrap;align-items:center;gap:0 10px}
.byline-by .sep{display:none;width:1px;height:1em;background-color:#7a7a7a}
.read-time{display:inline-flex;align-items:center;gap:8px;color:#333333;font-size:.9375rem;letter-spacing:.02em}
.read-time svg{flex:0 0 22px;width:22px;height:22px}

/* beige lede box (dek) and notebook note share the same component */
.dek,
.note{
  margin:0 0 20px;
  padding:12px 16px;
  background-color:#f1e9df;
  color:#1a1a1a;
  font-family:var(--sans);
  font-style:italic;
  font-size:1.0625rem;
  line-height:1.7;
  box-shadow:0 1px 6px rgba(0,0,0,.42);
}
.note{margin:2em 0;max-width:var(--measure)}
.note-label{
  display:block;margin:0 0 4px;
  font:700 .75rem/1.4 var(--sans);font-style:normal;
  letter-spacing:.14em;text-transform:uppercase;
  color:#74500f;
}
.article-body .note p{margin:0;max-width:none;color:#1a1a1a}

/* media */
.figure{margin:0 0 28px;background-color:#ffffff}
.figure img{width:100%;height:auto}
.figure-wide{margin:2em 0 2.2em}
.figcaption{
  margin:8px 0 0;
  font:italic .875rem/1.5 var(--sans);
  color:#595959;
}
.media-frame{
  position:relative;
  width:100%;
  aspect-ratio:1200 / 630;
  background-color:#e6e0d6;
  overflow:hidden;
}
.media-frame video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;display:block;
  background-color:#e6e0d6;
}

/* article body */
.article-body{background-color:#ffffff;color:#1c1c1c}
.article-body p{
  max-width:var(--measure);
  margin:0 0 1.2em;
  color:#1c1c1c;
}
.article-body h2{
  max-width:var(--measure);
  margin:2.1em 0 .7em;
  scroll-margin-top:16px;
  font-family:var(--serif);
  font-weight:700;
  font-size:clamp(1.4rem,1.15rem + 1.1vw,1.75rem);
  line-height:1.3;
  color:#000000;
}
.article-body h2 + p{margin-top:0}
.article-body p strong{color:#000000}

/* numbered steps with run-in bold lead-ins */
.steps{
  list-style:none;
  counter-reset:step;
  max-width:var(--measure);
  margin:0 0 1.6em;padding:0;
}
.steps li{
  counter-increment:step;
  position:relative;
  margin:0 0 1.1em;
  padding-left:2.7rem;
}
.steps li::before{
  content:counter(step);
  position:absolute;left:0;top:.15em;
  width:1.9rem;height:1.9rem;
  border-radius:50%;
  background-color:#93631f;color:#ffffff;
  font:700 .95rem/1.9rem var(--sans);text-align:center;
}

/* skill stack (beige banner rows, as in the primary's feature stack) */
.skill-stack{
  list-style:none;
  max-width:var(--measure);
  margin:1.5em 0 2em;padding:0;
  display:grid;gap:8px;
}
.skill-stack li{
  display:flex;align-items:center;gap:16px;
  padding:18px 18px;
  border-radius:6px;
  background-color:#f4ece0;
  background-image:linear-gradient(90deg,#f1e6d6,#f9f4ea);
  color:#1c1c1c;
}
.skill-stack li:nth-child(2){background-color:#efe2cf;background-image:linear-gradient(90deg,#ecdcc4,#f7efe2)}
.skill-stack li:nth-child(3){background-color:#f2e4d8;background-image:linear-gradient(90deg,#efdccd,#f9f1e8)}
.skill-icon{flex:0 0 48px;width:48px;height:48px}
.skill-title{display:block;font:700 1.1875rem/1.25 var(--serif);color:#111111}
.skill-sub{display:block;margin-top:2px;font:.9375rem/1.5 var(--sans);color:#404040}

/* ---------- calls to action ---------- */
.cta-block{
  max-width:var(--measure);
  margin:2.2em 0;
  text-align:center;
}
.cta-button{
  display:inline-flex;align-items:center;justify-content:center;gap:.5em;
  width:100%;
  min-height:52px;
  padding:.8em 1.2em;
  border:0;border-radius:6px;
  background-color:#93631f;color:#ffffff;
  font:700 1.0625rem/1.3 var(--serif);
  text-align:center;text-decoration:none;
  box-shadow:0 2px 0 rgba(0,0,0,.18);
}
.cta-button::after{content:"\00BB";font-size:1.35em;line-height:1}
.cta-button:hover{background-color:#74500f;color:#ffffff;transform:translateY(-1px);box-shadow:0 4px 10px rgba(0,0,0,.22)}
.cta-button:active{transform:translateY(0)}
.cta-button:focus-visible{outline:3px solid #1a1a1a;outline-offset:3px;border-radius:6px}

.after-cta,
.article-body .after-cta{
  max-width:34rem;
  margin:1rem auto 0;
  font:.8125rem/1.5 var(--sans);
  color:#595959;
  text-align:center;
}

/* ---------- FAQ accordion (accent: grey panels, condensed bold, green mark) ---------- */
.faq{max-width:var(--measure);margin:1.4em 0 2em}
.faq-item{
  margin:0 0 8px;
  background-color:#e8e8e8;
  color:#2a2a2a;
  border-left:4px solid #5ca03a;
}
.faq-h{margin:0;font:inherit}
.faq-q{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  width:100%;min-height:56px;
  margin:0;padding:12px 16px;
  background-color:transparent;color:#2a2a2a;
  border:0;border-radius:0;cursor:pointer;
  font:700 1.1875rem/1.25 var(--cond);
  letter-spacing:.01em;text-align:left;
  transition:background-color .18s ease;
}
.faq-q:hover{background-color:#dedede}
.faq-q:focus-visible{outline:3px solid #1a1a1a;outline-offset:-3px}
.faq-icon{position:relative;flex:0 0 22px;width:22px;height:22px}
.faq-icon::before,
.faq-icon::after{
  content:"";position:absolute;left:50%;top:50%;
  background-color:#33701a;border-radius:1px;
  transition:transform .2s ease,opacity .2s ease;
}
.faq-icon::before{width:16px;height:3px;margin:-1.5px 0 0 -8px}
.faq-icon::after{width:3px;height:16px;margin:-8px 0 0 -1.5px}
.faq-item.is-open .faq-icon::after{transform:scaleY(0);opacity:0}
.faq-a{
  padding:0 16px 16px;
  background-color:#e8e8e8;color:#222222;
  font:italic 1.0625rem/1.65 var(--serif);
}
.article-body .faq-a p{max-width:none;margin:0;color:#222222}
.faq-a[hidden]{display:none}

/* ---------- sidebar (desktop only) ---------- */
.sidebar{display:none;background-color:#ffffff;color:#1c1c1c}
.side-heading{
  margin:0 0 12px;
  font:700 1.375rem/1.3 var(--serif);
  color:#000000;
}
.toc{list-style:none;margin:0;padding:0}
.toc li{border-top:1px solid #d6d6d6}
.toc li:last-child{border-bottom:1px solid #d6d6d6}
.toc a{
  display:flex;align-items:baseline;gap:.7em;
  padding:9px 0;
  font:1rem/1.4 var(--serif);
  color:#1c1c1c;text-decoration:none;
}
.toc a span{flex:0 0 auto;min-width:1.5em;font:700 .8125rem/1.4 var(--sans);color:#74500f}
.toc a:hover{color:#74500f;text-decoration:underline;text-underline-offset:3px}
.side-card{
  position:sticky;top:20px;
  margin-top:30px;padding-top:28px;
  border-top:1px solid #b9b9b9;
  text-align:center;
  background-color:#ffffff;
}
.side-card-title{
  margin:0 0 14px;
  font:700 1.375rem/1.3 var(--serif);
  color:#111111;
  text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1.5px;
}
.side-card svg{display:block;width:100%;height:auto}
.side-card-caption{margin:14px 0 14px;font:700 1.0625rem/1.4 var(--serif);color:#111111}
.side-card .cta-button{font-size:1rem}
.side-card .after-cta{margin-top:.9rem}

/* ---------- footer: publisher imprint, no panel, no border ---------- */
footer.footer{
  margin:0;
  padding:8px var(--gutter) 56px;
  background-color:#ffffff;
  color:#595959;
  border:0;
  font:.8125rem/1.65 var(--sans);
}
.footer-inner{max-width:1280px;margin:0 auto}
.publisher{margin:0 0 18px;color:#595959;font-style:normal}
.publisher p{margin:0;color:#595959;font:.8125rem/1.65 var(--sans)}
.publisher .publisher-name{font-weight:700;color:#333333}
.footer .links{
  display:flex;flex-wrap:wrap;gap:0 22px;
  margin:0 0 14px;padding:0;
}
.footer .links a{
  display:inline-flex;align-items:center;min-height:44px;
  color:#3d3d3d;font:.8125rem/1.4 var(--sans);
  text-decoration:underline;text-underline-offset:3px;
}
.footer .links a:hover{color:#000000}
.footer .closing_note{
  max-width:62rem;margin:0;
  color:#595959;font:.8125rem/1.7 var(--sans);
}

/* ---------- legal / about pages ---------- */
.legal{padding:32px 0 56px;background-color:#ffffff;color:#1c1c1c}
.legal-inner{max-width:var(--measure);background-color:#ffffff}
.back-link{
  display:inline-flex;align-items:center;min-height:44px;
  margin:0 0 8px;
  font:.9375rem/1.3 var(--sans);color:#74500f;
}
.legal h1{
  margin:0 0 10px;
  font-family:var(--serif);font-weight:700;
  font-size:clamp(1.7rem,1.3rem + 1.8vw,2.3rem);
  line-height:1.25;color:#000000;
}
.dateline{
  margin:0 0 26px;padding-bottom:18px;
  border-bottom:1px solid #b9b9b9;
  font:.9375rem/1.5 var(--sans);color:#595959;
}
.page-lede{
  margin:0 0 26px;padding-bottom:18px;
  border-bottom:1px solid #b9b9b9;
  font:italic 1.0625rem/1.6 var(--sans);color:#404040;
}
.legal h2{
  margin:1.9em 0 .55em;
  font:700 1.3rem/1.3 var(--serif);color:#000000;
}
.legal p{margin:0 0 1.1em;color:#1c1c1c}
.legal ul{list-style:disc;margin:0 0 1.2em;padding-left:1.35em}
.legal li{margin:0 0 .45em;color:#1c1c1c;padding-left:.2em}
.legal address{font-style:normal;margin:0 0 1.2em;padding:0;color:#1c1c1c}
.legal address p{margin:0}

/* ==========================================================================
   >= 480px
   ========================================================================== */
@media (min-width:480px){
  .byline-by .sep{display:inline-block}
  .cta-button{width:auto;min-width:19rem;padding:.8em 1.8em}
  .dek,.note{font-size:1.125rem;padding:12px 18px}
  .masthead-inner{min-height:48px}
}

/* ==========================================================================
   >= 768px
   ========================================================================== */
@media (min-width:768px){
  :root{--gutter:30px}
  html body{font-size:1.125rem}
  .section.article-section{padding:40px 0 80px}
  .headline{font-size:clamp(2rem,1.2rem + 2vw,2.4rem);line-height:1.4;padding-bottom:26px}
  .byline{margin:18px 0 20px}
  .dek,.note{font-size:1.1875rem;line-height:1.75}
  .figure{margin-bottom:34px}
  .article-body h2{margin-top:2.4em}
  .skill-stack li{padding:22px 26px;gap:22px}
  .skill-icon{flex-basis:56px;width:56px;height:56px}
  .skill-title{font-size:1.375rem}
  .faq-q{font-size:1.3125rem;padding:14px 20px}
  .faq-a{padding:0 20px 20px;font-size:1.125rem}
  .legal{padding:48px 0 80px}
  footer.footer{padding-top:16px;padding-bottom:72px}
}

/* ==========================================================================
   >= 1024px: article + sticky sidebar (primary reference grid)
   ========================================================================== */
@media (min-width:1024px){
  main .columns.article-layout{
    display:flex;
    align-items:stretch;
    gap:56px;
  }
  main .columns.article-layout > .column.article{flex:1 1 0;width:auto}
  main .columns.article-layout > .column.sidebar{
    display:block;
    flex:0 0 335px;
    width:335px;
    padding-top:6px;
  }
}
