/* Home page styles for the modular CNC platform. */
.cnc-hero { padding: 155px 0 80px; background: radial-gradient(ellipse at 80% 30%, rgba(0,212,255,.09), transparent 55%); }
.cnc-hero h1 { font-family: var(--font-heading); font-size: clamp(2.4rem, 4.5vw, 4.6rem); font-weight: 800; line-height: 1.12; letter-spacing: -.04em; margin-bottom: 24px; }
.cnc-lead { color: #b4bfd1; font-size: 1.08rem; max-width: 52ch; }
.cnc-actions { display: flex; flex-wrap: wrap; gap: 14px; margin: 30px 0; }
.cnc-hero-specs { display: flex; flex-wrap: wrap; gap: 10px 20px; color: #b4bfd1; font-size: .8rem; }
.cnc-hero-specs span::before { content: ''; display: inline-block; width: 5px; height: 5px; background: var(--brand-cyan); border-radius: 50%; vertical-align: middle; margin-right: 8px; }
.cnc-machine { margin: 0; border: 1px solid #2b3548; border-radius: 24px; overflow: hidden; background: var(--brand-dark2); }
.cnc-machine img { display: block; width: 100%; height: auto; }
.cnc-machine figcaption { padding: 18px 22px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; font-size: .75rem; color: #b4bfd1; }
.cnc-machine figcaption span:first-child { color: var(--brand-cyan); }
.cnc-section-heading { margin-bottom: 36px; }
.cnc-modules, .cnc-customize { background: #0d1321; }
.cnc-card { height: 100%; padding: 28px; border: 1px solid #293347; border-radius: 18px; background: linear-gradient(135deg, #151e2e, #111827); }
.cnc-card-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 28px; }
.cnc-card-top i, .cnc-tool > i { color: var(--brand-cyan); font-size: 1.5rem; }
.cnc-card-top span { color: #8b9ab4; font-size: .8rem; }
.cnc-card h3, .cnc-foundation h3, .cnc-steps h3 { font-family: var(--font-heading); font-weight: 700; font-size: 1.2rem; margin-bottom: 12px; line-height: 1.4; }
.cnc-card p, .cnc-foundation p, .cnc-steps p { color: #b4bfd1; font-size: .92rem; margin: 0; }
.cnc-foundation { border-top: 1px solid #293347; border-bottom: 1px solid #293347; }
.cnc-tool { display: flex; align-items: flex-start; gap: 22px; }
.cnc-tool > i { margin-top: 5px; width: 28px; flex-shrink: 0; text-align: center; }
.cnc-optional { color: var(--brand-pink-light); text-transform: uppercase; font-size: .65rem; letter-spacing: .12em; display: block; margin-bottom: 10px; }
.cnc-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; list-style: none; padding: 0; margin: 0 0 36px; }
.cnc-steps li { display: flex; gap: 18px; border-top: 1px solid #344055; padding-top: 24px; }
.cnc-steps li > span { color: var(--brand-cyan); font-size: .85rem; padding-top: 3px; }
section[id] { scroll-margin-top: 90px; }
.cnc-hero a:focus-visible, .cnc-customize a:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 5px; }
@media (max-width: 991.98px) { .cnc-hero { padding: 120px 0 60px; } .cnc-steps { grid-template-columns: 1fr; gap: 22px; } }
@media (max-width: 575.98px) { .cnc-hero { padding: 105px 0 45px; } .cnc-card { padding: 22px; } .cnc-tool { gap: 16px; } .cnc-machine figcaption { padding: 14px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

.cnc-application-image { margin: 0 0 28px; }
.cnc-application-image img { display: block; width: 100%; height: auto; border: 1px solid #293347; border-radius: 20px; }
.cnc-application-image figcaption { color: #b4bfd1; font-size: .75rem; margin-top: 12px; }

.cnc-registration { border-top: 1px solid #293347; }
.cnc-video { aspect-ratio: 16 / 9; overflow: hidden; border: 1px solid #293347; border-radius: 20px; background: #000; }
.cnc-video iframe { display: block; width: 100%; height: 100%; border: 0; }
.cnc-demo-link { display: inline-block; color: var(--brand-cyan); font-size: .85rem; margin-top: 16px; }
.cnc-demo-link:hover { color: var(--brand-white); }

.cnc-digitization-media { margin: 0; }
.cnc-digitization-media figcaption { color: #b4bfd1; font-size: .75rem; margin-top: 12px; }

.cnc-digitization-media > img { display: block; width: 100%; height: auto; border: 1px solid #293347; border-radius: 20px; }
.cnc-digitization-video { margin-top: 24px; padding-top: 20px; border-top: 1px solid #293347; }
.cnc-digitization-video summary { color: var(--brand-cyan); cursor: pointer; font-size: .9rem; }
.cnc-digitization-video summary:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 5px; }
.cnc-digitization-video[open] summary { margin-bottom: 18px; }

.cnc-tool-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.cnc-tool-card { display: flex; flex-direction: column; overflow: hidden; border: 1px solid #293347; border-radius: 18px; background: linear-gradient(135deg, #151e2e, #111827); }
.cnc-tool-card > img { display: block; width: 100%; height: 235px; object-fit: cover; object-position: center 65%; }
.cnc-tool-card-body { padding: 22px; flex: 1; }
.cnc-tool-card h3 { font-family: var(--font-heading); font-size: 1.16rem; line-height: 1.35; margin: 0 0 10px; }
.cnc-tool-card p { color: #b4bfd1; font-size: .86rem; margin: 0; }
.cnc-plotting-video summary { display: block; position: relative; overflow: hidden; border: 1px solid #293347; border-radius: 18px; cursor: pointer; background: #111827; }
.cnc-plotting-video summary::-webkit-details-marker { display: none; }
.cnc-plotting-video summary img { display: block; width: 100%; height: 280px; object-fit: cover; object-position: center 72%; }
.cnc-plotting-video summary span { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); white-space: nowrap; border-radius: 999px; padding: 13px 20px; background: var(--brand-pink); color: white; font-size: .85rem; font-weight: 600; box-shadow: 0 8px 30px #0009; }
.cnc-plotting-video summary:focus-visible { outline: 2px solid var(--brand-cyan); outline-offset: 4px; }
.cnc-plotting-video[open] summary { margin-bottom: 16px; }
@media (max-width: 1199.98px) { .cnc-tool-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767.98px) { .cnc-tool-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 499.98px) { .cnc-tool-grid { grid-template-columns: 1fr; } .cnc-tool-card { display: grid; grid-template-columns: 38% 1fr; } .cnc-tool-card > img { height: 100%; min-height: 190px; } .cnc-tool-card-body { padding: 18px; } }

/* Keep the portrait artwork fully visible instead of cropping the face. */
.cnc-tool-card img[src$="pen-portrait.webp"] { object-fit: contain; background: #fff; }
.cnc-plotting-video summary img[src$="pen-portrait.webp"] { object-fit: contain; background: #fff; }