/* King Transport - full-width layout override.
   Loaded after each page's own CSS. Sidebar stays 250px on the left,
   the main (middle) area stretches to fill the rest of the screen.
   Only applies on desktop/tablet (720px and wider); phones are unchanged. */

@media (min-width: 1150px) {
  #imPage {
    -ms-grid-columns: 0 250px minmax(0, 1fr) 0 !important;
    grid-template-columns: 0 250px minmax(0, 1fr) 0 !important;
    -ms-grid-rows: 0 minmax(100vh, auto) 0 !important;
    grid-template-rows: 0 minmax(100vh, auto) 0 !important;
    min-width: 0 !important;
  }
  /* Remove the empty 30px header strip at the very top */
  #imHeader, #imHeaderObjects { height: 0 !important; overflow: hidden; }
  #imContent { padding-top: 0 !important; }
  #imContent {
    -ms-grid-columns: 0 250px repeat(24, minmax(0, 1fr)) 0 !important;
    grid-template-columns: 0 250px repeat(24, minmax(0, 1fr)) 0 !important;
  }
  #imHeaderObjects, #imFooterObjects { width: 100% !important; }
}

@media (max-width: 1149.9px) and (min-width: 720px) {
  #imPage {
    -ms-grid-columns: 0 200px minmax(0, 1fr) 0 !important;
    grid-template-columns: 0 200px minmax(0, 1fr) 0 !important;
    min-width: 0 !important;
  }
  #imContent {
    -ms-grid-columns: 0 200px repeat(24, minmax(0, 1fr)) 0 !important;
    grid-template-columns: 0 200px repeat(24, minmax(0, 1fr)) 0 !important;
  }
  #imHeaderObjects, #imFooterObjects { width: 100% !important; }
}

/* Wide screens: the original background photo has dark edges that would sit
   behind the text once stretched, so use a smooth grey in the same tones. */
@media (min-width: 720px) {
  #imContentGraphics {
    background-image: radial-gradient(ellipse 75% 70% at 50% 62%, #8c9093 0%, #7a8084 45%, #4a545b 80%, #2c363d 100%) !important;
    background-color: #5f676c !important;
  }
}

/* New sidebar logo: remove the old picture's bottom crop so the wording shows in full */
#imSideBar_imObjectImage_13 img { clip-path: none !important; -webkit-clip-path: none !important; }

/* Sidebar background: new dotted-wave image instead of the old dark photo */
@media (min-width: 720px) {
  #imSideBar {
    background-image: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.45) 40%, rgba(0,0,0,0.1) 70%, rgba(0,0,0,0) 100%), url('../images/kt-sidebar-bg.jpg') !important;
    background-size: cover !important;
    background-position: center bottom !important;
    background-repeat: no-repeat !important;
    background-color: #111 !important;
  }
}

/* Short pages (e.g. Terms) still fill the whole screen height */
@media (min-width: 1150px) {
  #imContentGraphics, #imSideBar { min-height: 100vh !important; }
}

/* Sidebar: page links listed directly instead of the burger menu */
#ktSideNav { display: none; }
@media (min-width: 720px) {
  #imSideBar_imMenuObject_24_wrapper, #imSideBar_imMenuObject_25_wrapper { display: none !important; }
  #ktSideNav {
    display: flex; flex-direction: column; align-items: center;
    position: absolute; top: 168px; left: 0; right: 0; z-index: 1003; padding: 0 22px;
  }
  #ktSideNav a {
    display: block; width: 100%; box-sizing: border-box; text-align: center;
    padding: 9px 0; color: #f2f2f2; text-decoration: none;
    font: normal 12pt 'Prompt', sans-serif; letter-spacing: 0.5px;
    border-bottom: 1px solid rgba(212, 175, 55, 0.28);
    transition: color 150ms ease, background-color 150ms ease;
  }
  #ktSideNav a:last-child { border-bottom: 0; }
  #ktSideNav a:hover { color: #d4af37; background-color: rgba(255, 255, 255, 0.04); }
  #ktSideNav a.active { color: #d4af37; font-weight: bold; }
  /* Move the contact details down to make room for the links */
  #imSideBarObjects > .template-object-wrapper:not(#imSideBar_imObjectImage_13_wrapper) { transform: translateY(146px); }
  #imSideBarObjects { height: 1056px !important; }
}

/* Sidebar headings (Call Us / Email / Address): gold instead of red */
#imSideBar_imObjectTitle_14_text, #imSideBar_imObjectTitle_14_text a,
#imSideBar_imObjectTitle_17_text, #imSideBar_imObjectTitle_17_text a,
#imSideBar_imObjectTitle_19_text, #imSideBar_imObjectTitle_19_text a {
  color: #d4af37 !important;
  text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0, 0, 0, 0.6) !important;
}

/* Keep the sidebar links full width when the sidebar is pinned while scrolling */
@media (min-width: 1150px) {
  #ktSideNav { right: auto !important; width: 250px; box-sizing: border-box; }
}
@media (max-width: 1149.9px) and (min-width: 720px) {
  #ktSideNav { right: auto !important; width: 200px; box-sizing: border-box; }
}

/* Homepage: "SAFE, SECURE & AFFORDABLE Car Transport!" heading in gold */
#imTextObject_22_tab0 .imHeading3, #imTextObject_22_tab0 .imHeading3 * {
  color: #d4af37 !important;
  text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0, 0, 0, 0.45) !important;
}

/* Homepage: "Why Choose King Transport?" subheading in gold */
#imTextObject_22_tab0 span[style*="font-size:1.25em"] {
  color: #d4af37 !important;
  text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0, 0, 0, 0.45) !important;
}

/* WhatsApp chat button (replaces Smartsupp) - goes to Max */
#ktWhatsApp {
  position: fixed; right: 22px; bottom: 22px; z-index: 20000;
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 18px; border-radius: 30px;
  background: #25d366; color: #fff !important; text-decoration: none;
  font: bold 11pt 'Prompt', Arial, sans-serif; letter-spacing: 0.3px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.35);
  transition: transform 150ms ease, box-shadow 150ms ease;
}
#ktWhatsApp:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4); }
#ktWhatsApp svg { flex: none; }
@media (max-width: 479.9px) {
  #ktWhatsApp { right: 14px; bottom: 14px; padding: 12px; }
  #ktWhatsApp span { display: none; }
}

/* ===== Phones (under 720px wide) ===== */
@media (max-width: 719.9px) {
  html, body, #imPageExtContainer { background-color: #1f272c !important; background-image: none !important; }
  /* same smooth grey as desktop instead of the dark car-keys photo */
  #imContentGraphics {
    background-image: radial-gradient(ellipse 90% 70% at 50% 45%, #8c9093 0%, #7a8084 45%, #4a545b 85%, #2c363d 100%) !important;
    background-color: #5f676c !important;
  }
  /* top bar */
  #imHeader { background: linear-gradient(180deg, #0b0e11, #171d22) !important; border-bottom: 1px solid rgba(212, 175, 55, 0.45); }
  #imHeader_imObjectTitle_03, #imHeader_imObjectTitle_03_text {
    color: #d4af37 !important; text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0, 0, 0, 0.6) !important;
  }
  #imHeader_pluginAppObj_05 .imHeader_pluginAppObj_05-button,
  #imHeader_pluginAppObj_06 .imHeader_pluginAppObj_06-button,
  #imHeader_pluginAppObj_07 .imHeader_pluginAppObj_07-button {
    background: rgba(255, 255, 255, 0.06) !important; color: #d4af37 !important;
    border: 1px solid rgba(212, 175, 55, 0.7) !important; border-radius: 18px !important;
    font-family: Arial, sans-serif !important; font-weight: bold !important; font-size: 11pt !important;
  }
  #imHeader_pluginAppObj_04 .hamburger-button {
    background-color: transparent !important; border-color: rgba(212, 175, 55, 0.8) !important;
    border-width: 2px !important; border-radius: 8px !important;
  }
}

/* Call page (seite-8.html) */
#ktCallPage {
  grid-column: 1 / -1; -ms-grid-column: 1; -ms-grid-column-span: 27;
  max-width: 560px; width: calc(100% - 24px); box-sizing: border-box; justify-self: center;
  margin: 50px auto 70px; padding: 32px 28px;
  background: rgba(10, 14, 18, 0.5); border: 1px solid rgba(212, 175, 55, 0.35);
  border-radius: 14px; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35); text-align: center;
}
#ktCallPage h2 { margin: 0 0 8px; color: #d4af37; font: normal 26pt 'Prompt', Georgia, serif; text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0,0,0,.45); }
#ktCallPage p { margin: 0 0 24px; color: #e9ecee; font-size: 12pt; }
#ktCallPage .ktCall {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  margin: 0 0 12px; padding: 16px 20px; border-radius: 12px; text-decoration: none;
  background: linear-gradient(180deg, #e6c45a, #c49a2c); color: #1a1a1a;
  font: bold 14pt Arial, sans-serif; box-shadow: 0 4px 12px rgba(0,0,0,.3);
}
#ktCallPage .ktCall:hover { filter: brightness(1.07); }
#ktCallPage .ktCallNum { font-weight: normal; font-size: 12pt; }
#ktCallPage .ktCallWa { background: #25d366; color: #fff; }
@media (max-width: 479.9px) { #ktCallPage { margin: 24px auto 40px; padding: 24px 16px; } #ktCallPage h2 { font-size: 20pt; } }

/* Phone title: clean gold lettering instead of the striped "Faster One" font */
#imHeader_imObjectTitle_03_text, #imHeader_imObjectTitle_03_text * {
  font-family: 'Prompt', Arial, Helvetica, sans-serif !important;
  font-weight: 700 !important; font-style: normal !important;
  font-size: 17pt !important; letter-spacing: 3px !important; text-transform: uppercase !important;
  color: #d4af37 !important; text-shadow: 0 1px 0 #8a6d1d, 0 2px 4px rgba(0, 0, 0, 0.6) !important;
  white-space: nowrap !important;
}
#imHeader_imObjectTitle_03 { text-shadow: none !important; }

/* Phone menu overlay: dark background, gold hover, matching font */
.imHeader_pluginAppObj_04_menuoverlay_back { background: rgba(12, 16, 20, 0.97) !important; }
[id^="menuoverlay_imHeader_pluginAppObj_04"] a { font-family: 'Prompt', Arial, sans-serif !important; letter-spacing: 1px; }
[id^="menuoverlay_imHeader_pluginAppObj_04"] a:hover, [id^="menuoverlay_imHeader_pluginAppObj_04"] a:active { color: #d4af37 !important; }

/* Sidebar box sized to its content so it stays still at the bottom of the page */
@media (min-width: 1150px) { #imSideBarObjects { height: 790px !important; } }
@media (max-width: 1149.9px) and (min-width: 720px) { #imSideBarObjects { height: 540px !important; } }

/* Phones: keep the top bar fixed at the top while scrolling */
@media (max-width: 719.9px) {
  #imHeader { position: -webkit-sticky !important; position: sticky !important; top: 0 !important; z-index: 10500 !important; }
}

/* "Back to top" arrow sits above the WhatsApp button instead of under it */
#imPageToTop { bottom: 86px !important; right: 26px !important; }
@media (max-width: 479.9px) { #imPageToTop { bottom: 72px !important; right: 18px !important; } }