/* IONA JETS site search — morph header + results overlay */
/* premium easing used throughout: cubic-bezier(.16,1,.3,1) */

/* --- Trigger loupe (it slides into place and becomes the search loupe) --- */
.iss-trigger{position:relative;z-index:6;display:inline-flex;align-items:center;justify-content:center;background:transparent;border:0;padding:0;margin:0;cursor:pointer;color:var(--clr-text);font-family:inherit;transition:transform .55s cubic-bezier(.16,1,.3,1),opacity .25s ease}
.iss-trigger svg{width:20px;height:20px;display:block}
.iss-trigger-d{margin-right:20px}
.iss-trigger:hover,.iss-trigger:focus-visible{opacity:.7}
.iss-trigger:focus-visible{outline:2px solid var(--clr-accent);outline-offset:2px;border-radius:3px}
@media (max-width:750px){.iss-trigger-d{display:none}}
html.search-open .iss-trigger{transform:translateX(var(--iss-slide,0))}
html.search-open .iss-trigger:hover{opacity:1}

/* --- Close button: white X in a black circle, left of the loupe (only while open) --- */
.iss-close{position:absolute;top:50%;left:50%;margin-left:-286px;width:26px;height:26px;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;padding:0;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:#000000;color:#ffffff;cursor:pointer;z-index:7;opacity:0;pointer-events:none;transition:opacity .3s ease .12s,background-color .15s ease}
.iss-close svg{width:14px;height:14px;display:block}
.iss-close:hover{background:#1a1a1a}
.iss-close:focus-visible{outline:2px solid #ffffff;outline-offset:2px}
html.search-open .iss-close{opacity:1;pointer-events:auto}
@media (max-width:750px){.iss-close{left:20px;margin-left:0}}

/* --- "Recherche" label in the top band --- */
.iss-label{position:absolute;left:0;right:0;top:0;bottom:0;display:flex;align-items:center;justify-content:center;font-size:14px;line-height:20px;font-weight:bold;letter-spacing:.08em;text-transform:uppercase;color:#ffffff;opacity:0;transform:translateY(2px);pointer-events:none;transition:opacity .4s ease .16s,transform .5s cubic-bezier(.16,1,.3,1) .16s}
html.search-open .iss-label{opacity:1;transform:none}

/* --- Search bar revealed in the second banner --- */
/* desktop/tablet: centered box that unrolls rightward from the loupe */
.iss-bar{position:absolute;top:50%;left:50%;width:44px;margin-left:-240px;height:44px;display:flex;align-items:center;gap:10px;padding:0 6px 0 44px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:10px;overflow:hidden;opacity:0;pointer-events:none;z-index:5;transform:translateY(-50%);transition:opacity .3s ease,width .5s cubic-bezier(.16,1,.3,1)}
.iss-bar-loupe{position:absolute;left:14px;top:50%;transform:translateY(-50%);display:inline-flex;color:#aab0b8;opacity:0;pointer-events:none}
.iss-bar-loupe svg{width:19px;height:19px;display:block}
.iss-field{flex:1;min-width:0;background:transparent;border:0;outline:none;color:#ffffff;font-family:inherit;font-size:15px;line-height:20px}
.iss-field::placeholder{color:#8b9099}
.iss-go{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:32px;height:32px;background:#ffffff;border:0;border-radius:5px;cursor:pointer;opacity:0;transform:scale(.85);transition:opacity .3s ease .34s,transform .35s cubic-bezier(.16,1,.3,1) .34s,background-color .15s ease}
.iss-go svg{width:18px;height:18px;display:block;color:#0a0c10}
.iss-go:hover{background:#e9edf2}
html.search-open .iss-bar{opacity:1;pointer-events:auto;width:480px}
html.search-open .iss-go{opacity:1;transform:scale(1)}

/* mobile: minimal underlined bar at the second-band level (no box) */
@media (max-width:750px){
 .iss-bar{left:96px;right:20px;width:auto;margin-left:0;height:34px;padding:0;background:transparent;border:0;border-radius:0;overflow:visible;transition:opacity .3s ease}
 .iss-bar::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:rgba(255,255,255,.34);transform:scaleX(0);transform-origin:left;transition:transform .55s cubic-bezier(.16,1,.3,1) .08s}
 .iss-bar-loupe{display:none}
 .iss-field{opacity:0;transition:opacity .3s ease .18s}
 .iss-go{width:auto;height:auto;background:transparent;border-radius:0;transform:none;transition:opacity .3s ease .3s}
 .iss-go svg{width:20px;height:20px;color:#ffffff}
 .iss-go:hover{background:transparent}
 html.search-open .iss-bar{width:auto}
 html.search-open .iss-bar::after{transform:scaleX(1)}
 html.search-open .iss-field{opacity:1}
 html.search-open .iss-go{transform:none}
}

/* --- Results panel (masks the site) --- */
.iss-panel{position:fixed;left:0;right:0;bottom:0;top:var(--iss-top,120px);background:#000000;opacity:0;visibility:hidden;z-index:90;overflow-y:auto;overscroll-behavior:contain;transition:opacity .3s ease,visibility 0s linear .3s}
.iss-panel-inner{max-width:760px;margin:0 auto;padding:18px 20px 60px}
.iss-hint{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:#7d828b;margin:8px 6px 8px}
.iss-results{display:flex;flex-direction:column;gap:2px;list-style:none;margin:0;padding:0}
.iss-result{display:flex;align-items:center;gap:14px;padding:10px 12px;border-radius:11px;text-decoration:none;transition:background-color .15s ease}
.iss-result:hover,.iss-result.is-active{background:rgba(255,255,255,.07)}
.iss-result:focus-visible{outline:2px solid var(--clr-accent);outline-offset:-2px}
.iss-thumb{width:96px;height:54px;flex-shrink:0;border-radius:8px;object-fit:cover;background:#1b1f26;border:1px solid rgba(255,255,255,.1)}
.iss-rtext{flex:1;min-width:0}
.iss-rtitle{display:block;font-size:15px;line-height:20px;color:#ffffff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.iss-rcat{display:block;font-size:12.5px;line-height:17px;color:#8b9099;margin-top:2px}
.iss-rgo{flex-shrink:0;color:#586069}
.iss-rgo svg{width:18px;height:18px;display:block}
.iss-empty{padding:30px 12px;text-align:center;color:#8b9099;font-size:14px;line-height:21px}

/* 20px lateral gutter on mobile: header, suggestions and results all align to 20px */
@media (max-width:750px){
 .iss-panel-inner{padding-left:20px;padding-right:20px}
 .iss-result{padding-left:0;padding-right:0}
 .iss-hint{margin-left:0;margin-right:0}
}

/* cascade entrance for the results (only on open, toggled by .iss-cascade) */
@keyframes issIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.iss-results.iss-cascade .iss-result{animation:issIn .5s cubic-bezier(.16,1,.3,1) both}
.iss-results.iss-cascade .iss-result:nth-child(1){animation-delay:.02s}
.iss-results.iss-cascade .iss-result:nth-child(2){animation-delay:.06s}
.iss-results.iss-cascade .iss-result:nth-child(3){animation-delay:.10s}
.iss-results.iss-cascade .iss-result:nth-child(4){animation-delay:.14s}
.iss-results.iss-cascade .iss-result:nth-child(5){animation-delay:.18s}
.iss-results.iss-cascade .iss-result:nth-child(6){animation-delay:.22s}
.iss-results.iss-cascade .iss-result:nth-child(7){animation-delay:.26s}
.iss-results.iss-cascade .iss-result:nth-child(n+8){animation-delay:.30s}

/* --- Active "search mode" on the header --- */
html.search-open #header-container{transform:none!important}
html.search-open #header-first-banner{background:#000000}
html.search-open .top-banner-text,
html.search-open .top-contact-us,
html.search-open .header-second-left,
html.search-open .header-second-right > .quote-button,
html.search-open .header-second-right > .desktop-menu-trigger,
html.search-open .mobile-icons > *:not(.iss-trigger){opacity:0;pointer-events:none}
html.search-open .iss-panel{opacity:1;visibility:visible;transition:opacity .35s ease}
html.search-open #header-second-banner{overflow:hidden}
#header-first-banner{position:relative;transition:background-color .45s ease}
.top-banner-text,.top-contact-us,.header-second-left,.quote-button,.desktop-menu-trigger,.mobile-icons>*{transition:opacity .25s ease}

/* desktop close: fade the whole search UI out (loupe included) instead of sliding the loupe back */
html.iss-closing .iss-trigger,
html.iss-closing .iss-bar,
html.iss-closing .iss-go,
html.iss-closing .iss-label,
html.iss-closing .iss-close,
html.iss-closing .iss-panel{transition:opacity .2s ease!important;opacity:0!important}

@media (prefers-reduced-motion:reduce){
 .iss-bar,.iss-bar::after,.iss-go,.iss-panel,.iss-label,.iss-trigger,.iss-close,.iss-field,#header-first-banner{transition-duration:.01ms!important}
 .iss-results.iss-cascade .iss-result{animation-duration:.01ms!important}
}