/*
 * Jetcar Kromh V17 — Signature Experience
 * Final design and motion system layered over the production site.
 * The system prioritises orientation, feedback, continuity and performance.
 */

:root{
  --v17-ink:#06131f;
  --v17-ink-2:#0b2130;
  --v17-ink-3:#163443;
  --v17-paper:#f4f0e8;
  --v17-paper-2:#fbf9f4;
  --v17-paper-3:#e9e2d7;
  --v17-teal:#2f6270;
  --v17-teal-soft:#a9cdd0;
  --v17-copper:#a9683d;
  --v17-copper-soft:#d7b797;
  --v17-text:#24323b;
  --v17-muted:#6e7a80;
  --v17-line:rgba(6,19,31,.13);
  --v17-line-strong:rgba(6,19,31,.24);
  --v17-line-light:rgba(255,255,255,.17);
  --v17-shadow-1:0 12px 34px rgba(4,15,24,.08);
  --v17-shadow-2:0 24px 70px rgba(4,15,24,.14);
  --v17-shadow-3:0 40px 110px rgba(4,15,24,.22);

  --v17-tap:110ms;
  --v17-fast:170ms;
  --v17-base:260ms;
  --v17-medium:380ms;
  --v17-slow:560ms;
  --v17-cinematic:760ms;
  --v17-ease-enter:cubic-bezier(.16,1,.3,1);
  --v17-ease-standard:cubic-bezier(.2,0,0,1);
  --v17-ease-exit:cubic-bezier(.4,0,1,1);
  --v17-ease-emphasis:cubic-bezier(.22,1,.36,1);

  --v17-radius-xs:4px;
  --v17-radius-sm:8px;
  --v17-radius-md:14px;
  --v17-radius-lg:22px;

  --jk-midnight:var(--v17-ink);
  --jk-midnight-2:var(--v17-ink-2);
  --jk-sapphire:var(--v17-teal);
  --jk-cyan:var(--v17-teal-soft);
  --jk-bronze:var(--v17-copper);
  --jk-bronze-soft:var(--v17-copper-soft);
  --jk-pearl:var(--v17-paper);
  --jk-porcelain:var(--v17-paper-2);
}

html{
  scroll-behavior:smooth;
  background:var(--v17-paper);
  scrollbar-gutter:stable;
}
body{
  background:var(--v17-paper);
  color:var(--v17-ink);
  overflow-x:clip;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed;
  z-index:2400;
  top:0;left:0;
  width:var(--v17-scroll-progress,0%);
  height:2px;
  pointer-events:none;
  background:linear-gradient(90deg,var(--v17-copper),var(--v17-teal-soft));
  box-shadow:0 0 18px rgba(169,104,61,.25);
  transition:width 80ms linear;
}

/* Render-heavy lower sections only when needed, while keeping intrinsic size. */
.jk-definition,.jk-showroom,.jk-commission,.jk-engineering,.jk-craft,.jk-global,.jk-final,
.inner-section,.product-section,.models-grid-section{
  content-visibility:auto;
  contain-intrinsic-size:700px;
}

/* --------------------------------------------------------------------------
   Global interaction language
   -------------------------------------------------------------------------- */
.button,
.model-tab,
.choice-card,
.color-choice,
.review-edit,
.custom-color-confirm,
.custom-color-reset,
.jk-model-browse button,
.config-model-insight-link,
.main-nav a,
.mobile-menu a{
  -webkit-tap-highlight-color:transparent;
}
.button,
.choice-card,
.color-choice,
.model-tab,
.jk-model-browse button,
.custom-color-confirm,
.custom-color-reset,
.review-edit{
  will-change:transform;
}
.button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  transition:
    transform var(--v17-fast) var(--v17-ease-enter),
    color var(--v17-fast),
    background-color var(--v17-fast),
    border-color var(--v17-fast),
    box-shadow var(--v17-base) var(--v17-ease-standard)!important;
}
.button::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:-2px;
  opacity:0;
  transform:translate3d(-112%,0,0) skewX(-18deg);
  background:linear-gradient(105deg,transparent 24%,rgba(255,255,255,.18) 48%,transparent 72%);
  transition:transform var(--v17-slow) var(--v17-ease-enter),opacity var(--v17-fast);
}
@media(hover:hover) and (pointer:fine){
  .button:hover::before{opacity:1;transform:translate3d(112%,0,0) skewX(-18deg)}
  .button:hover{transform:translate3d(0,-2px,0)}
}
.button:active,.is-v17-pressed{transform:translate3d(0,0,0) scale(.982)!important}
.button:focus-visible,.model-tab:focus-visible,.choice-card:focus-visible,.color-choice:focus-visible,
.jk-model-browse button:focus-visible,.config-model-insight-link:focus-visible{
  outline:2px solid var(--v17-teal-soft)!important;
  outline-offset:3px!important;
}

/* Page entry keeps the first meaningful content readable immediately. */
html.jk-v17-ready body{opacity:1}
html.jk-v17-ready main{animation:v17PageIn var(--v17-slow) var(--v17-ease-enter) both}
@keyframes v17PageIn{from{opacity:.35;transform:translate3d(0,8px,0)}to{opacity:1;transform:none}}

/* Header feels attached to the page, not pasted over it. */
.site-header{
  transition:
    height var(--v17-medium) var(--v17-ease-enter),
    background-color var(--v17-medium),
    border-color var(--v17-medium),
    box-shadow var(--v17-medium),
    transform var(--v17-medium) var(--v17-ease-enter)!important;
}
.site-header.is-v17-compact .header-inner{min-height:60px!important}
.site-header.is-v17-hidden{transform:translate3d(0,-105%,0)!important}
.brand-mark-svg{
  transition:transform var(--v17-medium) var(--v17-ease-emphasis),color var(--v17-fast);
  transform-origin:50% 50%;
}
@media(hover:hover) and (pointer:fine){
  .brand:hover .brand-mark-svg{transform:rotate(-4deg) scale(1.045)}
}
.main-nav a{position:relative}
.main-nav a::after{
  transform-origin:center!important;
  transition:transform var(--v17-medium) var(--v17-ease-emphasis)!important;
}

/* --------------------------------------------------------------------------
   Homepage — editorial but more decisive
   -------------------------------------------------------------------------- */
.home-v11 .jk-hero{
  --hero-x:0px;
  --hero-y:0px;
  min-height:max(760px,100svh);
  overflow:hidden;
}
.home-v11 .jk-hero-media{
  isolation:isolate;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);
}
.home-v11 .jk-hero-media::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,rgba(244,240,232,.98) 0%,rgba(244,240,232,.92) 24%,rgba(244,240,232,.48) 42%,transparent 63%),
    linear-gradient(0deg,rgba(4,15,24,.28),transparent 38%);
}
.home-v11 .jk-hero-media img{
  transform:translate3d(var(--hero-x),var(--hero-y),0) scale(1.026)!important;
  transition:transform 900ms var(--v17-ease-emphasis),filter var(--v17-slow)!important;
  filter:saturate(.92) contrast(1.025);
}
.home-v11 .jk-hero.is-v17-settled .jk-hero-media img{transform:translate3d(var(--hero-x),var(--hero-y),0) scale(1.006)!important}
.home-v11 .jk-hero-copy{
  width:min(720px,55vw)!important;
  z-index:4;
}
.home-v11 .jk-hero-copy h1{
  letter-spacing:-.045em;
  text-wrap:balance;
}
.home-v11 .jk-hero-copy h1 em{
  color:var(--v17-teal)!important;
  text-shadow:none!important;
}
.home-v11 .jk-hero-copy>p{
  max-width:510px!important;
  font-size:14px!important;
  color:#40505a!important;
}
.home-v11 .jk-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.home-v11 .jk-kicker::before{
  content:"";
  width:26px;
  height:1px;
  background:var(--v17-copper);
  transform-origin:left;
  animation:v17LineIn var(--v17-cinematic) var(--v17-ease-enter) both;
}
@keyframes v17LineIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.home-v11 .jk-hero-actions{gap:14px!important}
.home-v11 .jk-hero-actions .button{min-height:54px}
.home-v11 .jk-hero-actions .jk-text-link{
  min-height:54px;
  display:inline-flex;
  align-items:center;
  padding-inline:18px;
  border:1px solid var(--v17-line-strong)!important;
  color:var(--v17-ink)!important;
  transition:background-color var(--v17-fast),border-color var(--v17-fast),transform var(--v17-fast) var(--v17-ease-enter)!important;
}
@media(hover:hover) and (pointer:fine){
  .home-v11 .jk-hero-actions .jk-text-link:hover{background:rgba(255,255,255,.46);border-color:var(--v17-ink)!important;transform:translate3d(0,-2px,0)}
}
.home-v11 .jk-hero-specs{
  z-index:5;
  border-top-color:rgba(6,19,31,.22)!important;
  color:var(--v17-ink)!important;
  backdrop-filter:blur(8px);
}
.home-v11 .jk-hero-specs div{border-color:rgba(6,19,31,.14)!important}
.home-v11 .jk-hero-specs strong{font-variant-numeric:tabular-nums}
.home-v11 .jk-hero-diamond{
  opacity:.55;
  transform:rotate(45deg) translate3d(calc(var(--hero-x) * -.4),calc(var(--hero-y) * -.4),0)!important;
  transition:transform 1100ms var(--v17-ease-emphasis);
}


/* Desktop hero specification rail: guarantee readable contrast over every image. */
@media(min-width:768px){
  .home-v11 .jk-hero-specs{
    background:rgba(244,240,232,.86)!important;
    border:1px solid rgba(6,19,31,.16)!important;
    box-shadow:0 16px 48px rgba(6,19,31,.10);
    -webkit-backdrop-filter:blur(12px) saturate(.92);
    backdrop-filter:blur(12px) saturate(.92);
  }
}

/* More intentional section rhythm. */
.home-v11 .jk-definition,.home-v11 .jk-commission,.home-v11 .jk-engineering,.home-v11 .jk-craft,.home-v11 .jk-global,.home-v11 .jk-final{
  border-top:1px solid var(--v17-line);
}
.home-v11 .jk-chapter b{letter-spacing:.14em}
.home-v11 .jk-definition-visual img,.home-v11 .jk-commission-visual img,.home-v11 .jk-engineering-image img,.home-v11 .jk-craft-photo img,.home-v11 .jk-global-image img{
  transition:transform 900ms var(--v17-ease-emphasis),filter var(--v17-slow);
}
@media(hover:hover) and (pointer:fine){
  .home-v11 .jk-definition-visual:hover img,.home-v11 .jk-commission-visual:hover img,.home-v11 .jk-craft-photo:hover img,.home-v11 .jk-global-image:hover img{transform:scale(1.018)}
}

/* --------------------------------------------------------------------------
   Homepage collection selector — clearer comparison and model identity
   -------------------------------------------------------------------------- */
.jk-showroom{
  background:linear-gradient(180deg,#07131f 0%,#091a28 100%)!important;
}
.jk-showroom-head{
  margin-bottom:52px!important;
}
.jk-showroom-head h2{letter-spacing:-.045em}
.jk-showroom-stage{
  grid-template-columns:112px minmax(0,1fr) minmax(340px,405px)!important;
  min-height:720px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  background:#0a1927!important;
  box-shadow:0 34px 90px rgba(0,0,0,.22);
}
.jk-model-rail{
  background:rgba(2,11,18,.38);
  scroll-snap-type:y proximity;
}
.jk-model-rail .model-tab{
  display:grid!important;
  align-content:center;
  justify-items:start;
  gap:2px;
  min-height:70px!important;
  padding:11px 14px!important;
  color:rgba(255,255,255,.4)!important;
  text-align:start;
  scroll-snap-align:center;
  overflow:hidden;
  transition:background-color var(--v17-base),color var(--v17-base),transform var(--v17-base) var(--v17-ease-enter)!important;
}
.jk-model-rail .model-tab span{font-size:6px!important;letter-spacing:.15em}
.jk-model-rail .model-tab strong{font-size:13px!important;line-height:1!important}
.jk-model-rail .model-tab small{
  display:block;
  max-width:100%;
  overflow:hidden;
  color:rgba(255,255,255,.34);
  font-size:6px;
  letter-spacing:.08em;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.jk-model-rail .model-tab::before{
  width:3px!important;
  background:var(--v17-copper)!important;
  transition:transform var(--v17-medium) var(--v17-ease-emphasis)!important;
}
.jk-model-rail .model-tab::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  opacity:0;
  background:linear-gradient(90deg,rgba(169,104,61,.18),transparent 80%)!important;
  transition:opacity var(--v17-base)!important;
}
.jk-model-rail .model-tab.active{
  color:#fff!important;
  background:rgba(255,255,255,.055)!important;
}
.jk-model-rail .model-tab.active::after{opacity:1}
.jk-model-rail .model-tab.active small{color:rgba(255,255,255,.64)}
@media(hover:hover) and (pointer:fine){
  .jk-model-rail .model-tab:hover{color:#fff!important;background:rgba(255,255,255,.035)!important;transform:translate3d(2px,0,0)}
}
.jk-model-visual{
  isolation:isolate;
  background:#07131f;
}
.jk-model-visual::before{
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.06);
}
.jk-model-visual::after{
  z-index:2;
  background:
    linear-gradient(90deg,transparent 55%,rgba(4,14,22,.38)),
    linear-gradient(0deg,rgba(4,14,22,.34),transparent 40%)!important;
}
.jk-model-visual .collection-image{
  filter:saturate(.9) contrast(1.03);
  transform:translate3d(var(--model-enter-x,0),0,0) scale(1.035)!important;
  transition:opacity var(--v17-medium) var(--v17-ease-standard),transform var(--v17-cinematic) var(--v17-ease-emphasis),filter var(--v17-medium)!important;
}
.jk-model-visual .collection-image.active{
  transform:none!important;
  filter:saturate(.98) contrast(1.025);
}
.jk-showroom-stage[data-direction="forward"] .collection-image:not(.active){--model-enter-x:-16px}
.jk-showroom-stage[data-direction="back"] .collection-image:not(.active){--model-enter-x:16px}
.jk-model-code{
  top:26px!important;
  left:28px!important;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(4,15,24,.36);
  backdrop-filter:blur(9px);
}
html[dir="rtl"] .jk-model-code{left:auto!important;right:28px!important}
.jk-model-browse{
  position:absolute;
  z-index:5;
  right:22px;
  bottom:22px;
  display:grid;
  grid-template-columns:42px auto 42px;
  align-items:center;
  gap:8px;
  padding:6px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(4,15,24,.72);
  color:#fff;
  backdrop-filter:blur(12px) saturate(1.06);
}
html[dir="rtl"] .jk-model-browse{right:auto;left:22px}
.jk-model-browse button{
  display:grid;
  place-items:center;
  width:42px;height:38px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:17px;
  cursor:pointer;
  transition:background-color var(--v17-fast),transform var(--v17-fast) var(--v17-ease-enter);
}
.jk-model-browse>span{
  min-width:58px;
  text-align:center;
  font-size:8px;
  font-weight:800;
  letter-spacing:.13em;
}
@media(hover:hover) and (pointer:fine){
  .jk-model-browse button:hover{background:rgba(255,255,255,.12);transform:translate3d(0,-1px,0)}
}
.jk-model-detail{
  padding:46px 36px!important;
  background:linear-gradient(180deg,rgba(8,24,36,.98),rgba(5,17,27,.98))!important;
}
.jk-model-detail h3{
  margin:24px 0 8px!important;
  letter-spacing:-.055em;
}
.jk-model-category{color:var(--v17-teal-soft)!important}
.jk-model-detail>p{
  min-height:82px!important;
  margin-top:18px;
  color:rgba(255,255,255,.66)!important;
}
.jk-model-engine{
  margin-top:12px!important;
  padding:14px 0!important;
}
.jk-model-engine strong{color:rgba(255,255,255,.86)!important}
.jk-model-facts{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  margin:17px 0 24px!important;
  border:1px solid rgba(255,255,255,.14)!important;
}
.jk-model-facts div,
.jk-model-facts div:nth-child(3){
  grid-column:auto!important;
  min-height:68px;
  padding:13px 12px!important;
  border:0!important;
  border-right:1px solid rgba(255,255,255,.11)!important;
  border-bottom:1px solid rgba(255,255,255,.11)!important;
  align-content:center;
}
html[dir="rtl"] .jk-model-facts div{border-right:0!important;border-left:1px solid rgba(255,255,255,.11)!important}
.jk-model-facts div:nth-child(2n){border-right:0!important}
html[dir="rtl"] .jk-model-facts div:nth-child(2n){border-left:0!important}
.jk-model-facts div:nth-last-child(-n+2){border-bottom:0!important}
.jk-model-facts span{font-size:6px!important}
.jk-model-facts strong{font-size:14px!important;line-height:1.2}
.jk-model-facts small{font-size:8px}
.jk-model-actions .button{min-height:50px;padding-inline:14px!important}
.jk-showroom-stage.is-model-changing .jk-model-detail>*{
  opacity:.3;
  transform:translate3d(0,5px,0);
}
.jk-model-detail>*{
  transition:opacity var(--v17-base),transform var(--v17-medium) var(--v17-ease-enter);
}

/* --------------------------------------------------------------------------
   Configurator — model decision clarity
   -------------------------------------------------------------------------- */
.config-page-v11 .config-preview{
  background:#06131f!important;
}
.config-page-v11 .config-preview::after{
  background:
    linear-gradient(0deg,rgba(3,12,20,.88) 0%,rgba(3,12,20,.28) 42%,transparent 64%),
    linear-gradient(90deg,rgba(3,12,20,.22),transparent 55%)!important;
}
.config-page-v11 .config-preview img{
  filter:saturate(.92) contrast(1.025)!important;
  transition:opacity var(--v17-base),transform var(--v17-cinematic) var(--v17-ease-emphasis),filter var(--v17-base)!important;
}
.config-page-v11 .config-preview.switching img{
  opacity:.28!important;
  transform:translate3d(var(--preview-shift,0),0,0) scale(1.018)!important;
  filter:saturate(.7) contrast(.96) blur(1px)!important;
}
.config-page-v11 .config-preview[data-direction="forward"]{--preview-shift:-12px}
.config-page-v11 .config-preview[data-direction="back"]{--preview-shift:12px}
.config-page-v11 .config-preview-bottom{
  z-index:4;
}
.config-page-v11 .config-panel{
  background:
    radial-gradient(circle at 100% 0,rgba(47,98,112,.055),transparent 26%),
    var(--v17-paper)!important;
}
.config-page-v11 .config-head h1{letter-spacing:-.045em}
.config-page-v11 .progress-track{
  position:relative;
  overflow:visible!important;
}
.config-page-v11 .progress-fill{
  transform-origin:left center!important;
  transition:transform var(--v17-medium) var(--v17-ease-emphasis)!important;
}
html[dir="rtl"] .config-page-v11 .progress-fill{transform-origin:right center!important}
.config-page-v11 .progress-fill::after{
  width:7px!important;height:7px!important;
  box-shadow:0 0 0 5px rgba(169,104,61,.12)!important;
}

/* Richer model cards without visual noise. */
.config-page-v11 .choice-grid.models{
  gap:12px!important;
}
.config-page-v11 .model-choice{
  position:relative;
  min-height:178px!important;
  grid-template-rows:96px auto!important;
  border-radius:10px!important;
  background:rgba(255,255,255,.56)!important;
  overflow:hidden;
  scroll-margin-inline:18px;
}
.config-page-v11 .model-choice::before{
  top:auto!important;
  bottom:0!important;
  height:3px!important;
  transform:scaleX(0)!important;
  transform-origin:left!important;
  transition:transform var(--v17-medium) var(--v17-ease-emphasis)!important;
}
html[dir="rtl"] .config-page-v11 .model-choice::before{transform-origin:right!important}
.config-page-v11 .model-choice.selected::before{transform:scaleX(1)!important}
.config-page-v11 .model-choice::after{
  display:grid!important;
  place-items:center;
  top:9px!important;
  right:9px!important;
  width:22px!important;height:22px!important;
  border:1px solid rgba(255,255,255,.75)!important;
  background:rgba(6,19,31,.32)!important;
  color:transparent!important;
  backdrop-filter:blur(6px);
  transform:scale(.78)!important;
  opacity:.72!important;
  transition:background-color var(--v17-base),transform var(--v17-medium) var(--v17-ease-emphasis),color var(--v17-fast),opacity var(--v17-fast)!important;
}
.config-page-v11 .model-choice.selected::after{
  content:"✓"!important;
  background:var(--v17-copper)!important;
  color:#fff!important;
  opacity:1!important;
  transform:scale(1)!important;
}
.config-page-v11 .model-thumb{
  height:96px!important;
  background:#d5d9d7!important;
  overflow:hidden;
}
.config-page-v11 .model-thumb::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(0deg,rgba(6,19,31,.18),transparent 45%);
}
.config-page-v11 .model-thumb img{
  transition:transform var(--v17-slow) var(--v17-ease-emphasis),filter var(--v17-base)!important;
}
.config-page-v11 .model-choice-copy{
  display:grid!important;
  gap:4px!important;
  padding:12px 13px 14px!important;
}
.config-page-v11 .model-choice-copy strong{
  font-size:11px!important;
  letter-spacing:.025em;
  line-height:1.25!important;
  min-height:14px;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
}
.config-page-v11 .model-choice-title{
  display:block;
  overflow:hidden;
  color:var(--v17-teal)!important;
  font-size:7px!important;
  font-weight:700;
  letter-spacing:.08em;
  text-overflow:ellipsis;
  text-transform:uppercase;
  white-space:nowrap;
}
.config-page-v11 .model-choice-copy>span:last-child{font-size:7px!important;color:var(--v17-muted)!important}
.config-page-v11 .model-choice.selected{
  border-color:var(--v17-ink)!important;
  background:#fff!important;
  box-shadow:0 16px 36px rgba(4,15,24,.1)!important;
  transform:translate3d(0,-2px,0)!important;
}
@media(hover:hover) and (pointer:fine){
  .config-page-v11 .model-choice:hover{border-color:rgba(6,19,31,.34)!important;transform:translate3d(0,-3px,0)!important;box-shadow:var(--v17-shadow-1)!important}
  .config-page-v11 .model-choice:hover .model-thumb img{transform:scale(1.045)!important}
}

/* Selected model intelligence panel. */
.config-model-insight{
  display:grid;
  grid-template-columns:minmax(180px,.8fr) minmax(0,1.2fr);
  gap:0;
  margin-top:18px;
  border:1px solid var(--v17-line);
  border-radius:var(--v17-radius-md);
  background:rgba(255,255,255,.58);
  overflow:hidden;
  box-shadow:0 16px 50px rgba(4,15,24,.07);
  transition:border-color var(--v17-base),box-shadow var(--v17-medium),transform var(--v17-medium) var(--v17-ease-enter);
}
.config-model-insight.is-v17-updating{pointer-events:none}
.config-model-insight-media{
  position:relative;
  min-height:238px;
  background:var(--v17-ink);
  overflow:hidden;
}
.config-model-insight-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(0deg,rgba(4,15,24,.36),transparent 54%);
}
.config-model-insight-media img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:var(--model-insight-position,50% 50%);
  filter:saturate(.9) contrast(1.03);
  transition:opacity var(--v17-base),transform var(--v17-cinematic) var(--v17-ease-emphasis);
}
.config-model-insight.is-v17-updating .config-model-insight-media img{opacity:.35;transform:scale(1.025)}
.config-model-insight-code{
  position:absolute;
  z-index:2;
  top:14px;left:14px;
  padding:7px 9px;
  border:1px solid rgba(255,255,255,.28);
  background:rgba(4,15,24,.46);
  color:#fff;
  font-size:7px;
  font-weight:800;
  letter-spacing:.14em;
  backdrop-filter:blur(8px);
}
html[dir="rtl"] .config-model-insight-code{left:auto;right:14px}
.config-model-insight-copy{
  display:grid;
  align-content:center;
  padding:24px 25px;
}
.config-model-insight-head{
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:18px;
  padding-bottom:13px;
  border-bottom:1px solid var(--v17-line);
}
.config-model-insight-head small{
  display:block;
  margin-bottom:5px;
  color:var(--v17-muted);
  font-size:7px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.config-model-insight-head h3{
  margin:0;
  font-family:"Cormorant Garamond",serif;
  font-size:42px;
  line-height:.82;
  letter-spacing:-.045em;
}
.config-model-insight-head>strong{
  white-space:nowrap;
  color:var(--v17-ink);
  font-family:"Cormorant Garamond",serif;
  font-size:26px;
  font-variant-numeric:tabular-nums;
}
.config-model-insight-title{
  margin-top:14px;
  color:var(--v17-teal);
  font-size:8px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}
.config-model-insight-copy>p{
  margin:9px 0 16px;
  color:#59666d;
  font-size:11px;
  line-height:1.65;
}
.config-model-insight-specs{
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  margin:0;
  border-block:1px solid var(--v17-line);
}
.config-model-insight-specs div{
  min-width:0;
  padding:11px 8px;
  border-inline-end:1px solid var(--v17-line);
}
.config-model-insight-specs div:last-child{border-inline-end:0}
.config-model-insight-specs dt{
  margin-bottom:4px;
  color:#829097;
  font-size:6px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.config-model-insight-specs dd{
  margin:0;
  overflow:hidden;
  color:var(--v17-ink);
  font-size:9px;
  font-weight:700;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.config-model-insight-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-top:15px;
  color:var(--v17-ink);
  font-size:8px;
  font-weight:800;
  letter-spacing:.1em;
  text-decoration:none;
  text-transform:uppercase;
}
.config-model-insight-link i{
  font-style:normal;
  transition:transform var(--v17-base) var(--v17-ease-enter);
}
@media(hover:hover) and (pointer:fine){
  .config-model-insight-link:hover i{transform:translate3d(3px,-3px,0)}
}
.config-model-insight.is-v17-updating .config-model-insight-copy>*{
  opacity:.28;
  transform:translate3d(0,5px,0);
}
.config-model-insight-copy>*{
  transition:opacity var(--v17-base),transform var(--v17-medium) var(--v17-ease-enter);
}

/* Engine and option cards: clearly comparable, not generic boxes. */
.config-page-v11 .choice-grid:not(.models) .choice-card{
  position:relative;
  overflow:hidden;
}
.config-page-v11 .choice-grid:not(.models) .choice-card::after{
  content:"";
  position:absolute;
  top:13px;right:13px;
  width:8px;height:8px;
  border:1px solid rgba(6,19,31,.38);
  border-radius:50%;
  transition:background-color var(--v17-fast),box-shadow var(--v17-base),transform var(--v17-medium) var(--v17-ease-emphasis);
}
html[dir="rtl"] .config-page-v11 .choice-grid:not(.models) .choice-card::after{right:auto;left:13px}
.config-page-v11 .choice-grid:not(.models) .choice-card.selected::after{
  background:var(--v17-copper);
  border-color:var(--v17-copper);
  box-shadow:0 0 0 5px rgba(169,104,61,.12);
  transform:scale(1.05);
}

/* Colour selection reads like a material studio. */
.config-page-v11 .color-choice{
  min-height:78px!important;
  border-radius:9px!important;
}
.config-page-v11 .color-choice.selected{
  border-color:var(--v17-ink)!important;
  box-shadow:0 13px 30px rgba(4,15,24,.08)!important;
  transform:translate3d(0,-1px,0)!important;
}
.config-page-v11 .color-choice.selected::after{
  background:var(--v17-copper)!important;
  border-color:var(--v17-copper)!important;
}
.config-page-v11 .color-swatch{
  box-shadow:inset 0 0 0 1px rgba(6,19,31,.12),0 5px 14px rgba(4,15,24,.1)!important;
}
.finish-current{
  border-radius:9px!important;
  background:rgba(255,255,255,.5)!important;
}
.custom-color-studio{
  border-radius:var(--v17-radius-md)!important;
  background:rgba(255,255,255,.62)!important;
  box-shadow:0 18px 48px rgba(4,15,24,.08)!important;
}
.custom-color-picker{cursor:pointer}

/* Sticky navigation communicates movement without floating visually loose. */
.config-step-controls{
  transition:opacity var(--v17-base),transform var(--v17-medium) var(--v17-ease-enter),box-shadow var(--v17-medium)!important;
}
.config-step-controls.is-transitioning{box-shadow:0 30px 78px rgba(4,15,24,.28)!important}
.config-step-controls .next{position:relative;overflow:hidden}
.config-step-controls .next::after{
  content:"";
  position:absolute;
  inset:0;
  opacity:0;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.13),transparent);
  transform:translateX(-110%);
}
.config-step-controls.is-transitioning .next::after{opacity:1;animation:v17DockSweep 680ms var(--v17-ease-enter) both}
@keyframes v17DockSweep{to{transform:translateX(110%)}}

/* Review — stronger hierarchy and smoother continuity. */
.review-dialog::backdrop{
  background:rgba(3,10,16,.78)!important;
  backdrop-filter:blur(9px) saturate(.8)!important;
}
.review-card{box-shadow:var(--v17-shadow-3)!important}
.review-hero img{
  transform:scale(1.018);
  transition:transform 700ms var(--v17-ease-emphasis),opacity var(--v17-base)!important;
}
.review-dialog[open] .review-hero img{transform:scale(1)}
.review-line{
  transition:background-color var(--v17-base),transform var(--v17-base) var(--v17-ease-enter),border-color var(--v17-fast)!important;
}
.review-line.is-highlighted{animation:v17ReviewHighlight 820ms var(--v17-ease-enter) both}
@keyframes v17ReviewHighlight{0%{background:rgba(169,104,61,.18);transform:translate3d(0,-2px,0)}100%{background:transparent;transform:none}}

/* --------------------------------------------------------------------------
   Site-wide pages: one final quality pass
   -------------------------------------------------------------------------- */
.inner-hero,.product-hero{overflow:hidden}
.inner-hero img,.product-hero-media img,.photo-band img,.content-card img,.model-card img{
  transition:transform 850ms var(--v17-ease-emphasis),filter var(--v17-medium)!important;
}
@media(hover:hover) and (pointer:fine){
  .model-card:hover img,.content-card:hover img{transform:scale(1.025)!important}
}
.model-card,.content-card,.leader-card,.contact-quick-card{
  transition:transform var(--v17-medium) var(--v17-ease-enter),box-shadow var(--v17-medium),border-color var(--v17-fast)!important;
}
@media(hover:hover) and (pointer:fine){
  .model-card:hover,.content-card:hover,.leader-card:hover,.contact-quick-card:hover{transform:translate3d(0,-4px,0);box-shadow:var(--v17-shadow-2)!important}
}

/* V17 reveal groups. JS applies these only to meaningful blocks. */
[data-v17-reveal]{
  opacity:0;
  transform:translate3d(0,18px,0);
  transition:
    opacity var(--v17-slow) var(--v17-ease-standard),
    transform var(--v17-cinematic) var(--v17-ease-enter),
    clip-path var(--v17-cinematic) var(--v17-ease-emphasis);
  transition-delay:var(--v17-delay,0ms);
}
[data-v17-reveal="image"]{clip-path:inset(0 0 12% 0);transform:translate3d(0,10px,0) scale(1.012)}
[data-v17-reveal="line"]{opacity:1;transform:scaleX(0);transform-origin:left}
html[dir="rtl"] [data-v17-reveal="line"]{transform-origin:right}
[data-v17-reveal].is-v17-visible{opacity:1;transform:none;clip-path:inset(0)}

/* --------------------------------------------------------------------------
   Desktop refinements
   -------------------------------------------------------------------------- */
@media(min-width:1201px){
  .home-v11 .jk-hero-copy{bottom:clamp(170px,20vh,230px)!important}
  .home-v11 .jk-hero-specs{bottom:34px!important}
  .config-page-v11 .config-panel{padding-inline:clamp(42px,4.2vw,74px)!important}
}

@media(max-width:1200px){
  .jk-showroom-stage{grid-template-columns:94px minmax(0,1fr) 335px!important}
  .jk-model-detail{padding:35px 27px!important}
  .config-model-insight{grid-template-columns:220px minmax(0,1fr)}
  .config-model-insight-specs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .config-model-insight-specs div:nth-child(3){border-inline-end:0}
  .config-model-insight-specs div:nth-child(n+4){border-top:1px solid var(--v17-line)}
}

@media(max-width:980px){
  .jk-showroom-stage{
    grid-template-columns:86px minmax(0,1fr)!important;
    min-height:0!important;
  }
  .jk-model-detail{
    grid-column:1/-1!important;
    grid-template-columns:minmax(0,1fr) minmax(260px,.8fr)!important;
    gap:16px 30px!important;
  }
  .jk-model-counter{grid-column:1/-1}
  .jk-model-engine,.jk-model-facts,.jk-model-actions{grid-column:2}
  .jk-model-detail h3,.jk-model-category,.jk-model-detail>p{grid-column:1}
  .jk-model-facts{margin:0!important}
  .config-model-insight{grid-template-columns:minmax(220px,.75fr) minmax(0,1.25fr)}
}

/* --------------------------------------------------------------------------
   Mobile — premium, compact and easy to understand
   -------------------------------------------------------------------------- */
@media(max-width:767px){
  body::before{height:1px}
  html{scroll-padding-top:70px}
  .site-header.is-v17-compact .header-inner{min-height:64px!important}

  .home-v11 .jk-hero{
    min-height:900px!important;
    height:100svh!important;
    max-height:980px;
  }
  .home-v11 .jk-hero-media{
    height:46%!important;
    clip-path:polygon(0 0,100% 0,100% 91%,76% 96%,23% 100%,0 94%)!important;
  }
  .home-v11 .jk-hero-media::before{
    background:linear-gradient(0deg,rgba(6,19,31,.3),transparent 52%)!important;
  }
  .home-v11 .jk-hero-media img{
    object-position:57% 52%!important;
    transform:scale(1.018)!important;
  }
  .home-v11 .jk-hero-copy{
    top:49%!important;
    left:18px!important;right:18px!important;
    width:auto!important;
  }
  html[dir="rtl"] .home-v11 .jk-hero-copy{left:18px!important;right:18px!important}
  .home-v11 .jk-kicker{font-size:7px!important;margin-bottom:14px!important}
  .home-v11 .jk-kicker::before{width:18px}
  .home-v11 .jk-hero-copy h1{
    max-width:100%;
    font-size:clamp(49px,13.3vw,59px)!important;
    line-height:.79!important;
    letter-spacing:-.045em!important;
  }
  .home-v11 .jk-hero-copy h1 em{
    margin-inline-start:0!important;
    font-size:.82em!important;
  }
  .home-v11 .jk-hero-copy>p{
    margin:21px 0 17px!important;
    max-width:355px!important;
    font-size:11px!important;
    line-height:1.7!important;
  }
  .home-v11 .jk-hero-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }
  .home-v11 .jk-hero-actions .button,.home-v11 .jk-hero-actions .jk-text-link{
    width:100%;
    min-height:49px!important;
    justify-content:center;
  }
  .home-v11 .jk-hero-actions .jk-text-link{padding-inline:12px!important}
  .home-v11 .jk-hero-specs{
    left:18px!important;right:18px!important;bottom:17px!important;
    width:auto!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    border:1px solid var(--v17-line)!important;
    background:rgba(255,255,255,.28);
    backdrop-filter:blur(8px);
  }
  .home-v11 .jk-hero-specs div{
    min-height:50px;
    padding:9px 10px!important;
    border-inline-start:0!important;
    border-right:1px solid var(--v17-line)!important;
    border-bottom:1px solid var(--v17-line)!important;
  }
  .home-v11 .jk-hero-specs div:nth-child(2n){border-right:0!important}
  .home-v11 .jk-hero-specs div:nth-last-child(-n+2){border-bottom:0!important}
  .home-v11 .jk-hero-specs strong{font-size:11px!important}
  .home-v11 .jk-hero-specs span{font-size:6px!important}

  .jk-showroom{padding-inline:12px!important}
  .jk-showroom-head{gap:17px!important;margin-bottom:28px!important}
  .jk-showroom-head h2{font-size:clamp(45px,14.5vw,62px)!important;line-height:.8!important}
  .jk-showroom-stage{display:flex!important;border-radius:0;overflow:hidden}
  .jk-model-visual{order:1;min-height:74vw!important;max-height:365px}
  .jk-model-code{top:13px!important;left:13px!important;font-size:7px!important}
  html[dir="rtl"] .jk-model-code{left:auto!important;right:13px!important}
  .jk-model-browse{
    right:12px;bottom:12px;
    grid-template-columns:36px auto 36px;
    gap:4px;
    padding:4px;
  }
  html[dir="rtl"] .jk-model-browse{right:auto;left:12px}
  .jk-model-browse button{width:36px;height:34px}
  .jk-model-browse>span{min-width:50px;font-size:7px}
  .jk-model-rail{
    order:2;
    height:72px!important;
    border-top:1px solid rgba(255,255,255,.13)!important;
    scroll-snap-type:x mandatory;
  }
  .jk-model-rail .model-tab{
    flex:0 0 76px!important;
    min-height:72px!important;
    padding:9px 10px!important;
    border-inline-end:1px solid rgba(255,255,255,.1)!important;
    scroll-snap-align:center;
  }
  .jk-model-rail .model-tab::before{
    inset:auto 0 0!important;
    width:auto!important;height:3px!important;
    transform:scaleX(0)!important;
  }
  .jk-model-rail .model-tab.active::before{transform:scaleX(1)!important}
  .jk-model-rail .model-tab::after{background:linear-gradient(0deg,rgba(169,104,61,.18),transparent 80%)!important}
  .jk-model-rail .model-tab strong{font-size:12px!important}
  .jk-model-detail{
    order:3;
    display:block!important;
    padding:24px 17px 21px!important;
  }
  .jk-model-detail h3{margin:19px 0 7px!important;font-size:59px!important}
  .jk-model-detail>p{min-height:0!important;margin-top:14px!important;font-size:11px!important}
  .jk-model-engine{margin-top:15px!important}
  .jk-model-facts{grid-template-columns:repeat(3,minmax(0,1fr))!important;margin:16px 0 20px!important}
  .jk-model-facts div{min-height:61px!important;padding:10px 8px!important;border-right:1px solid rgba(255,255,255,.11)!important;border-bottom:1px solid rgba(255,255,255,.11)!important}
  .jk-model-facts div:nth-child(2n){border-right:1px solid rgba(255,255,255,.11)!important}
  .jk-model-facts div:nth-child(3n){border-right:0!important}
  .jk-model-facts div:nth-last-child(-n+3){border-bottom:0!important}
  .jk-model-facts span{font-size:5px!important}
  .jk-model-facts strong{font-size:11px!important}
  .jk-model-actions{gap:7px!important}
  .jk-model-actions .button{min-height:47px!important;font-size:8px!important}
  .jk-showroom-foot{align-items:center!important;padding-inline:3px;font-size:5px!important}

  .config-page-v11 .config-preview{
    height:clamp(365px,50svh,445px)!important;
    min-height:365px!important;
  }
  .config-page-v11 .config-panel{
    padding-top:24px!important;
    padding-inline:12px!important;
  }
  .config-page-v11 .config-head h1{font-size:clamp(35px,10vw,43px)!important}
  .config-page-v11 .choice-grid.models{
    margin-inline:-12px!important;
    padding-inline:12px!important;
    gap:10px!important;
    scroll-snap-type:x mandatory!important;
  }
  .config-page-v11 .choice-grid.models .choice-card{
    flex-basis:158px!important;
    width:158px!important;
    min-width:158px!important;
    min-height:180px!important;
    grid-template-rows:98px auto!important;
  }
  .config-page-v11 .choice-grid.models .model-thumb{height:98px!important}
  .config-page-v11 .model-choice-copy{padding:12px!important}

  .config-model-insight{
    grid-template-columns:1fr;
    margin-top:7px;
    border-radius:11px;
  }
  .config-model-insight-media{min-height:46vw;max-height:230px}
  .config-model-insight-copy{padding:18px 15px}
  .config-model-insight-head h3{font-size:37px}
  .config-model-insight-head>strong{font-size:23px}
  .config-model-insight-copy>p{font-size:10px;margin-bottom:13px}
  .config-model-insight-specs{grid-template-columns:repeat(3,minmax(0,1fr))}
  .config-model-insight-specs div{padding:9px 6px}
  .config-model-insight-specs div:nth-child(3){border-inline-end:0}
  .config-model-insight-specs div:nth-child(n+4){border-top:1px solid var(--v17-line)}
  .config-model-insight-specs div:nth-child(5){border-inline-end:0}
  .config-model-insight-specs dt{font-size:5px}
  .config-model-insight-specs dd{font-size:8px}
  .config-model-insight-link{font-size:7px}

  .config-page-v11 .choice-grid:not(.models) .choice-card{min-height:84px!important}
  .config-page-v11 .color-choice{min-height:68px!important}
  .config-step-controls{
    border-radius:13px!important;
    box-shadow:0 24px 70px rgba(4,15,24,.24)!important;
  }
  .review-hero{min-height:38svh!important}
  .review-hero-copy h2{font-size:46px!important}
}

@media(max-width:370px){
  .home-v11 .jk-hero{min-height:850px!important}
  .home-v11 .jk-hero-copy h1{font-size:47px!important}
  .jk-model-facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .jk-model-facts div:nth-child(3n){border-right:1px solid rgba(255,255,255,.11)!important}
  .jk-model-facts div:nth-child(2n){border-right:0!important}
  .jk-model-facts div:nth-last-child(-n+3){border-bottom:1px solid rgba(255,255,255,.11)!important}
  .jk-model-facts div:nth-last-child(-n+2){border-bottom:0!important}
  .config-page-v11 .choice-grid.models .choice-card{flex-basis:148px!important;width:148px!important;min-width:148px!important}
  .config-model-insight-specs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .config-model-insight-specs div:nth-child(3){border-inline-end:1px solid var(--v17-line)}
  .config-model-insight-specs div:nth-child(2n){border-inline-end:0}
  .config-model-insight-specs div:nth-child(n+3){border-top:1px solid var(--v17-line)}
}

/* Modern scroll-driven enhancement where supported; no dependency on it. */
@supports (animation-timeline:view()){
  @media(min-width:768px) and (prefers-reduced-motion:no-preference){
    .jk-definition-visual img,.jk-commission-visual img,.jk-craft-photo img,.jk-global-image img{
      animation:v17ViewImage linear both;
      animation-timeline:view();
      animation-range:entry 0% cover 45%;
    }
    @keyframes v17ViewImage{from{transform:scale(1.04);filter:saturate(.78)}to{transform:scale(1);filter:saturate(1)}}
  }
}

/* Native View Transitions are used by the JS only for internal page navigation. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:v17ViewOld 180ms var(--v17-ease-exit) both}
::view-transition-new(root){animation:v17ViewNew 360ms var(--v17-ease-enter) both}
@keyframes v17ViewOld{to{opacity:0;transform:translate3d(0,-4px,0)}}
@keyframes v17ViewNew{from{opacity:0;transform:translate3d(0,7px,0)}}

/* Accessibility: functional feedback remains, travel and continuous movement stop. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  html.jk-v17-ready main{animation:none!important}
  *,*::before,*::after{
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    scroll-behavior:auto!important;
  }
  [data-v17-reveal]{opacity:1!important;transform:none!important;clip-path:none!important;transition:none!important}
  .home-v11 .jk-hero-media img,.home-v11 .jk-hero-diamond,.collection-image,.config-preview img,.config-model-insight img{transform:none!important;transition:opacity 100ms linear!important}
  .button::before{display:none!important}
}

/* Mobile hero flow correction: keep the editorial copy in normal document flow
   beneath the image and avoid conflicts with legacy absolute positioning. */
@media(max-width:767px){
  .home-v11 .jk-hero{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding-bottom:20px!important;
  }
  .home-v11 .jk-hero-media{
    height:46svh!important;
    min-height:330px!important;
    max-height:430px!important;
  }
  .home-v11 .jk-hero-copy{
    position:relative!important;
    top:auto!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:auto!important;
    max-width:none!important;
    padding:calc(46svh + 24px) 18px 0!important;
  }
  .home-v11 .jk-hero-specs{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(100% - 36px)!important;
    margin:22px 18px 0!important;
  }
}