@layer components {
  .industry-hero { padding: 3.5rem 0 4rem; background: linear-gradient(165deg, var(--paper) 45%, var(--mint-light)); }
  .industry-hero--education { background: linear-gradient(165deg, var(--paper) 45%, var(--lilac-light)); }
  .industry-hero--hospitality { background: linear-gradient(165deg, var(--paper) 45%, var(--yellow-light)); }
  .industry-back { display: inline-block; text-decoration: none; margin-bottom: 1.5rem; }
  .industry-back:hover { text-decoration: underline; text-underline-offset: .3rem; }
  .industry-heading { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 3.5rem; margin-bottom: 3rem; }
  .industry-heading h1 { font-size: clamp(2.8rem, 5.1vw, 4.7rem); line-height: 1.03; letter-spacing: -.055em; margin: 0; }
  .industry-heading h1 em { color: var(--coral-ink); }
  .industry-heading .lead { font-size: 1.1rem; max-width: 34rem; margin-top: 0; }
  .industry-heading .actions { gap: 1.4rem; }
  .industry-audience { color: var(--muted); font-size: .8rem; margin: 1rem 0 0; }
  .product-preview--industry { max-width: 75rem; margin-inline: auto; }
  .product-preview--industry .product-preview__stage::before { opacity: .4; }
  .product-preview--industry .product-preview__footer { margin-top: 1.3rem; }
  .product-preview--industry[data-playing="true"] .product-screen__cursor { animation-name: preview-cursor-rota; }
  @keyframes preview-cursor-rota {
    0%, 12% { opacity: 0; left: 83%; top: 22%; }
    30%, 58% { opacity: 1; left: 70%; top: 57%; }
    85%, 94% { opacity: 1; left: 93%; top: 21%; }
    100% { opacity: 0; left: 93%; top: 21%; }
  }
  .screen-dialog__views { width: fit-content; margin: .6rem 1rem; }
  .industry-workflow { background: var(--white); }
  .industry-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2rem; list-style: none; padding: 0; margin: 2.5rem 0 0; }
  .industry-steps li { margin: 0; border-top: 1px solid var(--line); padding-top: 1.25rem; }
  .industry-step-number { display: block; color: var(--coral-ink); font: 500 2.5rem var(--font-display); margin-bottom: 1rem; }
  .industry-steps h3 { font-size: 1.3rem; letter-spacing: -.025em; }
  .industry-steps p, .industry-features p { color: var(--muted); font-size: .95rem; }
  .industry-detail { background: var(--mint-light); }
  .industry-features { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; margin: 2.5rem 0 1.5rem; }
  .industry-features article { border-top: 1px solid var(--line); padding-top: 1.5rem; }
  .industry-features h3 { font-size: 1.4rem; }
  .industry-service-lines article { border-top: 1px solid var(--line); padding: 1.25rem 0 .5rem; }
  .industry-service-lines h3 { font-size: 1.3rem; }
  .industry-service-lines p { font-size: .95rem; color: var(--muted); }
  .industry-related { padding-block: 2.5rem; border-top: 1px solid var(--line); }
  .industry-related nav { display: flex; gap: 1rem 2rem; flex-wrap: wrap; margin-top: 1rem; }
  .industry-related a { font-size: .95rem; font-weight: 600; text-decoration: none; padding: .5rem 0; }
  .industry-related a:hover { text-decoration: underline; text-underline-offset: .3rem; }
  .template-card--education { background: var(--lilac-light); }
  .template-card--hospitality { background: var(--yellow-light); }
  .template-card__photo--product { background: var(--pale); padding: 1rem 1rem 0; }
  .template-card__photo--product img { object-position: top left; border: 1px solid var(--line); border-radius: .5rem .5rem 0 0; }
  @media (max-width: 900px) {
    .industry-heading { gap: 2rem; }
    .industry-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .industry-features { gap: 1.5rem; }
  }
  @media (max-width: 760px) {
    .industry-hero { padding-block: 2rem 2.5rem; }
    .industry-heading { grid-template-columns: 1fr; gap: 1.25rem; margin-bottom: 2rem; }
    .industry-heading h1 { font-size: clamp(2.65rem, 10vw, 3.6rem); }
    .industry-heading .lead { font-size: 1rem; }
    .industry-back { margin-bottom: 1rem; font-size: .65rem; }
    .industry-features { grid-template-columns: 1fr; gap: .5rem; }
    .product-preview--industry .product-preview__footer { align-items: flex-start; flex-direction: column; gap: .75rem; }
    .product-preview--industry .product-preview__controls { width: 100%; justify-content: space-between; }
    .industry-related nav { gap: .25rem 1.5rem; }
  }
  @media (max-width: 540px) {
    .industry-steps { grid-template-columns: 1fr; gap: 1rem; }
    .industry-step-number { margin-bottom: .5rem; font-size: 2rem; }
    .screen-dialog__views { position: sticky; left: .5rem; }
    .product-preview--industry .screen-dialog > img { width: 1440px; min-width: 1440px; }
    .product-preview--industry .product-preview__switch button { padding-inline: .65rem; }
  }
  @media (prefers-reduced-motion: reduce) {
    .product-preview--industry[data-playing="true"] .product-screen__cursor { display: none; animation: none; }
  }
}

@layer components {
  .industry-hero--construction { background: linear-gradient(165deg, var(--paper) 45%, var(--pale)); }
  .industry-preview-heading { display: flex; align-items: end; justify-content: space-between; gap: 1rem; margin-bottom: .9rem; }
  .industry-preview-heading p { margin: .25rem 0 0; color: var(--muted); font-size: .85rem; }
  .industry-preview-heading > a { font-size: .8rem; white-space: nowrap; }
  .industry-preview-controls { margin-bottom: 1rem; justify-content: space-between; }
  .industry-preview-controls .product-preview__switch { flex: 1; }
  .industry-preview-controls .product-preview__switch button { flex: 1; }
  .industry-compliance { background: var(--mint-light); }
  .industry-compliance--healthcare { background: var(--mint-light); }
  .industry-compliance--education { background: var(--lilac-light); }
  .industry-compliance--hospitality { background: var(--yellow-light); }
  .industry-compliance--construction { background: var(--pale); }
  .industry-compliance-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; margin-block: 2.5rem; }
  .industry-compliance-grid--four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .industry-compliance-grid article { border-top: 1px solid var(--line); padding-top: 1.5rem; }
  .industry-check-index { display: block; font: 500 .8rem var(--font-display); color: var(--coral-ink); margin-bottom: 1.25rem; }
  .industry-compliance-grid h3 { font-size: 1.3rem; margin-bottom: .75rem; }
  .industry-compliance-grid p { color: var(--muted); font-size: .95rem; }
  .industry-compliance-context { max-width: 60rem; padding-block: 1rem; border-top: 1px solid var(--line); }
  .industry-compliance-context > p { color: var(--muted); font-size: .85rem; line-height: 1.6; }
  .industry-source-links { display: flex; flex-wrap: wrap; gap: .65rem 1.5rem; }
  .industry-source-links a { color: var(--ink); text-underline-offset: .25rem; }
  .industry-compliance-next { display: flex; gap: 1.5rem; flex-wrap: wrap; align-items: center; justify-content: space-between; border-top: 1px solid var(--line); padding-top: 1.5rem; }
  .industry-compliance-next p { margin: 0; font-weight: 600; }
  .industry-compliance-link { margin-block: 1.5rem; color: var(--muted); }
  .industry-compliance-link a { color: var(--ink); font-weight: 600; text-underline-offset: .25rem; }
  @media (max-width: 760px) {
    .industry-compliance-grid { grid-template-columns: 1fr; gap: 1.2rem; }
    .industry-check-index { margin-bottom: .5rem; }
    .industry-preview-controls { align-items: flex-start; }
    .industry-preview-controls .product-preview__switch { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .industry-preview-heading .eyebrow { font-size: .65rem; }
    .product-preview--industry .screen-dialog__views { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: min(32rem, calc(100vw - 4rem)); }
  }
}