/* Restrained motion: stable layout, banner crossfade, and a single home entrance. */
:root{--motion-fast:160ms;--motion-standard:240ms;--motion-ease:cubic-bezier(.2,.7,.2,1)}
/* Size the banner from its own column, including the narrow desktop layout. */
.ref-home .ref-hero{container-type:inline-size;height:auto;min-width:0;--hero-controls-height:56px}
.ref-home .ref-hero-surface{position:relative;inset:auto;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);align-items:center;gap:clamp(16px,4cqw,32px);min-height:calc(254px + clamp(24px,4.5cqw,36px) + var(--hero-controls-height) + 24px);padding:clamp(24px,4.5cqw,36px);padding-bottom:calc(var(--hero-controls-height) + 24px)}
.ref-home .ref-hero-copy{grid-column:1;grid-row:1;animation:none;max-width:none;min-width:0;width:100%;padding:0}
.ref-home .ref-hero-outgoing{position:absolute;inset:0;z-index:3;pointer-events:none;will-change:opacity}
.ref-home .ref-hero-label{display:block;font-size:14px;line-height:21px;min-height:21px;margin-bottom:12px}
.ref-home .ref-hero h1{font-size:clamp(24px,5.3cqw,38px);line-height:1.3;letter-spacing:-.035em;margin:0;word-break:keep-all}
.ref-home .ref-hero-copy>p{max-width:100%;font-size:clamp(14px,2.4cqw,16px);min-height:3em;line-height:1.5;margin-top:12px;margin-bottom:0;white-space:normal;word-break:keep-all;overflow-wrap:break-word}
.ref-home .ref-hero-link{min-width:0;min-height:44px;max-width:100%;padding:10px 16px;margin-top:18px;font-size:13px;line-height:1.5;gap:8px;justify-content:center;white-space:nowrap}
.ref-home .ref-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
/* Full photograph with a navy veil; copy remains above it inside the existing cutout. */
.ref-home .ref-hero-photo .ref-hero-image{inset:0;width:100%;height:100%;object-position:center}
.ref-home .ref-hero-photo .ref-hero-surface::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:color-mix(in srgb,var(--srl-color-heading) 68%,transparent)}
.ref-home .ref-hero-photo .ref-hero-copy{grid-column:1 / -1;max-width:100%;z-index:1}
.ref-home .ref-hero-photo .ref-hero-copy :is(h1,p,.ref-hero-label){color:var(--srl-white)}
/* A subdued semiconductor photograph supports the public sample banner. */
.ref-home .ref-hero-sample .ref-hero-surface{background:var(--srl-color-heading);overflow:hidden}
.ref-home .ref-hero-sample .ref-hero-image{position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:center 52%;box-shadow:none;opacity:.34;filter:none;mix-blend-mode:normal;mask-image:none;pointer-events:none}
.ref-home .ref-hero-sample .ref-hero-copy{grid-column:1 / -1;max-width:100%}
.ref-home .ref-hero-sample .ref-hero-copy :is(h1,p,.ref-hero-label){color:var(--srl-white)}

.ref-home .ref-hero-controls{width:min(272px,calc(100% - 48px));height:var(--hero-controls-height);padding:6px 8px;display:grid;grid-template-columns:36px minmax(0,1fr) repeat(2,44px);gap:4px}
.ref-hero-controls>span{display:block;width:36px;white-space:nowrap;font-variant-numeric:tabular-nums}
.ref-hero-controls b{display:inline-block;min-width:2ch}
.ref-home .ref-hero-controls>button{width:44px;height:44px;border-radius:4px}
.ref-home .ref-hero-dots{padding:0;justify-content:center;gap:2px}
.ref-home .ref-hero-dots button{position:relative;flex:0 0 24px;width:24px;height:44px}
.ref-home .ref-hero-dots button:after{width:16px;background:#dbe1e3}
.ref-hero-progress{position:absolute;left:4px;top:calc(50% - 1.5px);width:16px;height:3px;background:#165dba;border-radius:3px;transform:scaleX(0);transform-origin:left center;pointer-events:none}
@media(prefers-reduced-motion:reduce){.ref-home .ref-hero-dots button[aria-pressed="true"]:after{background:#165dba}}
.ref-home .ref-hero-controls>button:hover{background:#eef2f6}
@container (max-width:420px){
 .ref-home .ref-hero-surface{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:14px;min-height:326px;padding:24px 20px 80px}
 .ref-home .ref-hero-label{font-size:13px;margin-bottom:10px}
 .ref-home .ref-hero-copy>p{font-size:14px;margin-top:10px}
 .ref-home .ref-hero-link{font-size:12px;padding:10px 12px;gap:6px;margin-top:16px}
}
@container (max-width:310px){
 .ref-home .ref-hero-surface{gap:12px;padding-inline:16px}
 .ref-home .ref-hero h1{font-size:22px}
 .ref-home .ref-hero-link{font-size:11px;padding-inline:10px}
 .ref-home .ref-hero-controls{padding-inline:4px;gap:2px}
}

:is(.ref-hero-link,.ref-heading>a,.ref-corner-link,.srl-login-welcome>a,.sdi-login-icon) svg{transition:transform var(--motion-standard) var(--motion-ease)}
.ref-service .ref-corner-link{transition:background-color var(--motion-fast)}
.sdi-header-search{transition:border-color var(--motion-fast),box-shadow var(--motion-fast)}
.sdi-header-search:focus-within{box-shadow:0 0 0 3px #185cba16}
.sdi-nav-title{position:relative}
.sdi-nav-title::after{content:"";position:absolute;left:24%;right:24%;bottom:0;height:2px;background:#195bab;transform:scaleX(0);transform-origin:center;transition:transform var(--motion-standard) var(--motion-ease)}
.sdi-nav-group:focus-within>.sdi-nav-title::after{transform:scaleX(1)}
.sdi-full-menu{animation:ui-panel-in 200ms var(--motion-ease)}
.sdi-search-drawer{animation:ui-search-in 240ms cubic-bezier(.2,.7,.2,1)}
@keyframes ui-search-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.sdi-full-menu details[open]>nav,.sdi-faq-list details[open]>div{animation:ui-answer-in 180ms var(--motion-ease)}
.sdi-full-menu summary::after,.sdi-faq-list summary i{transition:transform 180ms var(--motion-ease)}
.sdi-faq-list details[open] summary i{transform:rotate(180deg)}
#dialog[open]{animation:ui-dialog-in 200ms var(--motion-ease)}
#dialog[open]::backdrop{animation:ui-backdrop-in 160ms ease-out}
.ref-shelf-controls button:disabled{opacity:.34;cursor:default;box-shadow:none;transform:none}
.ref-book-cover:focus-visible,.ref-quick:focus-visible,.ref-service:focus-visible{outline:3px solid #276abe;outline-offset:4px}
@media(hover:hover) and (pointer:fine){
 .ref-book-cover:hover{transform:translateY(-3px);box-shadow:3px 4px 0 #d7dfe9,5px 9px 16px #172b4514}
 .ref-quick:hover,.ref-service-stack>a:hover{transform:translateY(-2px)}
 .ref-hero-link:hover svg,.ref-heading>a:hover svg,.srl-login-welcome>a:hover svg{transform:translateX(3px)}
 .ref-service:hover .ref-corner-link{background:#164a85}
 .ref-service:hover .ref-corner-link svg{transform:translate(2px,-2px)}
 .sdi-nav-group:hover>.sdi-nav-title::after{transform:scaleX(1)}
 .sdi-nav-group:hover>.sdi-dropdown{animation:ui-answer-in 160ms var(--motion-ease)}
 .ref-main-videos a:hover img,.ref-library-tile:hover img{transform:scale(1.025)}
}
:is(.ref-quick,.sdi-button,.srl-social-buttons button,.ref-shelf-controls button,.sr-controls button):active:not(:disabled){transform:translateY(1px)}
@keyframes ui-panel-in{from{opacity:.55;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}
@keyframes ui-answer-in{from{opacity:.4;transform:translateY(-3px)}to{opacity:1;transform:translateY(0)}}
@keyframes ui-dialog-in{from{opacity:0;transform:translateY(6px) scale(.99)}to{opacity:1;transform:none}}
@keyframes ui-backdrop-in{from{opacity:0}to{opacity:1}}
@media(prefers-reduced-motion:reduce){
 *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
 .ref-book-cover:hover,.ref-quick:hover,.ref-service-stack>a:hover,.ref-service:hover .ref-corner-link svg,.ref-hero-link:hover svg,.ref-heading>a:hover svg,.srl-login-welcome>a:hover svg,.ref-main-videos a:hover img,.ref-library-tile:hover img{transform:none!important}
 :is(.ref-quick,.sdi-button,.srl-social-buttons button,.ref-shelf-controls button,.sr-controls button):active:not(:disabled){transform:none}
}

.sdi-search-backdrop {animation:ui-backdrop-in 200ms var(--motion-ease)}
@media(prefers-reduced-motion:reduce){.sdi-search-backdrop{animation:none}}

.ref-home .ref-hero-surface.ref-hero-outgoing::after{display:none}
