.search-intro{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:minmax(220px,1fr) minmax(0,600px);gap:24px;min-height:460px;padding:24px 28px clamp(220px,24vw,300px);border:1px solid #3b4e7c;border-radius:26px;background:#09182f;align-items:start;box-shadow:0 12px 36px #17234414}.hero-art{position:absolute;inset:0;z-index:-2;pointer-events:none}.hero-art img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;opacity:1;animation:hero-image-glow 16s ease-in-out infinite;will-change:filter}.search-intro:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#09182f96 0%,#09182f20 50%,transparent 100%);pointer-events:none}.hero-art:after{content:"";position:absolute;inset:-25%;background:radial-gradient(ellipse at 20% 50%,#518bdf50,transparent 45%),radial-gradient(ellipse at 80% 65%,#ebc98545,transparent 40%),radial-gradient(ellipse at 55% 70%,#9a82d530,transparent 38%);mix-blend-mode:screen;opacity:.4;animation:hero-shimmer 12s ease-in-out infinite alternate;will-change:transform,opacity}.search-intro h1{color:#f3f6ff;text-shadow:0 2px 12px #061122}.search-intro>div>.refresh-directory{color:#eef3ff;background-color:#1b315b;border:1px solid #5a76ab}.search-intro .quote-panel{width:100%;min-height:180px;padding:18px 22px;background:#102241e8;border-color:#597299;box-shadow:3px 4px 0 #d9f45b;backdrop-filter:blur(12px)}[data-theme="dark"] .search-intro .quote-panel{background:#102241e8;border-color:#597299}.search-intro>div:first-child{min-width:0;padding-top:8px}.search-intro .quote-panel blockquote{font-size:clamp(25px,2.3vw,30px);line-height:1.35}.hero-art+*{position:relative}@keyframes hero-image-glow{0%,100%{filter:hue-rotate(-6deg) saturate(1) brightness(.96)}35%{filter:hue-rotate(8deg) saturate(1.12) brightness(1.12)}70%{filter:hue-rotate(0deg) saturate(1.05) brightness(1.04)}}@keyframes hero-shimmer{from{transform:translate3d(-8%,2%,0);opacity:.4}to{transform:translate3d(8%,-5%,0);opacity:.75}}@media(max-width:900px){.search-intro{grid-template-columns:minmax(0,1fr);min-height:0;padding:24px 24px clamp(150px,29vw,260px);gap:18px}.search-intro>div:first-child{padding-top:0}.search-intro .quote-panel{min-height:0}.hero-art img{object-fit:contain;object-position:center bottom}}@media(max-width:700px){.search-intro{padding:20px 18px clamp(115px,32vw,220px);border-radius:22px;gap:16px}.search-intro .quote-panel{padding:18px}.hero-art:after{animation-duration:16s}}@media(prefers-reduced-motion:reduce){.hero-art img{animation:none;will-change:auto;filter:none}.hero-art:after{animation:none;will-change:auto;opacity:.4}}@media(forced-colors:active){.hero-art,.search-intro:before{display:none}.search-intro h1{color:CanvasText;text-shadow:none}.search-intro{background:Canvas}.search-intro .quote-panel{background:Canvas;color:CanvasText}}

.search-intro>div:first-child{flex-wrap:wrap}
.search-intro>div:first-child h1{flex-basis:100%}
.search-intro .skill-search-trigger{display:inline-flex;align-items:center;gap:9px;margin:0;padding:12px 20px}
.skill-search-trigger svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}

/* Theme changes affect the decorative layers, never the hero's geometry. */
.hero-art img{position:absolute;inset:0}
.hero-art .hero-image-light{opacity:0}
[data-theme="light"] .hero-art .hero-image-dark{opacity:0}
[data-theme="light"] .hero-art .hero-image-light{opacity:1}
[data-theme="light"] .search-intro{background:#eaf0f3;border-color:#c1ccd9}
[data-theme="light"] .search-intro:before{background:linear-gradient(180deg,#eaf0f380 0%,#eaf0f315 50%,transparent 100%)}
[data-theme="light"] .search-intro h1{color:#182f46;text-shadow:none}
[data-theme="light"] .search-intro .quote-panel{background:#fffffff0;border-color:#b9c7d8;color:#182f46;box-shadow:3px 4px 0 #abc754}
[data-theme="light"] .search-intro .quote-panel figcaption{color:#496121}
[data-theme="light"] .search-intro>div>.refresh-directory{color:#28436d;background:#ffffffc9;border-color:#b6c5d4}
[data-theme="light"] .hero-art:after{background:radial-gradient(ellipse at 20% 50%,#f3d69b28,transparent 45%),radial-gradient(ellipse at 80% 65%,#a5c6f520,transparent 40%)}
@media(forced-colors:active){[data-theme="light"] .search-intro,[data-theme="light"] .search-intro .quote-panel{background:Canvas;color:CanvasText}[data-theme="light"] .search-intro h1{color:CanvasText}[data-theme="light"] .search-intro .quote-panel figcaption{color:CanvasText}}

/* Continue the photographed wall above the scene without moving or stretching its objects. */
.hero-art:before{content:"";position:absolute;top:0;left:0;width:100%;height:400%;background:url("/hero-art/skill-exchange-natural.webp") center top/cover no-repeat}
[data-theme="light"] .hero-art:before{background-image:url("/hero-art/skill-exchange-daylight-light-screens.webp")}
.hero-art img{inset:auto 0 0;width:100%;height:auto;object-fit:contain;mask-image:linear-gradient(180deg,transparent 0%,#000 18%);-webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 18%)}