/* The homepage's featured Workflows: three teaser cards, one per industry in
   hero order, rendered from the `featuredWorkflows` collection
   (eleventy.config.js). Replaces scenarios.css, which styled the sector-grid
   catalogue this section replaced. Static on purpose, as that section was: the
   capability rows above carry the motion and this section contrasts with them
   by holding still. Loaded from the shared head, so every page fetches it, but
   only the homepage carries these classes. */
.featured-workflows.section{padding-top:80px;padding-bottom:84px}
.featured-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:8%;align-items:end}
.featured-workflows h2{font-size:clamp(2.2rem,3.4vw,3.4rem)}
.featured-workflows h2 em{font-family:'DM Serif Display',Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-.035em}
.featured-intro>p{max-width:490px;font-size:1rem}

.featured-cards{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.featured-card{display:flex;flex-direction:column;min-width:0}
.featured-image{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border-radius:4px;margin-bottom:20px}
.featured-industry{font-family:'DM Sans',sans-serif;font-size:.7rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--copper);line-height:1.6;margin:0 0 16px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.featured-title{font-size:1.125rem;font-weight:600;line-height:1.35;letter-spacing:-.025em;margin:0 0 18px;text-wrap:balance}
.featured-title a:hover,.featured-title a:focus-visible{color:var(--copper)}

.featured-teaser{margin:0;display:grid;gap:18px}
.featured-teaser div{min-width:0;padding-bottom:18px;border-bottom:1px solid var(--line)}
.featured-teaser dt{font-size:.6875rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--muted);line-height:1.6}
.featured-teaser dd{margin:4px 0 0;font-size:.9375rem;line-height:1.55;color:var(--muted)}

.featured-link{width:fit-content;margin-top:auto;padding-top:24px;font-size:.875rem;color:var(--ink)}
.featured-link>span:last-child{margin-left:10px}
.featured-link:hover,.featured-link:focus-visible{color:var(--copper)}

.featured-more{margin-top:44px;font-size:.9375rem}
.featured-more a{border-bottom:1px solid var(--ink);color:var(--ink);padding-bottom:4px}
.featured-more a span{margin-left:12px}
.featured-note{margin-top:36px;font-size:.75rem;color:#667168}

/* Draft marker on a card. A featured page that is still a draft carries
   <mark class="to-confirm">to confirm</mark> in its teaser fields as it does in
   its prose, and the homepage does not load workflows.css, where the rule for
   it lives, so the same treatment is repeated here. The publish gate strips
   the elements before flipping the page's draft flag, so this then matches
   nothing. */
.featured-teaser .to-confirm{display:inline-block;vertical-align:baseline;font-size:.6875rem;font-weight:700;letter-spacing:.09em;text-transform:uppercase;line-height:1.3;color:#7b4929;background:#f5eadb;border:1px solid #e1b18b;border-radius:2px;padding:2px 6px;margin-left:6px}

@media(max-width:1050px){.featured-cards{gap:28px}}
@media(max-width:760px){.featured-workflows.section{padding-top:60px;padding-bottom:60px}.featured-intro{grid-template-columns:1fr;gap:18px}.featured-workflows h2{font-size:2.4rem}.featured-cards{grid-template-columns:1fr;gap:32px;margin-top:32px}.featured-more{margin-top:36px}}
