/* Isolated from the existing service and product templates. */
.hx-page { --hx-accent:#79f4d1; --hx-muted:#abb6c8; --hx-line:#293240; background:#080d13; color:#f2f5f7; overflow:clip; }
.hx-accent-amber { --hx-accent:#ffc078; }
.hx-accent-blue { --hx-accent:#91ceff; }
.hx-wrap { width:min(1240px, calc(100% - 80px)); margin-inline:auto; }
.hx-page h1,.hx-page h2,.hx-page h3,.hx-page h4 { font-family:"Space Grotesk",sans-serif; margin:0; text-wrap:balance; }
.hx-page p { margin:0; }
.hx-page a { text-underline-offset:5px; }
.hx-page a:focus-visible,.hx-page summary:focus-visible,.hx-page [tabindex]:focus-visible { outline:3px solid var(--hx-accent); outline-offset:5px; }
.hx-breadcrumb { display:flex; gap:14px; align-items:center; color:var(--hx-muted); font-size:12px; padding-block:28px; }
.hx-breadcrumb a:hover { color:var(--hx-accent); }
.hx-hero { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(0,1fr); align-items:center; gap:64px; padding:50px 0 70px; }
.hx-eyebrow { color:var(--hx-accent); text-transform:uppercase; letter-spacing:.14em; font-size:11px; font-weight:700; line-height:1.6; }
.hx-hero h1 { font-size:clamp(38px,4.3vw,64px); line-height:1.07; letter-spacing:-.055em; margin:23px 0; }
.hx-intro { color:#bec8d5; font-size:17px; line-height:1.8; max-width:540px; }
.hx-actions { display:flex; flex-wrap:wrap; align-items:center; gap:22px; margin:30px 0 24px; }
.hx-button { display:inline-flex; align-items:center; justify-content:space-between; gap:25px; padding:16px 21px; background:var(--hx-accent); color:#071410; border:1px solid transparent; border-radius:6px; font-size:14px; font-weight:700; transition:background .2s,transform .2s; min-height:50px; }
.hx-button:hover { background:#fff; transform:translateY(-2px); }
.hx-text-link { display:inline-flex; align-items:center; gap:14px; font-size:14px; font-weight:600; min-height:44px; }
.hx-text-link:hover { text-decoration:underline; }
.hx-audience { color:var(--hx-muted); font-size:12px; max-width:400px; }
.hx-hero-visual { position:relative; isolation:isolate; min-height:480px; border:1px solid #34414b; border-radius:18px; overflow:hidden; padding:24px; display:flex; flex-direction:column; justify-content:space-between; background:radial-gradient(ellipse at 80% 10%,#244b48 0%,transparent 62%),#102027; }
.hx-accent-amber .hx-hero-visual { background:radial-gradient(ellipse at 80% 10%,#53402e 0%,transparent 62%),#1e2226; }
.hx-accent-blue .hx-hero-visual { background:radial-gradient(ellipse at 80% 10%,#284863 0%,transparent 62%),#11232e; }
.hx-blueprint { position:absolute; inset:0; opacity:.7; z-index:-1; background-image:linear-gradient(#ffffff0c 1px,transparent 1px),linear-gradient(90deg,#ffffff0c 1px,transparent 1px); background-size:34px 34px; mask-image:linear-gradient(#000, #0008); }
.hx-orbit { position:absolute; width:330px; height:190px; border:1px solid var(--hx-accent); border-radius:18px; transform:rotate(-28deg) skewX(20deg); right:-10px; top:75px; opacity:.4; }
.hx-orbit-two { top:40px; right:35px; }.hx-orbit-three { top:5px; right:80px; }
.hx-pin { position:absolute; display:grid; place-items:center; width:35px; height:35px; background:var(--hx-accent); color:#0b141a; border-radius:50%; font-size:11px; font-weight:700; }
.hx-pin-one { top:115px; left:70px; }.hx-pin-two { top:65px; right:130px; }.hx-pin-three { top:175px; right:35px; }
.hx-scene-caption { font-size:10px; letter-spacing:.12em; text-transform:uppercase; display:flex; align-items:center; gap:9px; color:#e2edf0; }
.hx-dot { width:6px; height:6px; border-radius:100%; background:var(--hx-accent); }
.hx-visual-card { margin-top:145px; background:#09131bec; backdrop-filter:blur(12px); border:1px solid #ffffff28; border-radius:10px; padding:24px; }
.hx-visual-card h2 { font-size:25px; margin:8px 0 12px; letter-spacing:-.03em; }
.hx-visual-card > p:not(.hx-eyebrow) { font-size:13px; color:#c2ccd5; }
.hx-visual-card a { color:var(--hx-accent); margin-top:12px; }
.hx-visual-footer { display:flex; justify-content:space-between; gap:12px; font-size:10px; color:#bdcbd0; margin-top:22px; }
.hx-hero-photo { position:absolute; width:100%; height:100%; object-fit:cover; inset:0; z-index:-2; }
.hx-hero-visual.hx-with-video { aspect-ratio:4/3; min-height:0; }
.hx-with-video video { object-position:50% 30%; }
.hx-with-photo { min-height:520px; aspect-ratio:1.06; padding:26px; }
.hx-with-photo::before { content:""; position:absolute; inset:0; background:linear-gradient(#07101865,transparent 25%,transparent 60%,#071018ed); z-index:-1; }
.hx-photo-topline { display:flex; align-items:center; gap:10px; align-self:flex-start; padding:10px 13px; border:1px solid #ffffff40; background:#09131bdb; border-radius:5px; font-size:11px; color:#fff; }
.hx-photo-bottom { margin-top:auto; padding-top:30px; }
.hx-photo-caption { color:#e0e7ed; font-size:11px; line-height:1.5; }
.hx-photo-link { display:flex; align-items:center; justify-content:space-between; gap:16px; color:#fff; font-size:19px; font-weight:600; padding-top:10px; min-height:48px; }
.hx-photo-link span { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--hx-accent); color:#071410; flex-shrink:0; }
@media(max-width:900px) { .hx-with-photo { min-height:380px; aspect-ratio:1.3; } }
/* Single column: the photo box takes its height from the column width. A min-height here combined
   with aspect-ratio made the box 546px wide on a 375px phone and the right edge disappeared. */
@media(max-width:800px) { .hx-hero { grid-template-columns:minmax(0,1fr); }.hx-with-photo { min-height:0; aspect-ratio:4/3; width:100%; max-width:100%; } }
.hx-section-nav { position:sticky; top:var(--hx-header-height,80px); z-index:20; background:#0c131bf2; backdrop-filter:blur(12px); border-block:1px solid var(--hx-line); }
.hx-section-nav .hx-wrap { display:flex; align-items:center; gap:34px; overflow:auto; scrollbar-width:thin; }
.hx-section-nav a { padding:19px 0; white-space:nowrap; font-size:12px; color:#bdc6d3; border-bottom:2px solid transparent; }
.hx-section-nav a:hover,.hx-section-nav a[aria-current] { color:var(--hx-accent); border-bottom-color:var(--hx-accent); }
.hx-section-nav .hx-nav-cta { margin-left:auto; color:var(--hx-accent); }
.hx-page section,.hx-scenario-panel { scroll-margin-top:calc(var(--hx-header-height,80px) + 90px); }
.hx-section { padding:90px 0; border-bottom:1px solid var(--hx-line); }
.hx-section-heading { max-width:730px; margin-bottom:36px; }
.hx-section-heading h2,.hx-enquire h2,.hx-evidence h2 { font-size:clamp(30px,3.3vw,44px); line-height:1.15; letter-spacing:-.04em; margin-top:15px; }
.hx-section-heading > p:not(.hx-eyebrow) { color:var(--hx-muted); margin-top:18px; }
.hx-index { font-size:12px; color:var(--hx-accent); font-variant-numeric:tabular-nums; }
/* Who it is for: one line under the hero, so a festival or stadium person sees themselves before scrolling. */
.hx-for { display:flex; align-items:baseline; justify-content:space-between; gap:40px; padding:26px 0 34px; border-top:1px solid var(--hx-line); }
.hx-for h2 { font-size:20px; letter-spacing:-.02em; flex:0 0 auto; }
.hx-for ul { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px 0; font-size:15px; font-weight:500; color:#dbe3ea; }
.hx-for li:not(:last-child)::after { content:"\00b7"; color:var(--hx-accent); margin:0 14px; }
/* The problem: one photo from our footage on the left, the three problems stacked on the right. */
.hx-problem { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:64px; align-items:center; }
.hx-problem-text { grid-template-columns:1fr; }
.hx-problem-photo { border-radius:16px; overflow:hidden; border:1px solid var(--hx-line); background:#0f161f; aspect-ratio:4/3; }
.hx-problem-photo img { width:100%; height:100%; object-fit:cover; display:block; }
.hx-problem .hx-section-heading { margin-bottom:28px; }
.hx-problems { list-style:none; margin:0; padding:0; }
.hx-problems li { display:flex; gap:22px; align-items:flex-start; padding:22px 0; border-top:1px solid var(--hx-line); }
.hx-problems li:last-child { border-bottom:1px solid var(--hx-line); }
.hx-problems .hx-index { padding-top:6px; }
.hx-problems h3 { font-size:21px; margin:0 0 8px; letter-spacing:-.02em; }
.hx-problems p { color:var(--hx-muted); font-size:15px; line-height:1.75; }
.hx-explorer { display:grid; grid-template-columns:.8fr 1.5fr; border:1px solid var(--hx-line); border-radius:14px; overflow:hidden; background:#101923; }
.hx-scenario-choices { padding:20px; background:#0c131c; }
.hx-scenario-choices a { display:flex; align-items:center; gap:18px; padding:23px 16px; border:1px solid transparent; border-bottom-color:var(--hx-line); border-radius:7px; }
.hx-scenario-choices a > span:last-child { margin-left:auto; color:var(--hx-accent); }
.hx-scenario-choices a[aria-selected="true"] { border-color:#55786e; background:#20362f; }
.hx-scenario-choices strong { display:block; font-size:16px; line-height:1.4; }
.hx-scenario-choices small { display:block; color:var(--hx-muted); font-size:11px; margin-top:8px; }
.hx-scenario-panel { padding:36px; min-height:415px; }
.hx-scenario-panel[hidden] { display:none; }
.hx-panel-top { display:flex; justify-content:space-between; gap:14px; align-items:center; margin-bottom:24px; }
.hx-tag { border:1px solid #3b4653; border-radius:30px; padding:5px 10px; font-size:10px; color:#c9d6dc; }
.hx-scenario-panel h3 { font-size:30px; letter-spacing:-.03em; margin-bottom:14px; }
.hx-here { color:var(--hx-accent); font-size:12px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; margin-bottom:8px; }
.hx-situation { color:#e6edf2; font-size:19px; line-height:1.55; max-width:650px; }
.hx-scenario-still { margin:24px 0 0; border-radius:10px; overflow:hidden; border:1px solid var(--hx-line); background:#080d13; position:relative; }
.hx-scenario-still img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.hx-scenario-still figcaption { position:absolute; left:12px; bottom:12px; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#fff; background:#071019cc; border:1px solid #ffffff33; border-radius:4px; padding:5px 9px; }
.hx-learning-steps { display:grid; grid-template-columns:1fr 1fr; gap:28px; margin:24px 0 16px; border-top:1px solid var(--hx-line); padding-top:22px; }
.hx-learning-steps h4 { font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--hx-accent); margin-bottom:10px; }
.hx-learning-steps p { font-size:14px; color:#c9d3dc; line-height:1.75; }
.hx-scenario-panel > a { color:var(--hx-accent); }
.hx-fine-print { font-size:11px; line-height:1.8; color:var(--hx-muted); margin-top:16px !important; max-width:850px; }
.hx-start { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:28px; align-items:start; }
.hx-start-solo { grid-template-columns:minmax(0,1fr); }
.hx-product-lead .hx-product-photo img { height:auto; aspect-ratio:16/9; }
.hx-product-lead .hx-product-body { padding:30px; }
.hx-product-lead h3 { font-size:28px; line-height:1.2; letter-spacing:-.03em; }
.hx-product-lead p { font-size:15px; line-height:1.75; }
.hx-start-more { display:flex; flex-direction:column; gap:14px; }
.hx-start-more > .hx-eyebrow { padding:8px 0 2px; }
.hx-product-small .hx-product-photo img { height:120px; }
.hx-product-small .hx-product-body { padding:18px 20px; }
.hx-product-small h3 { font-size:16px; margin:0 0 8px; }
.hx-product-small p { font-size:13px; margin:0; }
/* What we have built: the honest statement, the case study when there is one, the advisor model, and real frames. */
.hx-built { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:56px; align-items:start; }
.hx-built-solo { grid-template-columns:minmax(0,1fr); }
.hx-built-solo .hx-built-copy { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:0 56px; align-items:start; }
.hx-built-solo .hx-section-heading { grid-row:1 / 3; }
.hx-built .hx-section-heading > p:not(.hx-eyebrow) { font-size:16px; line-height:1.75; color:#c9d3dc; }
.hx-case,.hx-advisor { border-top:1px solid var(--hx-line); padding-top:22px; margin-top:26px; }
.hx-case h3,.hx-advisor h3 { font-size:20px; margin:10px 0 10px; letter-spacing:-.02em; }
.hx-case p:not(.hx-eyebrow),.hx-advisor p:not(.hx-eyebrow) { color:var(--hx-muted); font-size:14px; line-height:1.8; }
.hx-case .hx-text-link { color:var(--hx-accent); margin-top:8px; }
.hx-gallery { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.hx-gallery figure { margin:0; border-radius:12px; overflow:hidden; border:1px solid var(--hx-line); background:#0f161f; }
.hx-gallery figure:first-child { grid-column:1 / -1; }
.hx-gallery img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; }
.hx-gallery figcaption { padding:12px 16px; font-size:12px; color:var(--hx-muted); line-height:1.5; }
.hx-product { border:1px solid var(--hx-line); border-radius:12px; overflow:hidden; background:#101821; display:flex; flex-direction:column; transition:border-color .2s,transform .2s; }
.hx-product:hover { border-color:var(--hx-accent); transform:translateY(-4px); }
.hx-product-photo img { width:100%; height:190px; object-fit:cover; }
.hx-product-art { height:190px; display:flex; justify-content:space-between; align-items:center; padding:30px; background:repeating-linear-gradient(-35deg,transparent,transparent 20px,#ffffff06 20px,#ffffff06 21px),linear-gradient(125deg,#1d333b,#12212b); color:var(--hx-accent); }
.hx-product-art span:first-child { font-size:50px; font-weight:600; letter-spacing:-.06em; opacity:.7; }
.hx-product-art span:last-child { font-size:14px; border:1px solid #607c80; border-radius:50%; padding:12px; }
.hx-product-body { padding:25px; display:flex; flex-direction:column; flex:1; }
.hx-product h3 { font-size:21px; line-height:1.4; margin:12px 0; }
.hx-product h3 a:hover { text-decoration:underline; }
.hx-product p { color:var(--hx-muted); font-size:13px; margin-bottom:20px; }
.hx-product-body > a { margin-top:auto; color:var(--hx-accent); }
.hx-reading-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.hx-reading-card { border:1px solid var(--hx-line); border-radius:12px; overflow:hidden; background:#101821; display:flex; flex-direction:column; transition:border-color .2s,transform .2s; }
.hx-reading-card:hover { border-color:var(--hx-accent); transform:translateY(-4px); }
.hx-reading-media { display:block; height:160px; background:linear-gradient(125deg,#1d333b,#12212b); }
.hx-reading-media img { width:100%; height:100%; object-fit:cover; display:block; }
.hx-reading-art { display:flex; align-items:center; justify-content:center; height:100%; font-family:"Space Grotesk",sans-serif; font-size:56px; font-weight:600; color:var(--hx-accent); opacity:.55; letter-spacing:-.06em; }
.hx-reading-body { padding:22px 24px 24px; display:flex; flex-direction:column; flex:1; }
.hx-reading-body .hx-eyebrow span { color:var(--hx-muted); font-weight:400; letter-spacing:0; text-transform:none; }
.hx-reading-card h3 { font-size:18px; line-height:1.4; margin:10px 0 8px; }
.hx-reading-card h3 a:hover { text-decoration:underline; }
.hx-reading-card p:not(.hx-eyebrow) { color:var(--hx-muted); font-size:13px; margin-bottom:18px; }
.hx-reading-body > .hx-text-link { margin-top:auto; }
.hx-evidence { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:center; }
.hx-evidence h3 { margin:24px 0 12px; }
.hx-evidence p:not(.hx-eyebrow) { color:var(--hx-muted); }
.hx-video-stage { margin:0; border-radius:14px; overflow:hidden; border:1px solid var(--hx-line); background:#060a0e; }
.hx-video-frame { position:relative; }
.hx-video-stage video { display:block; width:100%; height:auto; aspect-ratio:16/9; background:#060a0e; }
.hx-video-start { position:absolute; inset:0; width:100%; border:0; padding:0; background:transparent; cursor:pointer; color:#fff; font:inherit; }
.hx-video-start:hover .hx-play-icon { transform:translate(-50%,-50%) scale(1.06); }
.hx-video-start:focus-visible { outline:3px solid var(--hx-accent); outline-offset:-4px; }
.hx-video-stage.is-playing .hx-video-start { display:none; }
.hx-video-stage figcaption { display:flex; justify-content:space-between; align-items:center; gap:20px; flex-wrap:wrap; padding:14px 20px; font-size:13px; color:var(--hx-muted); border-top:1px solid var(--hx-line); background:#101923; }
.hx-video-stage figcaption .hx-text-link { color:var(--hx-accent); min-height:0; }
.hx-video-links { display:flex; flex-wrap:wrap; gap:6px 24px; }
.hx-demo-lead { margin-top:22px !important; max-width:760px; color:var(--hx-muted); font-size:15px; line-height:1.75; }
.hx-demo-note { margin-top:22px !important; max-width:760px; font-size:14px; line-height:1.7; color:#dbe3ea; border-left:2px solid var(--hx-accent); padding-left:16px; }
.hx-demo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.hx-demo-single { grid-template-columns:1fr; }
.hx-demo-card { background:#101923; border:1px solid var(--hx-line); border-radius:14px; overflow:hidden; }
.hx-demo-single .hx-demo-card { display:grid; grid-template-columns:1.5fr 1fr; align-items:center; }
.hx-demo-player { aspect-ratio:16/9; background:#060a0e; overflow:hidden; }
.hx-demo-player iframe { display:block; width:100%; height:100%; border:0; }
.hx-demo-poster { position:relative; display:block; border:0; padding:0; cursor:pointer; width:100%; height:100%; background:#060a0e; color:#fff; font:inherit; }
.hx-demo-poster img { width:100%; height:100%; object-fit:cover; transition:filter .2s; }
.hx-demo-poster:hover img { filter:brightness(.75); }
.hx-demo-poster:focus-visible { outline:3px solid var(--hx-accent); outline-offset:-4px; }
.hx-play-icon { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:68px; height:68px; display:grid; place-items:center; border-radius:50%; color:#071410; background:var(--hx-accent); font-size:24px; box-shadow:0 5px 40px #0007; }
.hx-play-label { position:absolute; left:20px; bottom:18px; background:#071019dd; border:1px solid #ffffff33; border-radius:5px; padding:7px 12px; font-size:12px; }
.hx-demo-copy { padding:30px; }
.hx-demo-copy h3 { font-size:25px; line-height:1.25; margin:12px 0 15px; }
.hx-demo-copy > p:not(.hx-eyebrow) { color:var(--hx-muted); font-size:14px; line-height:1.75; }
.hx-demo-copy .hx-demo-client { margin-top:15px; color:#eef5f2 !important; }
.hx-demo-client a { text-decoration:underline; }
.hx-demo-lead .hx-demo-client { color:#eef5f2; }
.hx-demo-lead strong { color:#eef5f2; font-weight:600; }
.hx-demo-copy .hx-text-link { color:var(--hx-accent); margin-top:15px; }
.hx-proof-image { margin:0; overflow:hidden; border:1px solid var(--hx-line); border-radius:12px; background:#101923; }
.hx-proof-image img { width:100%; max-height:540px; object-fit:contain; background:#080d13; }
.hx-proof-image figcaption { padding:18px 24px; color:var(--hx-muted); font-size:13px; }
@media(max-width:800px) { .hx-demo-grid,.hx-demo-single .hx-demo-card { grid-template-columns:1fr; }.hx-demo-copy { padding:24px; } }
.hx-delivery { background:#e9eee8; color:#172724; padding:56px 0; margin-top:40px; }
.hx-delivery .hx-eyebrow,.hx-delivery .hx-index { color:#326051; }
.hx-delivery-head { display:flex; align-items:baseline; gap:24px; flex-wrap:wrap; margin-bottom:28px; }
.hx-delivery-head h2 { font-size:clamp(24px,2.4vw,30px); letter-spacing:-.03em; }
.hx-delivery-steps { list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:32px; }
.hx-delivery-steps li { display:flex; gap:16px; border-top:1px solid #b9c7bf; padding-top:18px; }
.hx-delivery-steps .hx-index { font-size:14px; font-weight:700; padding-top:2px; }
.hx-delivery-steps h3 { font-size:17px; margin:0 0 6px; letter-spacing:-.02em; }
.hx-delivery-steps p { font-size:14px; color:#42574e; line-height:1.7; }
.hx-safety-note { font-size:12px; color:#42574e; border-top:1px solid #becac3; padding-top:18px; margin-top:28px !important; }
.hx-faq-layout { display:grid; grid-template-columns:.85fr 1.4fr; gap:70px; border:0; }
.hx-faq-layout .hx-text-link { color:var(--hx-accent); margin-top:20px; }
.hx-faqs details { border-bottom:1px solid var(--hx-line); }
.hx-faqs details:first-child { border-top:1px solid var(--hx-line); }
.hx-faqs summary { display:flex; align-items:center; justify-content:space-between; cursor:pointer; gap:25px; padding:23px 0; font-size:16px; list-style:none; }
.hx-faqs summary::-webkit-details-marker { display:none; }
.hx-faqs summary span { color:var(--hx-accent); font-size:24px; }
.hx-faqs details[open] summary span { transform:rotate(45deg); }
.hx-faqs details p { padding-bottom:25px; font-size:14px; color:var(--hx-muted); line-height:1.8; }
.hx-enquire { display:grid; grid-template-columns:1.3fr 1fr; gap:55px; align-items:center; padding:48px; border:1px solid #42655c; border-radius:16px; background:radial-gradient(ellipse at right top,#1f4238,transparent 70%),#12221e; }
.hx-enquire h2 { font-size:36px; }.hx-enquire p:not(.hx-eyebrow) { font-size:14px; color:#bdccc6; margin-top:18px; }
.hx-enquire-action { display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.hx-enquire-action > span { color:#bdccc6; font-size:11px; }
.hx-endnote { display:flex; justify-content:space-between; padding:32px 0 65px; font-size:13px; color:var(--hx-muted); align-items:center; gap:20px; }
.hx-hero-copy { animation:hx-enter .6s ease-out both; }.hx-hero-visual { animation:hx-enter .8s ease-out both; }
@keyframes hx-enter { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
.hx-industry-directory { padding:65px 0 80px; }
.hx-directory-heading { max-width:780px; margin-bottom:45px; }
.hx-directory-heading h1 { font-size:clamp(36px,4.5vw,62px); letter-spacing:-.05em; line-height:1.12; margin:20px 0; }
.hx-directory-heading > p:last-child { color:var(--hx-muted); max-width:620px; font-size:17px; }
.hx-directory-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }
.hx-directory-card { display:flex; flex-direction:column; align-items:flex-start; padding:30px; border:1px solid var(--hx-line); border-radius:12px; background:linear-gradient(145deg,#192932,#0c151d); }
.hx-directory-card h2 { font-size:26px; line-height:1.25; margin:35px 0 15px; }
.hx-directory-card p { color:var(--hx-muted); margin-bottom:30px; }
.hx-directory-card .hx-text-link { color:var(--hx-accent); margin-top:auto; }
.hx-directory-card:focus-within,.hx-directory-card:hover { border-color:var(--hx-accent); }
@media(max-width:850px) { .hx-directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:550px) { .hx-directory-grid { grid-template-columns:1fr; }.hx-industry-directory { padding-top:40px; } }
@media(min-width:1400px) { .hx-hero { padding-bottom:80px; }.hx-hero-visual { min-height:520px; } }
@media(max-width:1000px) { .hx-problem,.hx-built { gap:32px; }.hx-start { grid-template-columns:1fr; }.hx-hero { gap:30px; }.hx-wrap { width:calc(100% - 48px); }.hx-section-nav .hx-wrap { gap:24px; }.hx-visual-card { padding:20px; }.hx-faq-layout { gap:35px; } }
@media(max-width:800px) { .hx-hero { grid-template-columns:1fr; }.hx-hero h1 { max-width:650px; font-size:48px; }.hx-hero-visual { min-height:410px; }.hx-visual-card { max-width:450px; }.hx-hero { padding:10px 0 45px; }.hx-section { padding:60px 0; }.hx-explorer { grid-template-columns:1fr; }.hx-scenario-choices { display:flex; gap:10px; overflow-x:auto; }.hx-scenario-choices a { flex:1; min-width:200px; padding:15px; }.hx-scenario-choices a > .hx-index { display:none; }.hx-scenario-panel { min-height:0; }.hx-reading-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.hx-faq-layout,.hx-enquire,.hx-evidence { grid-template-columns:1fr; gap:24px; }.hx-faq-layout .hx-section-heading { margin-bottom:0; }.hx-enquire { padding:32px; }.hx-problem,.hx-built,.hx-built-solo .hx-built-copy { grid-template-columns:1fr; gap:28px; }.hx-built-solo .hx-section-heading { grid-row:auto; }.hx-for { flex-direction:column; gap:12px; padding:22px 0 26px; }.hx-for ul { justify-content:flex-start; }.hx-delivery { padding:44px 0; }.hx-delivery-steps { grid-template-columns:1fr; gap:18px; } }
@media(max-width:550px) { .hx-wrap { width:calc(100% - 36px); }.hx-breadcrumb { font-size:10px; gap:10px; padding-block:22px; }.hx-hero h1 { font-size:40px; }.hx-eyebrow { font-size:10px; }.hx-intro { font-size:15px; }.hx-hero-visual { padding:18px; min-height:420px; }.hx-actions { gap:12px; }.hx-actions .hx-button { width:100%; }.hx-reading-grid { grid-template-columns:1fr; }.hx-gallery { grid-template-columns:1fr; }.hx-for li:not(:last-child)::after { margin:0 9px; }.hx-for ul { font-size:14px; }.hx-situation { font-size:17px; }.hx-product-lead h3 { font-size:23px; }.hx-video-stage figcaption { padding:12px 16px; }.hx-section-heading h2 { font-size:32px; }.hx-section-nav .hx-wrap { gap:22px; }.hx-section-nav .hx-nav-cta { display:none; }.hx-scenario-panel { padding:24px; }.hx-panel-top { flex-wrap:wrap; }.hx-learning-steps { grid-template-columns:1fr; gap:22px; }.hx-scenario-panel h3 { font-size:27px; }.hx-section-heading { margin-bottom:28px; }.hx-enquire { padding:25px; }.hx-enquire h2 { font-size:30px; }.hx-enquire .hx-button { width:100%; font-size:13px; padding:15px; gap:12px; }.hx-enquire-action { align-items:stretch; }.hx-endnote { align-items:flex-start; flex-direction:column; gap:0; }.hx-visual-footer { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }.hx-page * { animation:none !important; transition:none !important; } }