@font-face{font-family:'DM Sans';src:url('/brand/relyon/dm-sans-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/brand/relyon/dm-sans-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/brand/relyon/dm-sans-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'DM Sans';src:url('/brand/relyon/dm-sans.ttf') format('truetype');font-weight:700;font-display:swap}
@font-face{font-family:Manrope;src:url('/brand/relyon/manrope-400.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:Manrope;src:url('/brand/relyon/manrope-500.ttf') format('truetype');font-weight:500;font-display:swap}
@font-face{font-family:Manrope;src:url('/brand/relyon/manrope-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:Manrope;src:url('/brand/relyon/manrope.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--relyon-canvas:#fffcf7;--relyon-ink:#24356b;--relyon-accent:#24356b;--relyon-forest:#24356b;--relyon-soft:#eaf6fc;--relyon-muted:#56617a;--relyon-line:#dfe6f0;--relyon-surface:#fff;color:var(--relyon-ink);background:var(--relyon-canvas);font:400 16px/1.6 'DM Sans',sans-serif;font-synthesis:none}
*,*::before,*::after{box-sizing:border-box;border-width:0;border-style:solid;border-color:var(--relyon-line)}
body,h1,h2,h3,h4,p,ul,ol,figure{margin:0;padding:0}
h1,h2,h3,h4{font-size:inherit;font-weight:inherit}
body{min-width:320px}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
button{padding:0;text-align:inherit;background:transparent;cursor:pointer}
img,video{display:block;max-width:100%}
button,a,input,textarea,summary{touch-action:manipulation}
:focus-visible{outline:3px solid #548fba;outline-offset:4px}
button:disabled{cursor:not-allowed;opacity:.55}
.relyon-page{margin-inline:auto;max-width:100%}
main{display:contents}
.heading-line{display:block}
.skip-link{position:fixed;left:24px;top:8px;z-index:100;transform:translateY(-150%);padding:8px 16px;background:#fff;border-radius:8px}
.skip-link:focus{transform:translateY(0)}
button[data-action],a[data-view^='Button']{transition:background-color .16s,color .16s,box-shadow .16s}
button[data-action]:hover,a[data-view^='Button']:hover{box-shadow:inset 0 0 0 2px #8ca2c7}
dialog{color:var(--relyon-ink);background:var(--relyon-canvas);border:0;border-radius:20px;padding:40px;width:min(600px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto}
dialog::backdrop{background:rgba(20,23,20,.48)}
dialog h2{font:500 40px/48px Manrope,sans-serif;margin:0 0 16px}
dialog p{color:var(--relyon-muted);margin-bottom:16px;flex-shrink:0}
dialog[data-kind=inquiry][open]{display:flex;flex-direction:column;height:min(760px,calc(100dvh - 32px));overflow:hidden}
dialog[data-kind=inquiry] h2,.dialog-eyebrow{flex-shrink:0}
.dialog-content{min-height:0}
dialog[data-kind=inquiry] .dialog-content{flex:1;display:flex;flex-direction:column}
dialog[data-kind=inquiry] .inquiry-form{height:100%;min-height:0}
.inquiry-fields{display:flex;flex-direction:column;gap:16px}
dialog[data-kind=inquiry] .inquiry-fields{flex:1;min-height:0;overflow-y:auto;padding:4px;margin:-4px}
.inquiry-fields label{flex-shrink:0}
[data-inline-inquiry] .inquiry-form label{gap:8px}
[data-inline-inquiry] .inquiry-form>button{width:190px;align-self:flex-start}
.inquiry-form>button,.inquiry-form>small{flex-shrink:0}
.inquiry-form button:disabled{opacity:1;background:#e8e5de;color:var(--relyon-muted)}
dialog[data-kind=inquiry][data-state=success]{height:294px}
dialog[data-state=success] .dialog-content>.primary-action{width:220px}
dialog[data-state=sending] .form-status,dialog[data-state=failed] .form-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.selected-model{display:block;margin-top:4px;font-size:16px;line-height:24px}
.dialog-eyebrow{font-size:14px;line-height:20px;margin:8px 0 36px}
.dialog-close{position:absolute;right:40px;top:32px;width:44px;height:48px;border-radius:10px;background:var(--relyon-soft);font-size:26px;text-align:center}
dialog[data-kind=search]{width:min(640px,calc(100vw - 32px));padding:32px}
dialog[data-kind=search] h2{font:600 24px/32px Manrope,sans-serif;margin:8px 48px 24px 0}
dialog[data-kind=search] .dialog-close{top:32px;right:32px;width:44px;height:44px}
.relyon-search label{display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:20px;max-width:520px}
.relyon-search p{margin:24px 0}
.search-result{display:flex;align-items:center;gap:20px;padding:24px;background:#fff;border-radius:12px;margin-top:16px}
.search-result img{object-fit:cover;border-radius:8px;flex-shrink:0}
.search-result>div{min-width:0;flex:1}
.search-result h3{font:600 24px/32px Manrope,sans-serif;margin:0;height:32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.search-result span{font-size:14px;line-height:20px}
.search-status{padding:24px;background:#fff;border-radius:12px}
.search-status button{margin-top:16px}
.field-error{color:#ad3028;font-size:13px;line-height:20px}
.inquiry-form [aria-invalid=true]{border-color:#ad3028}
.inquiry-form button[type=submit]{margin-top:32px}
.inquiry-form small{font-size:13px;line-height:20px;color:var(--relyon-muted);margin-top:-8px}
.inquiry-form{display:flex;flex-direction:column;gap:16px;width:100%}
.inquiry-form label{display:flex;flex-direction:column;gap:4px;font-size:14px;line-height:20px;font-weight:500}
.inquiry-form input,.inquiry-form textarea,.search-input{width:100%;border:1px solid #dfe6f0;border-radius:10px;background:#fff;min-height:48px;padding:12px 14px;font-size:16px;line-height:24px}
.inquiry-form input,.inquiry-form textarea{font-weight:400}
.inquiry-form input::placeholder,.inquiry-form textarea::placeholder{color:var(--relyon-muted);opacity:1}
.inquiry-form input:focus-visible,.inquiry-form textarea:focus-visible,.search-input:focus-visible{outline:none;border:2px solid var(--relyon-ink);padding:11px 13px}
.inquiry-form textarea{resize:vertical;min-height:84px}
.primary-action{display:flex;align-items:center;justify-content:center;min-height:48px;padding:12px 24px;border-radius:10px;background:var(--relyon-accent);color:#fff;font-size:15px;font-weight:700}
.form-status:empty{display:none}
.form-status[role=alert]{color:#ad3028}
.trap-field{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.faq-answer{max-width:880px;color:var(--relyon-muted);font-size:16px;line-height:26px;padding-top:16px}
.faq-summary{display:flex;flex-direction:column;gap:12px;width:100%;list-style:none;cursor:pointer}
.faq-summary::-webkit-details-marker{display:none}
.faq-answer p+p{margin-top:12px}
dialog.relyon-media{position:fixed;inset:0;margin:0;padding:32px 40px;width:100vw;height:100dvh;max-width:none;max-height:none;border-radius:0;background:#24356b;color:#fff;overflow:hidden}
dialog.relyon-media[open]{display:flex;flex-direction:column;gap:16px}
.media-toolbar{height:48px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;font-size:14px;line-height:20px}
.relyon-media button{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#ffffff14;color:#fff}
.relyon-media button:hover{background:#ffffff26}
.relyon-media button:focus-visible{outline:3px solid #fff;outline-offset:3px}
.media-stage{flex:1;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.media-stage img{width:100%;height:100%;object-fit:contain;transform-origin:center}
.media-stage.zoomed{overflow:auto;align-items:flex-start}
.media-controls{flex-shrink:0;display:flex;gap:12px;justify-content:center}
.media-status{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#24356b;font-size:16px;text-align:center}
.media-status:empty{display:none}
.media-status button{width:auto;margin:16px auto 0;padding:0 20px}
[data-action=select-media][aria-pressed=true]{outline:2px solid #24356b;outline-offset:3px;border-radius:8px}
.relyon-video{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#24356b;color:#fff}
.relyon-video video{width:100%;height:100%;object-fit:contain}
.relyon-video figcaption{position:absolute;inset:0 0 auto;padding:8px 16px;background:#24356b;font-size:14px;line-height:24px}
.video-controls{position:absolute;inset:auto 0 0;display:flex;align-items:center;gap:12px;padding:4px 12px;height:48px;background:#24356b;font-size:14px;line-height:20px}
.video-controls button{width:36px;height:36px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:6px;background:#ffffff14;color:#fff}
.video-controls button:hover{background:#ffffff26}
.relyon-video.controls-hidden .video-controls,.relyon-video.controls-hidden figcaption{opacity:0;pointer-events:none}
.relyon-video:focus-within .video-controls,.relyon-video:focus-within figcaption{opacity:1;pointer-events:auto}
.video-seek{flex:1;min-width:40px;accent-color:#8dd0ec;cursor:pointer}
.video-time{white-space:nowrap}
.video-status{position:absolute;inset:40px 0 48px;display:flex;align-items:center;justify-content:center;background:#24356be6;flex-direction:column;gap:16px}
.video-status:empty{display:none}
.video-status button{padding:12px 24px;background:#ffffff14;border-radius:10px}
.relyon-video:fullscreen{width:100vw;height:100dvh;aspect-ratio:auto}
[data-view="relyon / Knowledge filters"]{margin-inline:80px}
.discovery-intro{width:100%;padding:40px 80px 32px;display:flex;flex-direction:column;gap:20px}
.discovery-intro h1{font:500 64px/70px Manrope,sans-serif}
.discovery-grid{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 24px;padding:0 80px 32px}
.discovery-card a{display:flex;flex-direction:column;gap:16px}
.discovery-card img{width:100%;height:290px;object-fit:contain;background:#fff}
.discovery-card h2{font:600 24px/32px Manrope,sans-serif;min-width:0;width:100%;height:32px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.discovery-card span,.discovery-category{font-size:14px;line-height:20px}
.discovery-category{color:var(--relyon-muted)}
.discovery-pagination{width:100%;display:flex;justify-content:center;gap:12px;padding:0 80px 32px}
.discovery-pagination a,.discovery-pagination button{display:flex;min-width:48px;height:48px;align-items:center;justify-content:center;background:var(--relyon-soft);border-radius:10px;padding:0 16px}
.discovery-pagination [aria-current=page]{background:var(--relyon-ink);color:#fff}
.discovery-empty{padding:40px 80px 80px;display:flex;flex-direction:column;gap:20px;grid-column:1/-1}
.discovery-empty .primary-action{align-self:flex-start}
@media(max-height:740px){
  dialog[data-kind=inquiry]{padding:24px}
  dialog[data-kind=inquiry] h2{font-size:24px;line-height:32px;padding-right:48px}
  dialog[data-kind=inquiry] .dialog-eyebrow{display:none}
  dialog[data-kind=inquiry] .dialog-close{top:24px;right:24px;width:44px;height:44px}
}
/* Exact geometry of the exported native-dialog components. */
dialog[data-kind=inquiry]{padding:32px 40px;gap:20px}
dialog[data-kind=inquiry] .dialog-eyebrow{height:48px;margin:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;font-size:14px;line-height:20px}
dialog[data-kind=inquiry] .inquiry-fields{padding:0;margin:0;gap:16px}
dialog[data-kind=inquiry] .inquiry-fields h2{font:600 40px/48px Manrope,sans-serif;margin:0}
dialog[data-kind=inquiry] .inquiry-fields>p{font:400 16px/25px 'DM Sans',sans-serif;margin:0}
dialog[data-kind=inquiry] .inquiry-form{gap:20px}
dialog[data-kind=inquiry] .inquiry-form label{gap:8px}
dialog[data-kind=inquiry] .inquiry-form input{height:51px;line-height:25px;padding:12px 14px}
dialog[data-kind=inquiry] .inquiry-form input:focus-visible{padding:11px 13px}
dialog[data-kind=inquiry] .inquiry-form textarea{min-height:85px;line-height:25px}
dialog[data-kind=inquiry] .inquiry-form>button{margin-top:0}
dialog[data-kind=inquiry] .inquiry-form small{margin-top:-12px}
dialog[data-kind=inquiry][data-state=success] .dialog-content{gap:16px}
dialog[data-kind=inquiry][data-state=success] h2{font:600 40px/48px Manrope,sans-serif;margin:0}
dialog[data-kind=inquiry][data-state=success] .dialog-content p{line-height:25px;margin:0}
dialog[data-kind=inquiry][data-state=success] .primary-action{margin-top:8px;flex-shrink:0}
dialog[data-kind=products] h2{margin-bottom:8px}
dialog[data-kind=search] h2{margin-top:6px;margin-bottom:30px}
.relyon-search .search-input{height:53px;min-height:53px;border:2px solid var(--relyon-ink);padding:12px 14px;font-weight:400;line-height:25px}
.relyon-search .search-input:focus-visible{padding:12px 14px}
.relyon-search>p{line-height:25px;margin:24px 0 0}
.search-results:not(:empty){margin-top:24px}
.search-result:first-child{margin-top:0}
.search-result p{font:400 16px/25px 'DM Sans',sans-serif;color:var(--relyon-muted);margin:0 0 8px}
.search-status{display:flex;flex-direction:column;gap:16px}
.search-status h3{font:600 24px/32px Manrope,sans-serif;margin:0}
.search-status p{font:400 16px/25px 'DM Sans',sans-serif;margin:0}
.search-status[data-state=error] h3,.search-status[data-state=preview] h3{color:#ad3028}
.search-status button.search-retry{margin:0;display:flex;align-items:center;justify-content:center;background:var(--relyon-soft);width:190px;height:48px;border-radius:10px;font-size:15px;line-height:22px;font-weight:700}
.search-status a{font-size:14px;line-height:20px}
.relyon-video figcaption{height:60px;padding:20px 24px;font-size:14px;line-height:20px}
.video-controls{height:88px;padding:0 24px 12px;flex-direction:column;align-items:stretch;gap:8px}
.video-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;height:44px;flex-shrink:0}
.video-start,.video-end{display:flex;align-items:center;gap:12px}
.video-controls button{width:44px;height:44px;border-radius:12px}
.video-controls button img{width:24px;height:24px}
.video-seek{appearance:none;flex:none;display:block;width:100%;height:4px;min-height:4px;margin:0;background:linear-gradient(to right,#fff var(--progress,0%),#ffffff4d var(--progress,0%));border-radius:0}
.video-seek::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#fff;opacity:0}
.video-seek:hover::-webkit-slider-thumb,.video-seek:focus-visible::-webkit-slider-thumb{opacity:1}
.video-status{inset:60px 0 88px}
.media-spinner{display:block;width:24px;height:24px;border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;animation:media-spin .8s linear infinite}
@keyframes media-spin{to{transform:rotate(360deg)}}
.relyon-media button{border-radius:12px;background:rgba(255,255,255,.1)}
.relyon-media button:hover{background:rgba(255,255,255,.24)}
.relyon-media button:focus-visible{outline:2px solid #fff;outline-offset:0}
.relyon-media[data-state=loading] .media-toolbar span,.relyon-media[data-state=loading] .media-controls{visibility:hidden}
@media(max-height:740px){
  dialog[data-kind=inquiry]{padding:24px;gap:16px}
  dialog[data-kind=inquiry] .dialog-eyebrow{display:none}
  dialog[data-kind=inquiry] .inquiry-fields h2{font-size:24px;line-height:32px;padding-right:48px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Exported 1440 × 694 inquiry has a fixed header and a 280px field viewport. */
@media(max-height:740px){
  dialog[data-kind=inquiry][data-compact=true]:not([data-state=success]){height:529px;max-height:calc(100dvh - 48px);margin:0;top:24px;left:50%;right:auto;bottom:auto;transform:translateX(-50%)}
  dialog[data-kind=inquiry][data-compact=true]>h2{height:44px;font:600 24px/32px Manrope,sans-serif;display:flex;align-items:center;margin:0;padding-right:48px}
  dialog[data-kind=inquiry][data-compact=true]>p{font:400 16px/25px 'DM Sans',sans-serif;margin:0}
  dialog[data-kind=inquiry][data-compact=true] .inquiry-form{gap:16px}
  dialog[data-kind=inquiry][data-compact=true] .inquiry-fields{gap:20px}
  dialog[data-kind=inquiry][data-compact=true] .inquiry-form small{margin:0}
}
[hidden]{display:none!important}
/* The exported fullscreen video keeps its 16:9 stage centred within 1440 × 900. */
.relyon-video:fullscreen{--media-letterbox:max(0px,calc((100dvh - 56.25vw)/2))}
.relyon-video:fullscreen figcaption{top:var(--media-letterbox);height:67.5px;padding:22.5px 27px;font-size:15.75px;line-height:22.5px}
.relyon-video:fullscreen .video-controls{bottom:var(--media-letterbox);height:99px;padding:0 27px 13.5px;gap:9px;font-size:15.75px;line-height:22.5px}
.relyon-video:fullscreen .video-actions{height:49.5px}
.relyon-video:fullscreen .video-start,.relyon-video:fullscreen .video-end{gap:13.5px}
.relyon-video:fullscreen .video-controls button{width:49.5px;height:49.5px;border-radius:13.5px}
.relyon-video:fullscreen .video-controls button img{width:27px;height:27px}
.relyon-video:fullscreen .video-seek{height:4.5px;min-height:4.5px}
.relyon-video:fullscreen .video-status{top:calc(var(--media-letterbox) + 67.5px);bottom:calc(var(--media-letterbox) + 99px)}

.relyon-media[data-state=loading] .media-stage img,.relyon-media[data-state=error] .media-stage img{visibility:hidden}

.media-controls{height:48px;align-items:center}

.inquiry-form[aria-busy=true] button{cursor:wait}
.relyon-media button:disabled{opacity:.35}


[data-inline-inquiry] .inquiry-form{gap:24px}
[data-inline-inquiry] .inquiry-fields{gap:24px}
[data-inline-inquiry] .inquiry-form input,[data-inline-inquiry] .inquiry-form textarea{background:var(--relyon-canvas);border-radius:8px;line-height:25px;padding:12px 15px}
[data-inline-inquiry] .inquiry-form input{height:52px}
[data-inline-inquiry] .inquiry-form textarea{height:148px;min-height:148px;padding:13px 15px}
[data-inline-inquiry] .inquiry-form input:focus-visible,[data-inline-inquiry] .inquiry-form textarea:focus-visible{padding-left:14px;padding-right:14px}
[data-inline-inquiry] .inquiry-form>button{margin-top:0;height:48px;line-height:22px}
[data-inline-inquiry] .inquiry-form>small{display:none}
[data-inline-inquiry] .inquiry-form[aria-busy=true] input,[data-inline-inquiry] .inquiry-form[aria-busy=true] textarea{background:var(--relyon-soft)}
[data-inline-inquiry] .form-status{font-size:14px;line-height:20px;font-weight:500;color:var(--relyon-muted)}
[data-inline-inquiry] .form-status[role=alert]{color:#ad3028}
[data-inline-inquiry] .inquiry-form>button:disabled{background:#e8e5de;color:var(--relyon-muted);opacity:1}
[data-inline-inquiry][data-state=success]>h2{font:600 24px/32px Manrope,sans-serif}
[data-inline-inquiry][data-state=success]>p{font:400 16px/25px 'DM Sans',sans-serif}
[data-inline-inquiry][data-state=success]>.primary-action{display:flex;align-items:center;justify-content:center;width:190px;height:48px;font:700 15px/22px 'DM Sans',sans-serif}

.faq-summary:hover{background:var(--relyon-soft)}
.faq-summary:focus-visible{outline:2px solid var(--relyon-ink);outline-offset:-2px;border-radius:8px}
.faq-answer{padding:0 12px 24px;line-height:25px}

.faq-answer p{white-space:pre-line}
/* Shared player states, used at the exported 880px and 1280px widths. */
.video-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;display:none;pointer-events:none}
.relyon-video[data-state=poster] .video-poster,.relyon-video[data-state=ended] .video-poster,.relyon-video[data-state=loading] .video-poster,.relyon-video[data-state=retrying] .video-poster,.relyon-video[data-state=error] .video-poster{display:block}
.relyon-video[data-state=loading] .video-poster,.relyon-video[data-state=retrying] .video-poster,.relyon-video[data-state=error] .video-poster{opacity:.22}
.relyon-video[data-state=poster] video,.relyon-video[data-state=ended] video,.relyon-video[data-state=loading] video,.relyon-video[data-state=retrying] video,.relyon-video[data-state=error] video{visibility:hidden}
.relyon-video>[data-video-action=center]{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;display:none;align-items:center;justify-content:center;border-radius:12px;background:var(--relyon-forest);z-index:3}
.relyon-video>[data-video-action=center] img{width:24px;height:24px}
.relyon-video[data-state=poster]>[data-video-action=center],.relyon-video[data-state=ended]>[data-video-action=center]{display:flex}
.relyon-video[data-state=poster] .video-start [data-video-action=play],.relyon-video[data-state=ended] .video-start [data-video-action=play]{display:none}
.relyon-video figcaption,.video-controls{z-index:2}
.relyon-video figcaption{font-weight:500}
.video-status{z-index:3;inset:0;background:transparent;gap:20px;font:400 16px/25px 'DM Sans',sans-serif;pointer-events:auto}
.video-status button.primary-action{height:48px;width:190px;background:var(--relyon-accent);font-size:15px;line-height:22px;font-weight:700}
.relyon-video[data-state=loading] .video-controls,.relyon-video[data-state=retrying] .video-controls,.relyon-video[data-state=error] .video-controls{display:none}
.relyon-video:fullscreen .video-status{top:var(--media-letterbox);bottom:var(--media-letterbox)}
.relyon-video button:focus-visible{outline:2px solid #fff;outline-offset:0}
.relyon-media[data-state] .media-toolbar span,.relyon-media[data-state] .media-controls{visibility:hidden}
.relyon-media[data-state] .media-stage img{visibility:hidden}
.media-status:not(:empty){display:flex;flex-direction:column;align-items:center;justify-content:center;width:600px;height:180px;gap:20px;line-height:25px}
.media-status button{margin:0;width:190px;height:48px;border-radius:10px;background:var(--relyon-accent);font-size:15px;line-height:22px;font-weight:700;padding:0}
.inquiry-form input[aria-invalid=true]:focus-visible,.inquiry-form textarea[aria-invalid=true]:focus-visible{border-color:#ad3028}

/* Knowledge controls share the same quiet navigation and spacing hierarchy. */
[data-view="Knowledge category tab"]{color:var(--relyon-muted);border-bottom-color:transparent}
[data-view="Knowledge category tab"][aria-current=true]{color:var(--relyon-ink);border-bottom-color:var(--relyon-ink)}
[data-view="Knowledge category tab"]:hover{color:var(--relyon-ink)}
[data-view="Knowledge category tab"]:focus-visible{outline:2px solid var(--relyon-ink);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Mobile storefront follows the shared 390px Figma layout. */
.mobile-menu-toggle{display:none}

@media (max-width: 1024px) {
  .relyon-page {
    --mobile-gutter: clamp(16px, 5.13vw, 32px);
    width: 100% !important;
    overflow-wrap: anywhere;
  }
  .relyon-page * {min-width: 0; max-width: 100%}
  .relyon-page > :is(header, footer),
  .relyon-page > main > [data-figma-node] {
    width: 100% !important;
    padding-inline: var(--mobile-gutter) !important;
  }
  .relyon-page > main > [data-figma-node] {
    padding-block: 24px !important;
    height: auto !important;
  }
  .relyon-page [style*="display:flex"] {gap: min(4vw, 24px) !important}
  .relyon-page [style*="display:flex"]:not([style*="flex-direction:column"]) {flex-wrap: wrap}
  .relyon-page [style*="padding-left:40px"],
  .relyon-page [style*="padding-left:32px"] {padding-inline: 16px !important}
  .relyon-page :is(h1, h1 *) {font-size: var(--storefront-title) !important; line-height: var(--storefront-title-line) !important}
  .relyon-page :is(h2, h2 *) {font-size: var(--storefront-section) !important; line-height: var(--storefront-section-line) !important}
  .relyon-page :is(h3, h3 *) {font-size: var(--storefront-subheading) !important; line-height: var(--storefront-subheading-line) !important}
  .relyon-page :is(h1,h2,h3,p,[data-view$="title"]) {height: auto !important; white-space: normal !important}
  .relyon-page h1 .heading-line {display: inline}
  .relyon-page h1 .heading-line + .heading-line::before {content: " "}
  .relyon-page [data-view$="title"] {text-overflow: clip !important}
  .relyon-page > header {padding-block: 12px !important}
  .relyon-page > header > [data-view="Row"] {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto;
    width: 100% !important;
    height: auto !important;
  }
  .relyon-page > header [data-view="relyon / Brand lockup"] {
    width: 120px !important;
    height: auto !important;
  }
  .relyon-page > header [data-view="relyon / Logo / Full colour"] {
    width: 100% !important;
    height: auto !important;
  }
  .mobile-menu-toggle {
    display: block;
    min-width: 80px;
    min-height: 48px;
    padding-inline: 12px;
    text-align: center;
    border-radius: 10px;
    background: var(--relyon-soft);
  }
  .relyon-page header :is(#site-navigation,#site-header-inquiry) {
    grid-column: 1 / -1;
    width: 100% !important;
  }
  .relyon-page header #site-navigation {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
  }
  .relyon-page header #site-navigation > * {
    min-height: 48px;
    width: 100% !important;
    padding: 12px !important;
    border-radius: 10px;
    background: var(--relyon-soft);
  }
  .relyon-page header [data-menu-open] > #site-header-inquiry {
    background: var(--relyon-ink) !important;
    color: #fff;
  }
  .relyon-page header [data-menu-open] > #site-header-inquiry p {color: inherit !important}
  .relyon-page header :not([data-menu-open]) > :is(#site-navigation,#site-header-inquiry) {display: none !important}
  .relyon-page :is([data-view="Gallery and purchasing summary"],[data-view="Contact and inquiry"],
    [data-view="Manufacturing overview"],[data-view="Hero copy"],[data-view="Product gallery"],
    [data-view="Model summary"],[data-view="Contact details"],[data-inline-inquiry]) {width: 100% !important}
  .relyon-page :is([data-view="Gallery and purchasing summary"],[data-view="Contact and inquiry"],
    [data-view="Manufacturing overview"]) {flex-direction: column !important}
  .relyon-page [data-view="Model summary"] {display: contents !important}
  .relyon-page [data-view="Model summary"] > h1 {order: -1}
  .relyon-page [data-view="Hero copy"] > [data-view="Row"] {width:100% !important}
  .relyon-page [data-view="Hero copy"] :is(a,button)[data-view^="Action /"] {width:100% !important}
  .relyon-page [data-inline-inquiry] {padding: 16px !important}
  .relyon-page :is([data-view^="Content row"],[data-view^="Featured products / no ranking"],
    [data-view^="Category links"],[data-view="Product categories"],[data-view="Additional categories"]) {
    display: grid !important;
    width: 100% !important;
    grid-template-columns: repeat(2,minmax(0,1fr));
    align-items: start;
    gap: 16px 12px !important;
  }
  .relyon-page :is([data-view^="Content row"],[data-view^="Featured products / no ranking"],
    [data-view^="Category links"],[data-view="Product categories"],[data-view="Additional categories"]) > * {width: 100% !important}
  .relyon-page [data-view^="Content row"]:has(a[href]:not([href*="/products/"])) {
    grid-template-columns: minmax(0,1fr);
  }
  .relyon-page :is([data-view="Source content card"],[data-view^="Product / "],[data-view^="Product card /"]) h3 {
    font-size: 16px !important;
    line-height: 22px !important;
    white-space: normal !important;
  }
  .relyon-page :is(div,a,button):has(> img[style*="position:absolute"]) {
    height: auto !important;
  }
  .relyon-page :is(div,a,button) > img[style*="position:absolute"] {
    position: static !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    border-radius: inherit;
  }
  .relyon-page [data-view="Source content card"][href*="/products/"] img {
    aspect-ratio: 1;
    object-fit: contain;
  }
  .relyon-page [data-view="Image selection"] {flex-wrap: nowrap !important; overflow-x: auto !important; padding: 4px}
  .relyon-page [data-view="Image selection"] button {width: 64px !important; min-height: 48px}
  .relyon-page [role="row"] {
    display: grid !important;
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    width: 100% !important;
    height: auto !important;
  }
  .relyon-page [role="cell"] {width: auto !important}
  .relyon-page [role="row"]:has(> [role="cell"]:nth-child(3)) {
    grid-template-columns: repeat(3,minmax(0,1fr));
    padding-inline: 12px !important;
    gap: 8px !important;
  }
  .relyon-page :is(footer,[data-view="Product information"],[data-view="Full source content"]) {height: auto !important}
  .relyon-page [data-view="relyon / Knowledge filters"] {margin: 0 !important}
  .discovery-intro,.discovery-grid,.discovery-pagination,.discovery-empty {padding-inline: var(--mobile-gutter)}
  .discovery-grid {grid-template-columns: minmax(0,1fr);gap: 24px}
  .discovery-card img {height: auto;aspect-ratio: 16/10}
  .discovery-pagination {flex-wrap: wrap}
  dialog[data-kind] {padding: 20px; max-width: calc(100% - 24px)}
  dialog[data-kind] .dialog-close {inset: 12px 12px auto auto}
  dialog[data-kind=inquiry] :is(h2,.inquiry-fields h2) {font-size: 24px;line-height: 30px;padding-right: 48px}
  dialog[data-kind=inquiry] .dialog-eyebrow {margin: 0;padding-right: 48px}
  dialog[data-kind=inquiry] .inquiry-form button[type=submit] {margin-top: 8px}
  dialog.relyon-media {padding: 16px;gap: 12px}
  .relyon-media .media-status {width: min(600px,100%);height: auto}
  .relyon-video .video-controls {padding-inline: 8px}
  .relyon-video .video-controls button {width: 44px; min-width: 44px}
  .relyon-video :is(.video-actions,.video-start,.video-end) {gap: 4px}
  .relyon-video:not(:fullscreen) {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    aspect-ratio: auto;
  }
  .relyon-video:not(:fullscreen) :is(figcaption,video,.video-poster,.video-controls,.video-status,[data-video-action=center]) {
    position: static;
    inset: auto;
    grid-column: 1;
  }
  .relyon-video:not(:fullscreen) figcaption {
    grid-row: 1;
    height: auto;
    padding: 12px;
  }
  .relyon-video:not(:fullscreen) :is(video,.video-poster,.video-status,[data-video-action=center]) {grid-row: 2}
  .relyon-video:not(:fullscreen) :is(video,.video-poster) {height: auto; aspect-ratio: 16/9}
  .relyon-video:not(:fullscreen) [data-video-action=center] {place-self: center; transform: none}
  .relyon-video:not(:fullscreen) .video-controls {grid-row: 3; height: auto; padding-block: 8px}
  .relyon-video:not(:fullscreen).controls-hidden :is(figcaption,.video-controls) {opacity: 1; pointer-events: auto}
}

/* Homepage hero follows the compact Figma grid and HeroUI v2 control scale. */
.relyon-page [data-view^="02 · Hero /"] {
  width: 100% !important;
  padding: 24px clamp(20px, 5vw, 80px) 32px !important;
}
[data-view^="02 · Hero /"] > [data-view="Row"] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 4vw, 56px) !important;
  width: 100% !important;
  max-width: 1160px;
  margin-inline: auto;
}
[data-view^="02 · Hero /"] [data-view="Hero copy"] {
  width: 100% !important;
  min-width: 0;
  gap: 16px !important;
}
[data-view^="02 · Hero /"] [data-view="Hero copy"] > * {max-width: 100%}
.relyon-page [data-view^="02 · Hero /"] :is(h1, .heading-line) {
  font-size: var(--storefront-title) !important;
  line-height: var(--storefront-title-line) !important;
}
[data-view^="02 · Hero /"] [data-figma-node="3:33"] {
  width: min(100%, 470px) !important;
  font-size: 16px !important;
  line-height: 24px !important;
}
[data-view^="02 · Hero /"] [data-figma-node="3:39"] {font-size: 14px !important}
[data-view^="02 · Hero /"] [data-view="Hero copy"] > [data-view="Row"] {
  width: auto !important;
  gap: 12px !important;
  flex-wrap: wrap;
}
.relyon-page [data-view^="02 · Hero /"] [data-view="Hero copy"] :is(a,button)[data-view^="Action /"] {
  width: auto !important;
  min-width: 156px;
  height: 40px !important;
  padding-inline: 16px;
  border-radius: 12px !important;
}
[data-view^="02 · Hero /"] [data-view="Hero copy"] [data-view^="Action /"] p {
  font-size: 14px !important;
  line-height: 20px !important;
}
.relyon-page [data-view^="02 · Hero /"] [data-view="Photo / banana"] {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  border-radius: 14px !important;
}
.relyon-page [data-view^="02 · Hero /"] [data-view="Photo / banana"] > img {
  position: absolute !important;
  inset: 0;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: inherit !important;
}
@media (min-width: 1025px) {
  .relyon-page [data-view^="02 · Hero /"] [data-view="Hero copy"] a[data-view^="Action / Browse"] {
    min-width: 180px;
  }
}
@media (max-width: 1024px) {
  .relyon-page [data-view^="02 · Hero /"] [data-view="Hero copy"] :is(a,button)[data-view^="Action /"] {
    height: 48px !important;
  }
}
@media (max-width: 760px) {
  [data-view^="02 · Hero /"] > [data-view="Row"] {grid-template-columns: minmax(0,1fr)}
  .relyon-page [data-view^="02 · Hero /"] :is(h1,.heading-line) {
    font-size: var(--storefront-title) !important;
    line-height: var(--storefront-title-line) !important;
  }
  .relyon-page [data-view^="02 · Hero /"] [data-view="Hero copy"] > [data-view="Row"],
  .relyon-page [data-view^="02 · Hero /"] [data-view="Hero copy"] :is(a,button)[data-view^="Action /"] {
    width: 100% !important;
  }
}

/* Article detail reading column follows the Figma desktop and phone layouts. */
.relyon-page main > article[data-view="Article"] {
  width: min(calc(100% - 40px), 760px) !important;
  margin-inline: auto;
  padding: 32px 0 64px !important;
  gap: 24px !important;
  align-items: stretch !important;
  overflow: visible !important;
}
article[data-view="Article"] * {min-width: 0 !important; max-width: 100%}
article[data-view="Article"] [data-view="Page introduction"] {
  width: 100% !important;
  padding: 0 !important;
  gap: 12px !important;
}
article[data-view="Article"] [data-view="Back to Knowledge"] {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  width: auto !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}
article[data-view="Article"] [data-view="Article author"] {
  width: auto !important;
  font-size: 14px !important;
  line-height: 20px !important;
}
.relyon-page article[data-view="Article"] h1 {
  width: 100% !important;
  font-size: var(--storefront-title) !important;
  line-height: var(--storefront-title-line) !important;
  font-weight: 600 !important;
  white-space: normal !important;
  text-wrap: balance;
}
.relyon-page article[data-view="Article"] h2 {
  font-size: var(--storefront-section) !important;
  line-height: var(--storefront-section-line) !important;
  text-wrap: pretty;
}
.relyon-page article[data-view="Article"] h3 {
  font-size: var(--storefront-subheading) !important;
  line-height: var(--storefront-subheading-line) !important;
}
.relyon-page article[data-view="Article"] :is(h1,h2,h3) .heading-line {
  font-size: inherit !important;
  line-height: inherit !important;
}
.relyon-page article[data-view="Article"] :is([data-view="Full source content"],[data-view^="Section ·"]) {
  gap: 16px !important;
}
article[data-view="Article"] [data-view^="Section ·"] + [data-view^="Section ·"] {margin-top: 12px}
.relyon-page article[data-view="Article"] [data-view="Full source content"] p:not([role="cell"]) {
  font-size: 18px !important;
  line-height: 30px !important;
  color: #2c3547 !important;
}
article[data-view="Article"] [data-view="Full source content"] a:not([data-view^="Button /"]) {
  text-decoration: underline;
  text-underline-offset: 3px;
}
.relyon-page article[data-view="Article"] :is(div,a,button):has(> img[style*="position:absolute"]) {
  height: auto !important;
  border-radius: 14px !important;
  overflow: hidden !important;
}
.relyon-page article[data-view="Article"] :is(div,a,button) > img[style*="position:absolute"] {
  position: static !important;
  width: 100% !important;
  height: auto !important;
  border-radius: inherit !important;
}
.relyon-page article[data-view="Article"] [role="row"] {
  display: grid !important;
  grid-template-columns: minmax(0,2fr) minmax(0,3fr);
  padding-inline: 12px !important;
  gap: 8px !important;
}
.relyon-page article[data-view="Article"] [role="row"]:has(> [role="cell"]:nth-child(3)) {
  grid-template-columns: repeat(3,minmax(0,1fr));
}
.relyon-page article[data-view="Article"] [role="cell"] {
  width: auto !important;
  overflow-wrap: anywhere;
}
article[data-view="Article"] [data-view="Article topics"] {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding-top: 16px;
  border-top: 1px solid var(--relyon-line);
}
article[data-view="Article"] [data-view="Article topics"] p {
  flex-basis: 100%;
  font: 400 14px/20px 'DM Sans',sans-serif;
  color: var(--relyon-muted);
}
article[data-view="Article"] [data-view="Article topics"] a {
  display: inline-flex;
  align-items: center;
  min-height: 36px;
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--relyon-soft);
  font: 500 14px/20px 'DM Sans',sans-serif;
}
article[data-view="Article"] [data-view="Article topics"] a:hover {text-decoration: underline}
@media (max-width: 600px) {
  .relyon-page main > article[data-view="Article"] {padding-block: 24px 48px !important}
  .relyon-page article[data-view="Article"] h1 {font-size: var(--storefront-title) !important; line-height: var(--storefront-title-line) !important}
  .relyon-page article[data-view="Article"] h2 {font-size: var(--storefront-section) !important; line-height: var(--storefront-section-line) !important}
  .relyon-page article[data-view="Article"] [data-view="Full source content"] p:not([role="cell"]) {
    font-size: 16px !important;
    line-height: 28px !important;
  }
  article[data-view="Article"] [data-view="Article topics"] a {min-height: 44px}
}