/* WolfParts: motion and polish layer. Loads after theme.css. */
:root {
  --ease: cubic-bezier(.2, .7, .2, 1);
  --glow: rgba(25, 200, 255, .35);
  --r: 16px;
  --sh1: 0 1px 2px rgba(10, 24, 40, .06), 0 10px 28px rgba(10, 24, 40, .07);
  --sh2: 0 2px 4px rgba(10, 24, 40, .06), 0 22px 50px rgba(10, 24, 40, .16);
}
@property --wfa { syntax: "<angle>"; inherits: false; initial-value: 0deg; }

@keyframes wfRise { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }
@keyframes wfFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes wfShimmer { to { background-position: -220% 0; } }
@keyframes wfAurora {
  0% { transform: translate3d(-2%, -1%, 0) scale(1); }
  50% { transform: translate3d(3%, 2%, 0) scale(1.08) rotate(2deg); }
  100% { transform: translate3d(-1%, 3%, 0) scale(1.04) rotate(-2deg); }
}
@keyframes wfSpin { to { --wfa: 360deg; } }
@keyframes wfRoad { to { background-position-x: 52px; } }
@keyframes wfFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }
@keyframes wfMarq { to { transform: translateX(-50%); } }
@keyframes wfPulse {
  0% { box-shadow: 0 0 0 0 rgba(25, 200, 255, .55); }
  70% { box-shadow: 0 0 0 20px rgba(25, 200, 255, 0); }
  100% { box-shadow: 0 0 0 0 rgba(25, 200, 255, 0); }
}
@keyframes wfBand { to { background-position: 100% 0; } }
@keyframes wfBump { 30% { transform: scale(1.35) rotate(-10deg); } 60% { transform: scale(.94); } }
@keyframes wfToast { from { opacity: 0; transform: translate(-50%, 16px) scale(.96); } to { opacity: 1; transform: translate(-50%, 0) scale(1); } }
@keyframes wfPop { 0% { transform: scale(.3); opacity: 0; } 70% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }
@keyframes wfPlate { from { opacity: 0; transform: translateY(10px) rotateX(-18deg); } to { opacity: 1; transform: none; } }
@keyframes wfSkel { to { background-position: -200% 0; } }

[hidden] { display: none !important; }
/* "hidden" on html/body would switch off the sticky header; "clip" does not. */
@media (max-width: 980px) { html, body { overflow-x: clip; } }
html { scroll-padding-top: 96px; }
body { animation: wfFade .5s ease both; }
::selection { background: #19c8ff; color: #04121c; }

/* progress line */
.wf-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 80; transform-origin: 0 50%; transform: scaleX(var(--p, 0)); background: linear-gradient(90deg, #19c8ff, #0c6eae, #7ee7ff); pointer-events: none; }

/* buttons */
.wf-btn {
  position: relative;
  overflow: hidden;
  border-radius: 12px;
  border-color: transparent;
  background: linear-gradient(135deg, #0c6eae, #1394dc);
  box-shadow: 0 6px 18px rgba(12, 110, 174, .28);
  transition: transform .25s var(--ease), box-shadow .3s ease, filter .2s ease;
}
.wf-btn:hover { background: linear-gradient(135deg, #0d78bd, #19aaf2); border-color: transparent; transform: translateY(-2px); box-shadow: 0 8px 18px rgba(12, 110, 174, .22); }
.wf-btn:active { transform: translateY(0) scale(.97); }
.wf-btn--line { background: #fff; color: var(--blue); border: 1px solid rgba(12, 110, 174, .55); box-shadow: none; }
.wf-btn--line:hover { background: #eef7fd; color: var(--blue-2); border-color: var(--blue); box-shadow: 0 8px 20px rgba(12, 110, 174, .16); }
.wf-btn.is-added { background: linear-gradient(135deg, #0e7a4b, #17a869); box-shadow: 0 6px 18px rgba(14, 122, 75, .3); }
.wf-btn.is-added::before { content: "✓"; font-weight: 800; }
a { transition: color .2s ease; }

/* header */
.wf-header { transition: box-shadow .35s ease; }
.wf-header.is-scrolled { box-shadow: 0 12px 34px rgba(0, 0, 0, .4); }
/* The thin top bar scrolls away on its own; the header never changes height, so the page cannot jump. */
@media (min-width: 681px) { .wf-header { top: -33px; } :root { --header: 92px; } }
@media (min-width: 783px) { body.admin-bar .wf-header { top: 32px; } }
@media (max-width: 782px) { body.admin-bar .wf-header { top: 46px; } }
.wf-header .wf-logo img { transition: height .35s var(--ease), bottom .35s var(--ease); }
@media (min-width: 981px) {
  .wf-header.is-scrolled .wf-logo img { height: 88px !important; bottom: -4px; }
}
.wf-menu a { position: relative; }
.wf-headsearch { border-radius: 12px; transition: border-color .25s, background .25s, width .35s var(--ease), flex-basis .35s var(--ease); }
.wf-headsearch:focus-within { background: #18222d; }
@media (min-width: 981px) { .wf-headsearch:focus-within { width: 300px; flex-basis: 300px; } }
.wf-headsearch__results { width: min(440px, calc(100vw - 32px)); border-radius: 14px; box-shadow: var(--sh2); animation: wfFade .2s ease both; }
.wf-headsearch__results a { transition: background .15s; }
.wf-headsearch__results a.is-active, .wf-headsearch__results a:hover { background: #eaf7ff; }
.wf-skel { display: grid; gap: 6px; padding: 12px 14px; }
.wf-skel i { display: block; height: 12px; border-radius: 6px; background: linear-gradient(90deg, #eef2f6 25%, #dbe5ee 50%, #eef2f6 75%); background-size: 200% 100%; animation: wfSkel 1.1s linear infinite; }
.wf-skel i:nth-child(2) { width: 62%; }
.wf-searchnone { padding: 14px; color: var(--muted); font-size: .95rem; }
.wf-cart.is-bump { animation: wfBump .6s var(--ease); }
.wf-cart strong { border-radius: 999px; background: linear-gradient(135deg, #19c8ff, #0c6eae); }
.wf-fly { position: fixed; z-index: 90; left: 0; top: 0; width: 18px; height: 18px; margin: -9px 0 0 -9px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #fff, #19c8ff 55%, #0c6eae); box-shadow: 0 0 18px var(--glow); pointer-events: none; }

.wf-garage { animation: wfFade .5s ease both; }
.wf-garage select { border-radius: 8px; }

/* hero */
.wf-hero { isolation: isolate; }
.wf-hero::before { z-index: -1; }
.wf-hero::after { content: ""; position: absolute; inset: -20% -10%; z-index: -1; pointer-events: none; background: radial-gradient(40% 50% at 18% 30%, rgba(25, 200, 255, .24), transparent 70%), radial-gradient(34% 46% at 82% 18%, rgba(36, 99, 255, .3), transparent 70%), radial-gradient(30% 40% at 58% 92%, rgba(126, 231, 255, .14), transparent 70%); animation: wfAurora 22s ease-in-out infinite alternate; will-change: transform; }
.wf-hero__kicker { animation: wfRise .8s var(--ease) both; }
.wf-hero h1 span { display: block; }
.wf-hero__l1 { animation: wfRise .9s var(--ease) both .05s; }
.wf-hero__l2 { padding-bottom: .06em; background: linear-gradient(100deg, #fff 0%, #7ee7ff 32%, #19c8ff 52%, #fff 78%); background-size: 220% 100%; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; animation: wfRise .9s var(--ease) both .18s, wfShimmer 7s linear infinite 1.4s; }
.wf-hero__lead { animation: wfRise .9s var(--ease) both .3s; }
.wf-rotator { margin: 16px 0 0; font-size: 1.3rem; color: #c5d2e0; animation: wfRise .9s var(--ease) both .4s; }
.wf-rotator b { display: inline-block; min-width: 10ch; padding-bottom: 1px; color: #fff; border-bottom: 2px solid var(--cyan); }
.wf-quick { animation: wfRise .9s var(--ease) both .5s; }
.wf-quick a { border-radius: 999px; padding: 0 16px; background: rgba(255, 255, 255, .04); transition: transform .25s var(--ease), background .25s, border-color .25s, color .25s; }
.wf-quick a:hover { transform: translateY(-2px); background: rgba(25, 200, 255, .12); }
.wf-hero__road { display: none; }
.wf-trust { border-top: 0; background: rgba(255, 255, 255, .02); }
.wf-trust .wf-ico { animation: wfFloat 4s ease-in-out infinite; }
.wf-trust__grid > div:nth-child(2) .wf-ico { animation-delay: .5s; }
.wf-trust__grid > div:nth-child(3) .wf-ico { animation-delay: 1s; }
.wf-trust__grid > div:nth-child(4) .wf-ico { animation-delay: 1.5s; }

/* vehicle finder */
.wf-hero .wf-finder { position: relative; padding: 22px; border-radius: 20px; color: #e8eef5; border: 1px solid rgba(110, 190, 255, .28); background: linear-gradient(180deg, rgba(14, 24, 36, .9), rgba(8, 14, 22, .94)); box-shadow: 0 34px 90px rgba(0, 0, 0, .55); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); animation: wfRise 1s var(--ease) both .25s; }
.wf-hero .wf-finder::before { content: none; }
.wf-hero .wf-finder label { color: #9eb0c2; }
.wf-hero .wf-finder input:not([data-plate-input]), .wf-hero .wf-finder select { background: #0b1622; border-color: #22384d; color: #fff; border-radius: 12px; color-scheme: dark; }
.wf-hero .wf-finder input::placeholder { color: #5f7690; }
.wf-hero .wf-finder select:disabled { opacity: .4; }
.wf-hero .wf-finder .wf-detected { background: #0b2233; border-color: #1c4561; color: #bfeaff; border-radius: 12px; }
.wf-hero .wf-idgrid { grid-template-columns: 1.15fr .85fr; align-items: start; }
.wf-hero .wf-idgrid input[name="vin"] { min-height: 52px; }
.wf-finder__label { font-size: 1.6rem; }
.wf-finder__sub { margin: 0 0 4px; color: #9eb0c2; font-size: .95rem; }
.wf-finder__bar { display: block; height: 4px; border-radius: 4px; background: rgba(255, 255, 255, .08); overflow: hidden; }
.wf-finder__bar i { display: block; height: 100%; width: var(--fp, 0%); background: linear-gradient(90deg, #19c8ff, #7ee7ff); transition: width .6s var(--ease); }
.wf-finder > .wf-btn { min-height: 52px; font-size: 1.05rem; }
.wf-finder > .wf-btn::before { content: none; }

/* estonian plate input */
.wf-plate { display: flex; align-items: stretch; height: 52px; border-radius: 9px; overflow: hidden; background: #fff; border: 2px solid #121920; box-shadow: 0 6px 16px rgba(0, 0, 0, .25), inset 0 -3px 0 rgba(0, 0, 0, .06); animation: wfPlate .8s var(--ease) both .45s; transition: box-shadow .25s, border-color .25s; }
.wf-plate:focus-within { border-color: #19c8ff; box-shadow: 0 0 0 4px rgba(25, 200, 255, .25), 0 6px 16px rgba(0, 0, 0, .25); }
.wf-plate__eu { flex: 0 0 38px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: #0b3d91; color: #fff; }
.wf-plate__eu svg { width: 22px; height: 22px; }
.wf-plate__eu b { font-size: .64rem; font-weight: 800; letter-spacing: .04em; line-height: 1; }
.wf-plate input[data-plate-input] { min-height: 0; height: 100%; border: 0; border-radius: 0; background: #fff; box-shadow: none; padding: 0 10px; color: #111; text-align: center; text-transform: uppercase; letter-spacing: .14em; font-family: "Barlow Condensed", "Outfit", sans-serif; font-size: 1.9rem; font-weight: 700; }
.wf-plate input[data-plate-input]::placeholder { color: #c1cad4; letter-spacing: .14em; }
.wf-plate input[data-plate-input]:focus { box-shadow: none; }

/* inputs */
input, select, textarea { border-radius: 12px; transition: border-color .2s, box-shadow .25s, background .2s; }
input:focus, select:focus, textarea:focus { box-shadow: 0 0 0 4px rgba(25, 200, 255, .2); }

/* reveal on scroll */
.wf-motion .wf-cat, .wf-motion .wf-card, .wf-motion .wf-steps li, .wf-motion .wf-section__head, .wf-motion .wf-trust__grid > div, .wf-motion .wf-post, .wf-motion .wf-faq details, .wf-motion .wf-homegrid > *, .wf-motion .wf-band__in, .wf-motion .wf-jobs a, .wf-motion .wf-models li, .wf-motion .wf-makelist li, .wf-motion .wf-prose > *, .wf-motion .wf-sheet, .wf-motion .wf-basket, .wf-motion .wf-filters, .wf-motion .wf-recent a, .wf-motion .wf-pagehead .wf-container > * {
  opacity: 0;
  translate: 0 28px;
  transition: opacity .75s var(--ease), translate .75s var(--ease), transform .35s var(--ease), box-shadow .35s ease, border-color .3s ease;
  transition-delay: calc(var(--i, 0) * 70ms), calc(var(--i, 0) * 70ms), 0s, 0s, 0s;
}
.wf-motion .is-in.is-in.is-in { opacity: 1; translate: 0 0; }
.wf-section__head h2::after, .wf-homegrid h2::after { content: ""; display: block; width: 48px; height: 4px; margin-top: 10px; border-radius: 4px; background: linear-gradient(90deg, var(--cyan), var(--blue)); transform-origin: left; }
.wf-motion .wf-section__head h2::after, .wf-motion .wf-homegrid h2::after { transform: scaleX(0); transition: transform .9s var(--ease) .25s; }
.wf-motion .is-in h2::after, .wf-motion h2.is-in::after { transform: scaleX(1); }

/* category tiles and cards */
.wf-cats { gap: 14px; }
.wf-cat, .wf-card, .wf-post, .wf-steps li { position: relative; border-radius: var(--r); border: 1px solid #e3eaf1; background: #fff; box-shadow: var(--sh1); transition: transform .35s var(--ease), box-shadow .35s ease, border-color .3s ease; }
.wf-cat { overflow: hidden; }
.wf-cat:hover, .wf-card:hover { transform: translateY(-4px); box-shadow: var(--sh2); border-color: #c5d3e0; }
.wf-cat .wf-partphoto, .wf-card__media img, .wf-card .wf-ph { transition: transform .7s var(--ease); }
.wf-cat:hover .wf-partphoto { transform: scale(1.04); }
.wf-card:hover .wf-card__media img, .wf-card:hover .wf-ph { transform: scale(1.04); }
.wf-cat strong::after { content: "→"; display: inline-block; margin-left: 6px; opacity: 0; transform: translateX(-6px); transition: opacity .3s, transform .3s var(--ease); color: var(--blue); }
.wf-cat:hover strong::after { opacity: 1; transform: none; }
.wf-card__media { overflow: hidden; background: radial-gradient(circle at 50% 38%, #fff, #edf2f7); }
.wf-card__body { position: relative; z-index: 2; }
.wf-card .wf-btn { border-radius: 12px; }
.wf-card h2 { font-size: 1.12rem; }
.wf-fitbadge { border-radius: 999px; padding: 3px 10px; }
.wf-jobs a { border-radius: 999px; transition: transform .25s var(--ease), background .25s, color .25s, border-color .25s; }
.wf-jobs a:hover { transform: translateY(-2px); background: var(--blue); border-color: var(--blue); color: #fff; }

/* makes marquee */
.wf-makes { background: linear-gradient(180deg, #0b1218, #0a1a28); border-top: 1px solid rgba(255, 255, 255, .06); border-bottom: 1px solid rgba(255, 255, 255, .06); padding: 22px 0; }
.wf-makes__in > p { display: flex; align-items: baseline; gap: 8px; }
.wf-makes__in > p strong { font-size: 2rem; color: #fff; line-height: 1; }
.wf-makebar a { border: 1px solid rgba(255, 255, 255, .14); border-radius: 999px; padding: 8px 18px; white-space: nowrap; transition: background .25s, border-color .25s, color .25s; }
.wf-makebar a:hover { background: rgba(25, 200, 255, .14); border-color: var(--cyan); color: #fff; }
.wf-makebar.is-marquee { flex-wrap: nowrap; overflow: hidden; gap: 0; padding-block: 8px; -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent); }
.wf-makebar__track { display: flex; gap: 12px; padding-right: 12px; width: max-content; animation: wfMarq var(--dur, 40s) linear infinite; }
.wf-makebar.is-marquee:hover .wf-makebar__track { animation-play-state: paused; }

/* steps */
.wf-steps li { padding: 26px 24px 22px; overflow: hidden; transition: transform .35s var(--ease), box-shadow .35s ease, border-color .3s ease; }
.wf-steps li span { font-size: 3.4rem; background: linear-gradient(135deg, #19c8ff, #0c6eae); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; }
.wf-steps li:hover { transform: translateY(-4px); box-shadow: var(--sh2); border-color: #c5d3e0; }
.wf-steps li:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: 0; width: 28px; height: 2px; background: linear-gradient(90deg, var(--cyan), transparent); }

/* band */
.wf-band { background: linear-gradient(115deg, #05101a, #0b3350 48%, #05101a, #0b3350); background-size: 220% 100%; animation: wfBand 16s ease-in-out infinite alternate; }
.wf-band h2 { font-size: clamp(1.9rem, 3vw, 2.6rem); }
.wf-band .wf-btn { min-height: 54px; padding: 0 28px; animation: wfPulse 2.8s infinite; }

/* faq */
.wf-faq details { border: 1px solid #e3eaf1; border-radius: 14px; padding: 0; margin: 0 0 10px; background: #fff; overflow: hidden; transition: box-shadow .3s ease, border-color .3s ease; }
.wf-faq summary { position: relative; padding: 15px 48px 15px 18px; list-style: none; transition: color .2s; }
.wf-faq summary::-webkit-details-marker { display: none; }
.wf-faq summary:hover { color: var(--blue); }
.wf-faq summary::after { content: "+"; position: absolute; right: 18px; top: 50%; transform: translateY(-50%); font-size: 1.5rem; line-height: 1; color: var(--blue); transition: transform .3s var(--ease); }
.wf-faq details[open] { border-color: rgba(12, 110, 174, .45); box-shadow: var(--sh1); }
.wf-faq details[open] summary::after { transform: translateY(-50%) rotate(45deg); }
.wf-faq details p { margin: 0; padding: 0 18px 16px; color: var(--muted); animation: wfFade .4s var(--ease) both; }

/* footer, toast, dock */
.wf-footer { position: relative; }
.wf-footer::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--cyan), var(--blue), transparent); }
.wf-footer a { transition: color .2s; }
.wf-footer a:hover { color: var(--cyan); }
.wf-toast { border-radius: 14px; box-shadow: var(--sh2); border: 1px solid rgba(25, 200, 255, .3); animation: wfToast .35s var(--ease) both; }
.wf-toast[hidden] { display: none; }

@media (max-width: 980px) {
  .wf-hero .wf-idgrid { grid-template-columns: 1fr 1fr; }
  .wf-steps li:not(:last-child)::after { content: none; }
}
@media (max-width: 680px) {
  .wf-hero::after { filter: none; opacity: .8; }
  .wf-hero .wf-finder { -webkit-backdrop-filter: none; backdrop-filter: none; padding: 18px; }
  .wf-hero .wf-idgrid { grid-template-columns: 1fr; }
  .wf-hero .wf-fields { grid-template-columns: 1fr 1fr; gap: 10px; }
  .wf-plate { height: 56px; }
  .wf-rotator { font-size: 1.15rem; }
  .wf-dock { border-radius: 18px 18px 0 0; box-shadow: 0 -12px 34px rgba(0, 0, 0, .45); border-top: 1px solid rgba(25, 200, 255, .25); }
  .wf-cat:hover, .wf-card:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .wf-hero::after, .wf-hero__road, .wf-band, .wf-band .wf-btn, .wf-makebar__track, .wf-trust .wf-ico, .wf-hero__l2, .wf-hero .wf-finder::before { animation: none !important; }
  .wf-hero__l2 { background-position: 0 0; }
}