/* Jetcar Kromh V12.1 - calm visual polish and resilient responsive layout */

:root {
  --jk-midnight: #0a1724;
  --jk-midnight-2: #102235;
  --jk-graphite: #202a31;
  --jk-pearl: #f3f1eb;
  --jk-porcelain: #fbfaf7;
  --jk-sapphire: #315f99;
  --jk-cyan: #a4d7d6;
  --blue: var(--jk-sapphire);
  --paper: var(--jk-pearl);
  --ink: var(--jk-midnight);
  --jk-shadow: 0 24px 64px rgba(10, 23, 36, .1);
  --shadow-lg: 0 22px 58px rgba(10, 23, 36, .14);
}

html {
  max-width: 100%;
  overflow-x: clip;
  background: var(--jk-pearl);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  max-width: 100%;
  overflow-x: clip;
  background: var(--jk-pearl);
  color: var(--jk-midnight);
  line-height: 1.55;
}

@supports not (overflow: clip) {
  html,
  body { overflow-x: hidden; }
}

:where(main, section, article, aside, header, footer, nav, form, fieldset, figure, div) {
  min-width: 0;
}

:where(img, picture, video, canvas, svg) {
  max-width: 100%;
}

:where(p, li, dd, figcaption, .lead, .footer-bottom) {
  overflow-wrap: break-word;
}

:where(button, input, select, textarea) {
  max-width: 100%;
}

.site-header.scrolled,
.site-header.header-light {
  background: rgba(249, 248, 244, .94);
  border-color: rgba(10, 23, 36, .1);
  box-shadow: 0 5px 24px rgba(10, 23, 36, .055);
  backdrop-filter: blur(16px) saturate(112%);
}

.button {
  border-radius: 7px;
  letter-spacing: .055em;
}

.button-primary {
  background: var(--jk-sapphire);
}

.button-primary:hover {
  background: #254f82;
  box-shadow: 0 12px 28px rgba(49, 95, 153, .2);
}

.lang-toggle,
.menu-toggle {
  min-width: 44px;
  min-height: 44px;
}

.brand {
  min-height: 44px;
}

.mobile-menu nav a {
  display: flex;
  align-items: center;
  min-height: 52px;
}

.model-card,
.content-card,
.contact-quick-card,
.choice-card,
.review-card {
  box-shadow: 0 14px 38px rgba(10, 23, 36, .065);
}

.model-card:hover,
.contact-quick-card:hover {
  transform: translateY(-2px);
}

.jk-hero-media img,
.jk-definition-visual img,
.jk-commission-visual img,
.jk-engineering-image img,
.jk-craft-photo img,
.jk-global-image img,
.product-hero > img,
.photo-band img {
  filter: saturate(.9) contrast(.985);
}

.site-footer {
  background: #08121e;
}

.footer-col a {
  display: flex;
  align-items: center;
  min-height: 36px;
  margin: 2px 0;
}

.footer-bottom {
  line-height: 1.65;
}

.jk-showroom-foot a {
  display: flex;
  align-items: center;
  min-height: 44px;
}

.jk-scroll-cue {
  min-width: 44px;
}

.config-page-v11 .color-choice {
  min-width: 54px;
}

.config-page-v11 .consent-row input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-height: 20px;
  flex: 0 0 20px;
  accent-color: var(--jk-sapphire);
}

.jk-definition,
.jk-showroom,
.jk-commission,
.jk-engineering,
.jk-craft,
.jk-global,
.jk-final,
.product-page-v11 .product-hero,
.product-page-v11 .product-overview,
.config-page-v11 .config-shell {
  width: 100%;
  max-width: 100%;
}

.jk-definition > *,
.jk-commission > *,
.jk-global > *,
.jk-craft-story > *,
.jk-showroom-stage > *,
.product-page-v11 .product-overview > *,
.config-page-v11 .config-shell > * {
  min-width: 0;
}

@media (max-width: 980px) {
  .contact-page-v11 .contact-quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  :root {
    --header-h: 68px;
    --jk-container: calc(100% - 30px);
    --container: var(--jk-container);
  }

  body {
    font-size: 15px;
  }

  .container,
  .header-inner {
    width: var(--jk-container);
    max-width: var(--jk-container);
  }

  .site-header {
    height: var(--header-h);
  }

  .header-inner {
    gap: 8px;
  }

  .brand {
    gap: 8px;
  }

  .brand-name {
    max-width: min(36vw, 132px);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 9.5px;
    letter-spacing: .12em;
  }

  .brand-mark {
    width: 30px;
    height: 30px;
    flex: 0 0 30px;
  }

  .header-actions {
    gap: 2px;
  }

  .lang-toggle {
    padding: 8px 6px;
    font-size: 10px;
  }

  .menu-toggle {
    flex: 0 0 44px;
  }

  .mobile-menu {
    inset: var(--header-h) 0 auto;
    max-height: calc(100dvh - var(--header-h));
    padding: 28px 18px calc(28px + env(safe-area-inset-bottom));
    overflow-y: auto;
    overscroll-behavior: contain;
  }

  .mobile-menu nav a {
    font-size: clamp(27px, 9vw, 42px);
  }

  .mobile-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .mobile-actions .button {
    width: 100%;
  }

  .section {
    padding: 72px 0;
  }

  .jk-chapter {
    max-width: 100%;
    flex-wrap: wrap;
    gap: 7px;
    font-size: 8px;
    letter-spacing: .11em;
    line-height: 1.55;
  }

  .jk-text-link {
    min-height: 44px;
    padding-block: 9px;
    font-size: 9px;
  }

  /* Homepage */
  .home-v11 main {
    width: 100%;
    overflow: clip;
  }

  .jk-hero {
    height: auto;
    min-height: max(760px, 100svh);
    overflow: hidden;
  }

  .jk-hero-media img {
    transform: none !important;
  }

  .jk-hero-diamond {
    top: 14%;
    right: 11%;
    width: min(46vw, 220px);
  }

  html[dir="rtl"] .jk-hero-diamond {
    right: auto;
    left: 11%;
  }

  .jk-hero-copy,
  html[dir="rtl"] .jk-hero-copy {
    left: 18px;
    right: 18px;
    bottom: 140px;
    width: auto;
    max-width: 620px;
  }

  .jk-hero-copy h1 {
    max-width: 100%;
    font-size: clamp(50px, 17vw, 72px);
    line-height: .77;
  }

  .jk-hero-copy h1 em {
    margin-inline-start: 7vw;
  }

  .jk-hero-copy > p {
    max-width: 420px;
    margin: 18px 0 16px;
    font-size: 12.5px;
    line-height: 1.7;
  }

  .jk-hero-actions {
    gap: 10px 15px;
  }

  .jk-hero-specs {
    left: 18px !important;
    right: 18px !important;
    bottom: max(16px, env(safe-area-inset-bottom));
    width: auto;
  }

  .jk-hero-specs div {
    min-width: 0;
    padding: 12px 6px 2px;
  }

  .jk-definition {
    display: block;
    min-height: 0;
  }

  .jk-definition-copy {
    width: 100%;
    padding: 72px 18px;
  }

  .jk-statement {
    max-width: 100%;
    margin: 32px 0 24px;
    font-size: clamp(44px, 14.5vw, 66px);
  }

  .jk-definition-visual {
    width: 100%;
    min-height: max(300px, 82vw);
    clip-path: none;
  }

  .jk-showroom {
    padding: 72px 14px 32px;
  }

  .jk-showroom-head {
    width: 100%;
    gap: 18px;
    margin-bottom: 30px;
  }

  .jk-showroom-head h2 {
    max-width: 100%;
    font-size: clamp(45px, 14.5vw, 66px);
  }

  .jk-showroom-stage {
    width: 100%;
    overflow: hidden;
  }

  .jk-model-rail {
    order: 2;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    width: 100%;
    height: auto;
    overflow: visible;
    border-top: 1px solid var(--jk-hairline-light);
  }

  .jk-model-rail .model-tab {
    min-width: 0;
    min-height: 48px;
    padding: 5px 2px;
    border: 0;
    border-inline-end: 1px solid rgba(255, 255, 255, .1);
    border-bottom: 1px solid rgba(255, 255, 255, .1);
    font-size: 8px;
  }

  .jk-model-visual {
    width: 100%;
    min-height: clamp(230px, 64vw, 430px);
  }

  .jk-model-detail {
    width: 100%;
    padding: 26px 18px;
  }

  .jk-model-detail h3 {
    font-size: clamp(52px, 17vw, 68px);
  }

  .jk-model-facts {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  }

  .jk-model-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jk-model-actions .button {
    min-width: 0;
    padding-inline: 8px;
    font-size: 8.5px;
  }

  .jk-showroom-foot {
    align-items: center;
    flex-wrap: wrap;
  }

  .jk-showroom-foot a {
    display: flex;
    align-items: center;
    min-height: 44px;
  }

  .jk-commission {
    display: block;
    min-height: 0;
    overflow: hidden;
  }

  .jk-commission-visual {
    width: 100%;
    min-height: max(310px, 86vw);
  }

  .jk-commission-badge {
    right: 18px;
    bottom: 18px;
    width: 96px;
  }

  html[dir="rtl"] .jk-commission-badge {
    right: auto;
    left: 18px;
  }

  .jk-commission-copy {
    width: 100%;
    padding: 68px 18px;
    overflow: hidden;
  }

  .jk-commission-copy h2 {
    max-width: 100%;
    margin: 28px 0 20px;
    font-size: clamp(45px, 14vw, 66px);
    overflow-wrap: break-word;
  }

  .jk-commission-options {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    width: 100%;
  }

  .jk-commission-options div {
    min-width: 0;
    min-height: 92px;
    padding: 10px 4px;
    text-align: center;
  }

  .jk-engineering {
    padding: 72px 14px;
  }

  .jk-engineering-head h2,
  .jk-craft-story h2,
  .jk-global h2,
  .jk-final h2 {
    max-width: 100%;
    font-size: clamp(44px, 14vw, 66px);
  }

  .jk-engineering-grid article {
    padding: 22px 18px;
  }

  .jk-craft-story,
  .jk-global-copy {
    width: 100%;
    padding: 68px 18px;
  }

  .jk-craft-photo > div,
  html[dir="rtl"] .jk-craft-photo > div {
    max-width: calc(100% - 42px);
  }

  .jk-craft-photo span,
  .jk-craft-photo strong {
    display: block;
    width: 100%;
    max-width: 100%;
    white-space: normal;
  }

  .jk-craft-photo strong {
    font-size: clamp(40px, 12.5vw, 62px);
    overflow-wrap: normal;
  }

  .jk-global {
    display: block;
    min-height: 0;
  }

  .jk-global-image {
    width: 100%;
    min-height: max(320px, 92vw);
  }

  .jk-final {
    padding: 82px 18px;
  }

  /* Shared inner pages */
  body:not(.home-v11) .inner-hero {
    min-height: clamp(430px, 76svh, 540px);
    padding: 64px 0 42px;
  }

  body:not(.home-v11) .inner-hero .h1 {
    max-width: 100%;
    font-size: clamp(48px, 14vw, 70px);
    overflow-wrap: break-word;
  }

  .models-page-v11 .models-index-v11 {
    scroll-snap-type: x proximity;
  }

  .models-page-v11 .models-index-v11 a {
    min-width: 74px;
    min-height: 48px;
    display: grid;
    place-items: center;
    scroll-snap-align: start;
  }

  .models-page-v11 .model-card-media {
    height: clamp(220px, 70vw, 330px);
  }

  .models-page-v11 .model-card-body {
    padding: 22px 17px;
  }

  .models-page-v11 .model-card h3 {
    font-size: clamp(54px, 17vw, 78px);
  }

  .models-page-v11 .model-card-top {
    gap: 10px;
  }

  /* Product detail */
  .product-page-v11 .product-hero,
  .product-page-v11 .product-hero-content {
    min-height: clamp(650px, 100svh, 780px);
  }

  .product-page-v11 .product-hero-content {
    width: var(--jk-container);
    padding: 76px 0 28px;
    align-content: end;
  }

  .product-page-v11 .product-title {
    max-width: 100%;
    margin: 14px 0 20px;
    font-size: clamp(68px, 28vw, 108px);
    line-height: .64;
  }

  .product-page-v11 .product-tagline {
    font-size: 13px;
    line-height: 1.65;
  }

  .product-page-v11 .product-hero-price {
    width: 100%;
    max-width: 100%;
    padding: 20px;
  }

  .product-page-v11 .product-subnav {
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
  }

  .product-page-v11 .product-subnav nav.container {
    width: max-content;
    min-width: 100%;
    max-width: none;
    padding-inline: 15px;
  }

  .product-page-v11 .product-subnav nav a {
    display: flex;
    align-items: center;
    min-height: 48px;
    scroll-snap-align: start;
  }

  .product-page-v11 .product-overview {
    display: block;
  }

  .product-page-v11 .product-overview-copy,
  .product-page-v11 .power-panel,
  .product-page-v11 #build .feature-copy {
    width: 100%;
    padding: 54px 18px;
  }

  .product-page-v11 .product-overview-copy .h2 {
    font-size: clamp(45px, 14vw, 66px);
  }

  .product-page-v11 .spec-item {
    min-width: 0;
    min-height: 96px;
    padding: 16px 8px;
  }

  .product-page-v11 .included-grid {
    grid-template-columns: 1fr;
  }

  .product-page-v11 #build .feature-media {
    min-height: max(300px, 75vw);
  }

  .product-ownership-v11 {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .product-ownership-v11 div {
    min-width: 0;
    min-height: 126px;
    padding: 18px 14px;
  }

  .product-next-v11 a {
    min-height: 108px;
    padding: 24px 18px;
  }

  /* Configurator */
  .config-page-v11 .config-shell {
    display: block;
  }

  .config-page-v11 .config-preview {
    position: relative;
    top: 0;
    width: 100%;
    height: clamp(285px, 72vw, 370px);
    min-height: 0;
  }

  .config-page-v11 .config-preview img {
    padding: 20px 12px 82px;
    object-fit: contain;
  }

  .config-page-v11 .config-preview::before {
    top: 68px;
    left: 18px;
  }

  html[dir="rtl"] .config-page-v11 .config-preview::before {
    left: auto;
    right: 18px;
  }

  .config-page-v11 .config-preview-top {
    top: 15px;
    left: 18px;
    right: 18px;
  }

  .config-page-v11 .config-preview-bottom {
    padding: 24px 18px 20px;
  }

  .config-page-v11 .config-model-name {
    font-size: clamp(38px, 13vw, 52px);
  }

  .config-page-v11 .config-panel {
    width: 100%;
    padding: 28px 15px calc(148px + env(safe-area-inset-bottom));
  }

  .config-page-v11 .config-head {
    padding-bottom: 30px;
  }

  .config-page-v11 .config-head h1 {
    font-size: clamp(45px, 14vw, 64px);
  }

  .config-page-v11 .config-section,
  .config-page-v11.config-enhanced .config-section {
    padding: 34px 0;
  }

  .config-page-v11 .choice-grid.models {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
    overflow: visible;
    padding-bottom: 0;
  }

  .config-page-v11 .choice-grid.models .choice-card {
    width: auto;
    min-width: 0;
    min-height: 154px;
    padding: 0;
    flex: none;
  }

  .config-page-v11 .choice-card.model-choice .model-thumb {
    height: 94px;
  }

  .config-page-v11 .choice-grid:not(.models),
  .config-page-v11 .form-grid {
    grid-template-columns: 1fr;
  }

  .config-page-v11 .field.full {
    grid-column: auto;
  }

  .config-page-v11 .field input,
  .config-page-v11 .field select,
  .config-page-v11 .field textarea,
  .contact-page-v11 input,
  .contact-page-v11 select,
  .contact-page-v11 textarea {
    min-height: 48px;
    font-size: 16px;
  }

  .config-page-v11 .field textarea,
  .contact-page-v11 textarea {
    min-height: 126px;
  }

  .config-page-v11 .consent-row input[type="checkbox"] {
    width: 20px;
    height: 20px;
    min-height: 20px;
    flex: 0 0 20px;
    accent-color: var(--jk-sapphire);
  }

  .config-step-controls {
    bottom: calc(86px + env(safe-area-inset-bottom));
    padding: 10px 0;
  }

  .mobile-total {
    left: 8px;
    right: 8px;
    bottom: max(8px, env(safe-area-inset-bottom));
    min-height: 70px;
    padding: 10px 11px;
    border-radius: 12px;
  }

  .mobile-total strong {
    font-size: 17px;
  }

  .mobile-total .button {
    min-width: 110px;
    padding-inline: 13px;
  }

  :where(.review-modal, .review-dialog, dialog) {
    max-width: calc(100vw - 20px);
    max-height: calc(100dvh - 20px);
  }

  /* Contact and content pages */
  .contact-page-v11 .contact-quick-grid {
    grid-template-columns: 1fr;
  }

  .contact-page-v11 .contact-quick-card {
    min-height: 94px;
    padding: 18px;
  }

  .contact-page-v11 .contact-guidance,
  .contact-page-v11 .contact-form-card {
    width: 100%;
    padding: 50px 18px;
  }

  .contact-page-v11 .contact-form-card h2 {
    font-size: clamp(45px, 14vw, 62px);
  }

  .contact-list a,
  .contact-list div {
    min-height: 48px;
    align-items: center;
    overflow-wrap: anywhere;
  }

  .company-page-v11 .content-card,
  .company-page-v11 .leader-copy {
    padding: 24px 18px;
  }

  .company-page-v11 .leader-image,
  .company-page-v11 .leader-card:nth-child(1) .leader-image {
    height: clamp(300px, 92vw, 470px);
  }

  .site-footer {
    padding-top: 62px;
    padding-bottom: calc(34px + env(safe-area-inset-bottom));
  }

  .footer-grid {
    gap: 28px 22px;
    padding-bottom: 38px;
  }

  .jk-footer-title {
    font-size: clamp(39px, 12vw, 64px);
  }

  .jk-footer-title span,
  .jk-footer-title strong {
    display: block;
    width: 100%;
    max-width: 100%;
  }

  .jk-footer-title strong {
    width: 93%;
    margin-inline-start: 7%;
  }

  .footer-col h4 {
    margin-bottom: 10px;
    font-size: 10px;
  }

  .footer-col a {
    min-height: 38px;
    font-size: 12px;
  }

  .footer-bottom {
    gap: 12px;
    font-size: 10px;
  }

  .jk-advisor {
    bottom: calc(10px + env(safe-area-inset-bottom));
  }

  .mobile-total ~ .jk-advisor {
    bottom: calc(88px + env(safe-area-inset-bottom));
  }
}

@media (max-width: 430px) {
  :root {
    --jk-container: calc(100% - 24px);
  }

  .jk-hero-copy,
  html[dir="rtl"] .jk-hero-copy {
    left: 16px;
    right: 16px;
    bottom: 145px;
  }

  .jk-hero-copy h1 {
    font-size: clamp(48px, 16vw, 66px);
  }

  .jk-hero-specs {
    left: 16px !important;
    right: 16px !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .jk-hero-specs div {
    padding-top: 7px;
  }

  .jk-hero-specs strong {
    font-size: 11px;
  }

  .jk-hero-specs span {
    font-size: 6.5px;
  }

  .models-page-v11 .model-card-top {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
  }

  .models-page-v11 .model-card-price {
    padding-inline-start: 12px;
  }

  .product-page-v11 .product-title {
    font-size: clamp(62px, 26vw, 98px);
  }

  .product-page-v11 .product-hero-price > strong {
    font-size: 34px;
  }

  .product-page-v11 .spec-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .contact-page-v11 .contact-form-actions,
  .final-actions {
    display: grid;
    grid-template-columns: 1fr;
  }

  .contact-page-v11 .contact-form-actions .button,
  .final-actions .button {
    width: 100%;
  }
}

@media (max-width: 360px) {
  :root {
    --jk-container: calc(100% - 18px);
  }

  .brand-name {
    max-width: 98px;
    font-size: 8.5px;
  }

  .jk-hero-copy h1 {
    font-size: 49px;
  }

  .jk-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: start;
  }

  .jk-model-actions {
    grid-template-columns: 1fr;
  }

  .jk-commission-options {
    grid-template-columns: 1fr 1fr;
  }

  .product-ownership-v11 {
    grid-template-columns: 1fr;
  }

  .config-page-v11 .config-panel {
    padding-inline: 11px;
  }

  .config-page-v11 .choice-grid.models {
    gap: 7px;
  }

  .config-page-v11 .choice-card.model-choice .model-choice-copy {
    padding-inline: 10px;
  }

  .footer-grid {
    grid-template-columns: 1fr;
  }

  .footer-brand {
    grid-column: auto;
  }
}

@media (orientation: landscape) and (max-width: 950px) and (max-height: 600px) {
  .mobile-menu nav {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 20px;
  }

  .mobile-menu nav a {
    min-height: 44px;
    font-size: clamp(22px, 6vh, 32px);
  }

  .jk-hero {
    min-height: 680px;
  }

  .config-page-v11 .config-preview {
    height: 72svh;
    min-height: 270px;
  }
}

@media (hover: none) {
  .model-card:hover,
  .contact-quick-card:hover,
  .button:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}