/* ============================================================================
   milestoneaisystems.com - resource/article styles
   Shared structure, this site's identity. Edit HERE, not in generated pages:
   every article and the hub link this one file.
   ========================================================================== */
:root{
  --r-ui:'Segoe UI',system-ui,-apple-system,sans-serif;
  --r-bg:#f5f7fa; --r-panel:#fff; --r-panel-2:#eef2f7; --r-line:#dbe3ec;
  --r-ink:#1a1a2e; --r-muted:#5c6b7d; --r-head:#0a1628;
  --r-accent:#1b3a5c; --r-gold:#c8973e; --r-dark:#0a1628; --r-foot-ink:#c9d3de;
}
*,*::before,*::after{box-sizing:border-box}
body.res{margin:0;background:var(--r-bg);color:var(--r-ink);line-height:1.7;
  font-family:'Segoe UI',system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}
body.res img{max-width:100%;display:block}
body.res a{color:var(--r-accent)}
.res-wrap{max-width:780px;margin:0 auto;padding:0 20px}

/* header */
.res-top{background:var(--r-dark);padding:12px 0}
.res-top .res-wrap{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.res-logo img{height:62px;width:auto}
body.res .res-callbtn{background:var(--r-accent);color:#fff;text-decoration:none;font-weight:700;
  padding:9px 16px;border-radius:999px;font-size:.9rem;font-family:var(--r-ui)}

/* breadcrumbs */
.res-crumbs{background:var(--r-panel-2);border-bottom:1px solid var(--r-line);
  font-size:.85rem;padding:9px 0;font-family:var(--r-ui)}
body.res .res-crumbs a{color:var(--r-muted);text-decoration:none}
.res-crumbs a:hover{text-decoration:underline}
.res-crumbs span{color:var(--r-muted);margin:0 2px}
.res-crumb-current{color:var(--r-ink);font-weight:600}

/* article */
.res-main{background:var(--r-panel);margin:0 auto;padding:34px 20px 60px;max-width:780px}
.res-eyebrow{font-family:var(--r-ui);font-size:.78rem;letter-spacing:.09em;
  text-transform:uppercase;color:var(--r-accent);font-weight:700;margin:0 0 8px}
.res-main h1{font-size:2.1rem;line-height:1.22;color:var(--r-head);margin:0 0 12px}
.res-byline{font-family:var(--r-ui);font-size:.88rem;color:var(--r-muted);margin:0 0 22px}
.res-dot{margin:0 7px;opacity:.5}
.res-excerpt{font-size:1.12rem;color:var(--r-ink);border-left:3px solid var(--r-gold);
  padding-left:16px;margin:0 0 30px}
.res-main h2{font-size:1.42rem;color:var(--r-head);margin:38px 0 12px;line-height:1.3}
.res-main h3{font-size:1.12rem;color:var(--r-head);margin:26px 0 8px}
.res-main p{margin:0 0 16px}
.res-main ul,.res-main ol{margin:0 0 18px;padding-left:24px}
.res-main li{margin-bottom:8px}
.res-main table{width:100%;border-collapse:collapse;margin:0 0 20px;font-size:.94rem}
.res-main th,.res-main td{border:1px solid var(--r-line);padding:9px 11px;text-align:left}
.res-main th{background:var(--r-panel-2);font-family:var(--r-ui)}
.res-tablewrap{overflow-x:auto;margin:0 0 20px}

/* CTA - one component, tracked from inception */
.res-cta{background:var(--r-panel-2);border:1px solid var(--r-line);
  border-left:4px solid var(--r-accent);border-radius:12px;padding:22px 24px;margin:34px 0}
.res-cta h2{margin:0 0 8px;font-size:1.2rem;color:var(--r-head)}
.res-cta p{margin:0 0 16px;color:var(--r-muted);font-size:.97rem}
body.res .res-cta-btn{display:inline-block;background:var(--r-accent);color:#fff;font-weight:700;
  text-decoration:none;padding:13px 26px;border-radius:8px;font-family:var(--r-ui)}
.res-cta-btn:hover{filter:brightness(1.08)}
.res-cta-btn--phone{font-size:1.15rem;letter-spacing:.01em}

/* FAQ */
.res-faq details{border:1px solid var(--r-line);border-radius:10px;padding:12px 16px;margin-bottom:10px;
  background:var(--r-panel-2)}
.res-faq summary{cursor:pointer;font-weight:700;color:var(--r-head);font-family:var(--r-ui)}
.res-faq details[open] summary{margin-bottom:9px}

/* related */
.res-related{margin:44px 0 0;border-top:1px solid var(--r-line);padding-top:24px}
.res-related ul{list-style:none;padding:0;margin:0}
.res-related li{margin-bottom:14px}
.res-related a{text-decoration:none;display:block}
body.res .res-related a b{display:block;color:var(--r-head);font-size:1.02rem}
.res-related a:hover b{text-decoration:underline}
.res-related span{display:block;color:var(--r-muted);font-size:.92rem;margin-top:3px}

/* author + sources + disclaimer */
.res-author{display:flex;gap:16px;align-items:flex-start;background:var(--r-panel-2);
  border:1px solid var(--r-line);border-radius:12px;padding:20px;margin:38px 0 0}
.res-author img{width:78px;height:78px;border-radius:50%;object-fit:cover;flex:none}
.res-author p{margin:8px 0 0;font-size:.93rem;color:var(--r-muted)}
.res-author-title{font-size:.88rem;color:var(--r-muted);font-family:var(--r-ui)}
.res-sources{margin:32px 0 0;font-size:.9rem}
.res-sources h2{font-size:1.02rem;margin-bottom:8px}
.res-sources ul{padding-left:20px}
.res-sources span{color:var(--r-muted);font-size:.84rem}
/* Required disclosure - lives in the FOOTER (dark), matching where the landing
   pages put it. Muted but legible; never hide it or shrink it below readability. */
.res-foot .res-disclaimer{margin:18px 0 0;font-size:.78rem;line-height:1.55;
  color:var(--r-foot-ink);opacity:.9;max-width:74ch;
  border-top:1px solid rgba(255,255,255,.14);padding-top:14px}
.res-foot .res-disclaimer a{color:var(--r-gold)}

/* hub */
.res-hub-intro{font-size:1.1rem;color:var(--r-muted);margin:0 0 30px}
.res-cat{margin-bottom:34px}
.res-cat h2{font-size:1.18rem;color:var(--r-head);border-bottom:2px solid var(--r-gold);
  padding-bottom:6px;margin:0 0 14px}
.res-cards{list-style:none;padding:0;margin:0}
.res-cards li{margin-bottom:15px}
.res-cards a{display:block;text-decoration:none;border:1px solid var(--r-line);
  border-radius:10px;padding:15px 17px;background:var(--r-panel)}
.res-cards a:hover{border-color:var(--r-accent)}
body.res .res-cards b{display:block;color:var(--r-head);font-size:1.03rem;margin-bottom:4px}
.res-cards span{display:block;color:var(--r-muted);font-size:.93rem}
.res-cards time{display:block;color:var(--r-muted);font-size:.8rem;margin-top:7px;font-family:var(--r-ui)}
.res-empty{color:var(--r-muted);font-style:italic}

/* footer */
.res-foot{background:var(--r-dark);color:var(--r-foot-ink);padding:28px 0 34px;
  font-size:.9rem;font-family:var(--r-ui);margin-top:50px}
body.res .res-foot a{color:var(--r-gold)}

@media(max-width:640px){
  .res-main{padding:24px 18px 44px}
  .res-main h1{font-size:1.62rem}
  .res-author{flex-direction:column}
  .res-cta{padding:18px}
}

/* ============================================================================
   Industry conversion pages (/industries/<slug>/)
   Conversion pages, not articles: wider hero, problem-led, CTA above the fold.
   ========================================================================== */
.ind-hero{background:linear-gradient(160deg,var(--r-dark) 0%,#132c47 100%);color:#fff;
  padding:46px 0 42px}
.ind-hero .res-eyebrow{color:var(--r-gold)}
.ind-hero h1{font-size:2.3rem;line-height:1.18;margin:0 0 14px;color:#fff;max-width:20ch}
.ind-sub{font-size:1.14rem;color:#c9d6e4;margin:0 0 26px;max-width:56ch}
.ind-hero .res-cta{background:transparent;border:0;border-left:0;padding:0;margin:0}
.ind-hero .res-cta h2,.ind-hero .res-cta p{display:none}
.ind-hero .res-cta-btn{background:var(--r-gold);color:var(--r-dark);font-size:1.16rem;padding:15px 30px}

body.ind .res-main{padding-top:38px}
.ind-problems ul{list-style:none;padding:0}
.ind-problems li{position:relative;padding-left:30px;margin-bottom:11px}
.ind-problems li::before{content:"\2715";position:absolute;left:6px;top:1px;
  color:#c0392b;font-weight:700}
.ind-solution p{font-size:1.09rem}
.ind-caps dl{margin:0}
.ind-caps dt{font-weight:700;color:var(--r-head);margin-top:16px;font-family:var(--r-ui)}
.ind-caps dt::before{content:"\2713";color:#2e8b57;font-weight:700;margin-right:9px}
.ind-caps dd{margin:3px 0 0 27px;color:var(--r-muted)}
.ind-proof{margin:38px 0;padding:22px 26px;background:var(--r-panel-2);
  border-left:4px solid var(--r-gold);border-radius:10px}
.ind-proof p{font-size:1.08rem;font-style:italic;margin:0 0 10px}
.ind-proof cite{font-style:normal;font-size:.9rem;color:var(--r-muted);font-family:var(--r-ui)}
.res-cta--hero{margin:0}
.res-cta--page-end{border-left-color:var(--r-gold)}

@media(max-width:640px){
  .ind-hero{padding:32px 0 30px}
  .ind-hero h1{font-size:1.68rem}
  .ind-sub{font-size:1.02rem}
}