@charset "utf-8";

/*
Theme Name: Hibolimo - Black Car Service HTML5 Template.
Author: Metropolitanthemes
Version: 1.0.0

%%%%%%% Responsive Stylesheet %%%%%%%
Desktop-first max-width cascade: 1399 / 1199 / 991 / 767 / 575
*/

/*======================
Max Width 1399px
========================*/
@media (max-width: 1399.98px) {
  /* Header */
  .hl-header .header-inner { padding: 0 30px; }
  .hl-topbar .topbar-wide { padding: 0 30px; }
  .hl-nav > ul { gap: 16px; }
  .hl-nav > ul > li > a { font-size: 14px; }
  .hl-header .header-left { gap: 22px; }
  /* the full nav is showing: the menu toggle waits until it folds away */
  .header-one .header-left .hl-menu-toggle, .header-two .header-left .hl-menu-toggle { display: none; }
  .hl-header .header-right { gap: 18px; }
  .hl-topbar .top-link + .top-link { display: none; }
  .hl-logo img, .hl-header.is-scrolled .hl-logo img { height: 50px; }
  .header-three .header-bar { padding: 0 24px; }
  .header-three .hl-logo img { height: 48px; }
  .header-three .head-cta { display: none; }
  /* Hero */
  .hero-photo { height: 640px; }
  .hero-grid { gap: 50px; }
  .hero-copy { padding-bottom: 180px; }
  .hero-quote { margin: -140px 0 0; }
  /* Quick Quote */
  .qq-fields { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 20px 26px; padding: 26px 28px 28px; }
  .qq-field { grid-column: span 2; }
  .qq-field.is-time, .qq-field.is-pax { grid-column: span 3; }
  .qq-readout dl { gap: 30px; }
  /* Fleet Showroom */
  .stage-car { width: 620px; margin-left: -310px; }
  .stage-word { font-size: 210px; }
  /* Diamond CTA */
  .cta-diamond.is-one { left: 20px; width: 180px; height: 180px; }
  .cta-diamond.is-two { left: 70px; width: 120px; height: 120px; }
  .cta-diamond.is-three { right: 20px; width: 190px; height: 190px; }
  /* Hero Three */
  .hl-quote-band + section { padding-top: 260px; }
  .hl-hero-three { --hl-cw: 1140px; }
}

/*======================
Max Width 1199px
========================*/
@media (max-width: 1199.98px) {
  /* General */
  .sec-pt-120 { padding-top: 110px; }
  .sec-pb-120 { padding-bottom: 110px; }
  .container-wide { padding: 0 30px; }
  /* Header */
  .hl-nav { display: none; }
  .header-one .header-left .hl-menu-toggle, .header-two .header-left .hl-menu-toggle { display: inline-flex; }
  .hl-header .header-inner { height: 88px; }
  .hl-header.header-one + .hl-offcanvas + .hl-offcanvas-overlay + .main-root { padding-top: 132px; }
  .header-three .head-cta { display: inline-flex; }
  /* Hero */
  .hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; }
  .hero-photo { height: 600px; }
  .hero-quote { margin: -120px 0 0; }
  .hero-copy { padding-bottom: 100px; }
  /* Quick Quote */
  .qq-readout { flex-direction: column; align-items: flex-start; gap: 16px; }
  .qq-action { width: 100%; justify-content: space-between; }
  .qq-note { max-width: none; text-align: left; }
  /* Services Directory */
  .dir-media { height: 560px; }
  .dir-name { font-size: 28px; }
  /* Fleet Showroom */
  .stage-car { width: 520px; margin-left: -260px; bottom: 170px; }
  .stage-spec.is-left { left: 20px; }
  .stage-spec.is-right { right: 20px; }
  /* Why Ride */
  .why-box { padding: 70px 50px; }
  /* Drive By */
  .drive-word { font-size: 220px; }
  .drive-car { width: 540px; margin-left: -250px; }
  .drive-card { left: calc(50% - 290px); }
  /* Hero Two */
  .hl-hero-two { min-height: 820px; }
  /* Window Down */
  .window-glass { height: 480px; }
  .window-copy { padding-left: 0; }
  /* Corporate Calculator */
  .calc-out { grid-template-columns: repeat(2, 1fr); }
  /* Hero Three */
  .hl-quote-band + section { padding-top: 240px; }
  .hl-hero-three { --hl-cw: 960px; }
  /* Packages */
  .pkg-media { height: 460px; }
  .pkg-prev { left: 30px; }
  .pkg-next { right: 30px; }
  /* Wedding Day Road */
  .road-copy { padding: 110px 50px 110px 30px; }
  .road-panel { padding: 90px 40px 90px 40px; }
  /* Vehicle Details */
  .gallery-main { height: 460px; }
  /* Rates */
  .rm-row { grid-template-columns: 1.4fr repeat(4, 1fr); padding: 18px 20px; gap: 14px; }
  .rm-car img { display: none; }
  /* Company Pages */
  .about-photo.is-main { height: 480px; }
}

/*======================
Max Width 991px
========================*/
@media (max-width: 991.98px) {
  /* General */
  .sec-pt-120 { padding-top: 90px; }
  .sec-pb-120 { padding-bottom: 90px; }
  .sec-pt-90 { padding-top: 70px; }
  .sec-pb-90 { padding-bottom: 70px; }
  /* General */
  .title-row { flex-direction: column; align-items: flex-start; }
  .section-title { margin-bottom: 44px; }
  .title-row { margin-bottom: 44px; }
  /* Header */
  .hl-topbar .top-note { display: none; }
  .hl-topbar .topbar-inner { justify-content: center; }
  /* Sub Header */
  .hl-subheader { padding: 110px 0 120px; }
  .sub-crumbs { bottom: -120px; }
  /* Hero */
  .hero-grid { grid-template-columns: minmax(0, 1fr); }
  .hero-copy { padding-bottom: 0; }
  .hero-photo { height: 520px; }
  .hero-controls { top: auto; bottom: 464px; }
  .hero-plate { left: 20px; top: 20px; }
  .hero-quote { margin: -80px 20px 0; }
  /* Services Directory */
  .dir-media { height: 460px; }
  /* Fleet Showroom */
  .stage-floor { height: auto; padding: 40px 24px 36px; }
  .stage-panel { position: relative; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
  .stage-panel[hidden] { display: none; }
  .stage-word { font-size: 150px; top: 10px; }
  .stage-car { position: relative; grid-column: 1 / -1; left: auto; bottom: auto; width: 100%; max-width: 560px; margin: 30px auto 70px; }
  .stage-spec, .stage-spec.is-left, .stage-spec.is-right { position: static; transform: none; }
  .stage-spec.is-right { align-items: flex-end; }
  /* Film Band */
  .film-media { width: 100%; aspect-ratio: 16 / 9; }
  .film-stage { padding-bottom: 0; }
  .film-card { position: relative; width: auto; margin: -80px 24px 0; }
  /* Reviews */
  .review-panel { grid-template-columns: 1fr; }
  .review-filter { gap: 26px; }
  /* Diamond CTA */
  .hl-diamond-cta { padding: 220px 0 220px; }
  .cta-diamond.is-one { top: -50px; left: 30px; width: 160px; height: 160px; }
  .cta-diamond.is-two { left: auto; right: 150px; top: 40px; bottom: auto; width: 90px; height: 90px; }
  .cta-diamond.is-three { right: auto; left: 50%; bottom: -70px; margin-left: -80px; width: 160px; height: 160px; }
  /* Hero Two */
  .hl-hero-two { min-height: 0; padding: 200px 0 190px; }
  .hl-quote-dock { margin-top: -100px; }
  /* Core Features */
  .features-title { position: static; }
  /* Corporate Calculator */
  .corp-copy { padding-left: 0; }
  /* Reviews Two */
  .hl-reviews.is-two .review-stack { flex-direction: row; }
  .hl-reviews.is-two .review-stack > div { flex: 1 1 0; min-width: 0; }
  .hl-reviews.is-two .review-panel { grid-template-columns: 1fr; }
  /* Hero Three */
  .hl-hero-three { min-height: 0; padding: 220px 0 260px; --hl-cw: 720px; }
  .hl-quote-band { margin: -110px 0 -110px; }
  .hero-two-controls.is-three { bottom: 150px; }
  .hl-quote-band + section { padding-top: 190px; }
  /* About Mosaic */
  .about-three-copy { padding-left: 0; }
  .about-fade { display: none; }
  /* Wedding Day Road */
  .road-split { grid-template-columns: 1fr; }
  .road-copy { justify-content: flex-start; padding: 90px 30px; }
  .road-panel { justify-content: center; padding: 80px 30px; }
  /* Rate Card */
  .rate-photos { gap: 20px; padding: 0; }
  /* Book A Ride */
  .rq-sheet { position: static; }
  /* Vehicle Details */
  .hl-widget { position: static; }
  .detail-nav { top: 70px; }
  /* Fleet Pages */
  .hl-filter { position: static; }
  /* Rates */
  .rm-row { grid-template-columns: repeat(4, 1fr); }
  .rm-car { grid-column: 1 / -1; }
  .rm-car img { display: block; }
  .route-fields { grid-template-columns: 1fr 1fr; }
  .route-meta { grid-column: 1 / -1; }
  /* Services */
  .sd-sidebar, .journal-side { position: static; }
  .steps-line { display: none; }
  /* Company Pages */
  .about-copy, .corp-intro-copy { padding-left: 0; }
  .faq-side { position: static; }
  .gallery-grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 240px; }
  /* Account Pages */
  .account-card { grid-template-columns: 1fr; }
  .account-aside { min-height: 280px; }
  /* Footer */
  .hl-footer .footer-main { padding: 90px 0 80px; }
  .hl-footer .bottom-inner { flex-wrap: wrap; justify-content: center; text-align: center; }
}

/*======================
Max Width 767px
========================*/
@media (max-width: 767.98px) {
  /* General */
  .row.g-5 { --bs-gutter-x: 24px; }
  .sec-pt-120 { padding-top: 80px; }
  .sec-pb-120 { padding-bottom: 80px; }
  .hl-lead { font-size: 1.05rem; }
  /* Header */
  .hl-header .header-inner { height: 76px; padding: 0 16px; }
  .hl-topbar .topbar-wide { padding: 0 16px; }
  .hl-header.header-one + .hl-offcanvas + .hl-offcanvas-overlay + .main-root { padding-top: 116px; }
  .hl-logo { margin: 0 12px; }
  .hl-logo img, .hl-header.is-scrolled .hl-logo img { height: 42px; }
  .header-call .call-text { display: none; }
  .hl-header .head-cta { display: none; }
  .hl-topbar .topbar-inner { height: 40px; justify-content: center; }
  .hl-topbar .top-link + .top-link { display: none; }
  .header-three .header-bar { height: 74px; padding: 0 16px; }
  .header-three .head-cta { display: none; }
  /* Sub Header */
  .hl-subheader { padding: 90px 0 110px; }
  .sub-crumbs { right: 0; left: 12px; bottom: -110px; }
  .sub-crumbs ol { padding: 16px 20px; display: inline-flex; }
  /* Hero */
  .hero-photo { height: 420px; }
  .hero-controls { bottom: 372px; }
  .hero-controls button { width: 48px; height: 48px; }
  .hero-quote { margin: -60px 0 0; }
  .hero-plate b { font-size: 22px; }
  /* Quick Quote */
  .qq-tabs { gap: 22px; padding: 0 20px; overflow-x: auto; }
  .qq-tab span { white-space: nowrap; font-size: 12px; }
  .qq-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 22px 20px 24px; }
  .qq-field, .qq-field.is-time, .qq-field.is-pax { grid-column: auto; }
  .qq-readout { padding: 18px 20px; }
  .qq-readout dl { flex-wrap: wrap; gap: 16px 28px; }
  /* Why Ride */
  .why-box { padding: 50px 26px; }
  .why-item { grid-template-columns: 100px 1fr; gap: 16px; }
  .why-icon .hl-ghost { font-size: 84px; left: 34px; }
  /* Drive By */
  .drive-track { height: 320px; }
  .drive-word { font-size: 130px; top: 30px; }
  .drive-car { width: 380px; margin-left: -175px; bottom: 44px; }
  .drive-card { left: 16px; top: 16px; padding: 12px 16px; }
  .drive-card b { font-size: 19px; }
  .drive-stats { grid-template-columns: 1fr; gap: 26px; }
  .drive-stat b { font-size: 54px; }
  /* Hero Two */
  .hl-hero-two { padding: 170px 0 170px; }
  .hero-two-controls { bottom: -120px; }
  .hero-two-arrows { display: none; }
  .hl-quote-dock { margin-top: -80px; }
  /* Window Down */
  .window-glass { height: 360px; }
  .window-facts { grid-template-columns: 1fr; }
  .window-fact + .window-fact { border-left: 0; border-top: 1px solid var(--hl-color-line); }
  /* Fleet Cards */
  .fleet-card.is-list { grid-template-columns: 1fr; }
  .fleet-card.is-list .fleet-media { aspect-ratio: 16 / 11; }
  .fleet-card.is-list .fleet-body { padding: 28px 24px; }
  .fleet-fares { grid-template-columns: 1fr; }
  .fleet-fares div + div { padding-left: 0; border-left: 0; border-top: 1px solid var(--hl-color-line); }
  /* Corporate Calculator */
  .hl-corp-calc { padding: 34px 24px 30px; }
  .calc-fields { grid-template-columns: 1fr; }
  .calc-tiers { grid-template-columns: repeat(2, 1fr); row-gap: 22px; }
  /* Counters */
  .counter-item b { font-size: 56px; }
  .hl-counters.is-boxed .counter-box { padding: 50px 26px; }
  /* Reviews Two */
  .hl-reviews.is-two .review-stack { flex-direction: column; }
  /* Video Band */
  .hl-video-band { height: 420px; }
  /* Photo Strip */
  /* Hero Three */
  .hl-hero-three { padding: 200px 0 230px; --hl-cw: 540px; }
  .hl-quote-band { margin: -90px 0 -90px; }
  .hero-two-controls.is-three { bottom: 126px; }
  .hl-quote-band + section { padding-top: 160px; }
  /* Packages */
  .pkg-media { height: 360px; }
  .pkg-card { position: relative; left: auto; right: auto; bottom: auto; margin: -40px 16px 0; flex-direction: column; align-items: flex-start; padding: 24px; }
  .pkg-price { align-items: flex-start; text-align: left; }
  .pkg-prev, .pkg-next { top: 150px; }
  .hl-package-slider { padding-bottom: 10px; }
  /* Book A Ride */
  .rq-step { padding: 34px 22px 30px; }
  .rq-title { font-size: 30px; }
  .rq-car { grid-template-columns: 96px 1fr; padding: 12px; }
  .rq-car-media { height: 70px; }
  .rq-car-price { grid-column: 2; align-items: flex-start; text-align: left; }
  .rq-progress button { font-size: 17px; flex-direction: column; align-items: flex-start; gap: 2px; }
  /* Vehicle Details */
  .vehicle-head { width: 100%; margin-bottom: 0; flex-direction: column; align-items: flex-start; padding: 26px 24px; }
  .gallery-main { height: 340px; }
  .gallery-thumbs .swiper-slide { height: 70px; }
  .spec-plate { grid-template-columns: 1fr; padding: 10px 20px; }
  .cabin-grid { grid-template-columns: 1fr 1fr; }
  .cancel-line { grid-template-columns: 1fr; gap: 16px; }
  .detail-nav { position: static; }
  /* Services */
  .sd-media { height: 320px; }
  .pickup-steps li { grid-template-columns: 1fr; gap: 6px; }
  .faq-item summary { font-size: 19px; padding: 18px 20px; }
  /* Company Pages */
  .about-photos { padding: 0 40px 60px 0; }
  .about-photo.is-main { height: 380px; }
  .about-photo.is-small { height: 200px; }
  .about-year { left: 10px; bottom: 10px; padding: 16px 18px; }
  .about-year b { font-size: 44px; }
  .join-photo, .corp-photo { height: 360px; }
  .hl-form-card { padding: 34px 22px 30px; }
  /* Journal Pages */
  .post-body { padding: 28px 22px 30px; }
  .post-quote, .post-link, .post-quote.is-lead, .post-link.is-lead { padding: 34px 24px; }
  .post-quote blockquote { font-size: 24px; }
  .post-audio { grid-template-columns: 1fr; padding: 24px; }
  .post-head, .post-content, .post-tools, .post-author, .post-nav, .post-comments, .post-respond { margin-left: 22px; margin-right: 22px; }
  .post-author { flex-direction: column; padding: 26px; }
  .post-nav { grid-template-columns: 1fr; }
  .post-pair { grid-template-columns: 1fr; }
  .comment { grid-template-columns: 52px 1fr; gap: 14px; }
  .comment > img { width: 52px; height: 52px; }
  .comment-list.is-child { grid-column: 1 / -1; padding-left: 30px; }
}

/*======================
Max Width 575px
========================*/
@media (max-width: 575.98px) {
  /* General */
  .sec-pt-120 { padding-top: 70px; }
  .sec-pb-120 { padding-bottom: 70px; }
  .container-wide { padding: 0 16px; }
  /* Preloader */
  .hl-preloader .pre-logo { width: 220px; }
  .hl-preloader .pre-beam { width: 360px; height: 240px; margin-top: -110px; }
  .hl-preloader .pre-beam.is-left { left: calc(50% - 250px); }
  .hl-preloader .pre-beam.is-right { left: calc(50% - 110px); }
  /* Header */
  .hl-header .header-inner { justify-content: space-between; }
  .hl-header .header-left, .hl-header .header-right { flex: 0 0 auto; }
  .hl-header .header-inner .hl-logo { order: -1; margin: 0; }
  .hl-header .header-left { order: 2; }
  .hl-header .header-right { order: 1; margin-left: auto; margin-right: 14px; }
  .hl-topbar .hl-social { display: none; }
  .top-rating > span { display: none; }
  .header-three .hl-logo img { height: 40px; }
  .header-three .head-square { display: none; }
  /* Offcanvas Menu */
  .hl-offcanvas { padding: 26px 22px 32px; }
  /* Hero */
  .hl-hero { padding-top: 24px; }
  .hero-photo { height: 340px; }
  .hero-controls { bottom: 292px; }
  .hero-controls .slide-count { display: none; }
  .hero-actions .hl-btn { width: 100%; justify-content: center; }
  /* Quick Quote */
  .qq-fields { grid-template-columns: 1fr; }
  .qq-action { flex-direction: column; align-items: stretch; gap: 14px; }
  .qq-tab span i { display: none; }
  .qq-tabs { flex-wrap: wrap; gap: 0 20px; overflow: visible; }
  .qq-tab span { padding: 14px 0 12px; font-size: 11px; letter-spacing: 0.12em; }
  /* Services Directory */
  .dir-item { grid-template-columns: 44px 1fr 20px; padding: 20px 14px; }
  .dir-no { display: none; }
  .dir-glyph { font-size: 36px; }
  .dir-name { font-size: 24px; }
  .dir-media { height: 360px; }
  .dir-caption { flex-direction: column; align-items: flex-start; gap: 8px; padding: 18px 20px; }
  /* Fleet Showroom */
  .stage-panel { grid-template-columns: 1fr; }
  .stage-spec.is-right { align-items: flex-start; text-align: left; }
  .stage-word { font-size: 96px; }
  .stage-tabs { flex-wrap: wrap; white-space: normal; }
  .stage-tab { padding: 10px 14px; font-size: 14px; }
  /* Why Ride */
  .why-item { grid-template-columns: 1fr; }
  .why-text h3 { font-size: 26px; }
  .why-bar { margin: 0 16px; height: 12px; }
  /* Drive By */
  .drive-car { width: 300px; margin-left: -150px; }
  .drive-card { display: none; }
  /* Film Band */
  .film-card { margin: -40px 0 0; padding: 34px 24px; }
  .film-play { width: 104px; height: 104px; margin: -52px 0 0 -52px; }
  .film-play i { width: 62px; height: 62px; }
  /* Reviews */
  .review-panel { padding: 30px 24px; }
  .panel-score > b { font-size: 60px; }
  .panel-links { flex-direction: column; gap: 14px; }
  .review-filter { flex-wrap: wrap; justify-content: flex-start; gap: 0 22px; }
  .review-filter .filter-btn { white-space: nowrap; padding: 12px 0; font-size: 12px; }
  /* Diamond CTA */
  .hl-diamond-cta { padding: 170px 0 190px; }
  .cta-diamond.is-one { width: 120px; height: 120px; top: -40px; }
  .cta-diamond.is-two { display: none; }
  .cta-diamond.is-three { width: 120px; height: 120px; margin-left: -60px; bottom: -50px; }
  .cta-actions .hl-btn { width: 100%; justify-content: center; }
  /* Journal Rail */
  .journal-body { padding: 24px 22px 28px; }
  .journal-title { font-size: 24px; }
  /* Core Features */
  .features-grid { grid-template-columns: 1fr; }
  .feature-item { padding: 36px 26px; }
  /* Corporate Calculator */
  .calc-out dd { font-size: 26px; }
  /* Hero Three */
  .hl-hero-three { padding-bottom: 190px; --hl-cw: 100%; }
  .hl-quote-band { margin: -70px 0 -70px; }
  .hero-two-controls.is-three { bottom: 100px; }
  .hl-quote-band + section { padding-top: 140px; }
  /* About Mosaic */
  .about-mosaic { grid-template-columns: 1fr; }
  .mosaic-tile:nth-child(2), .mosaic-tile:nth-child(3) { margin-top: 0; }
  /* Wedding Day Road */
  .road-copy { padding: 70px 16px; }
  .road-panel { padding: 60px 16px; }
  /* Rate Card */
  .rate-item { gap: 16px; }
  .rate-thumb { flex-basis: 72px; height: 72px; }
  .rate-name { font-size: 22px; }
  .rate-head { flex-wrap: wrap; gap: 4px 10px; }
  .rate-leader { display: none; }
  .rate-photos { grid-template-columns: 1fr 1fr; }
  .rate-photos .hl-frame:last-child { display: none; }
  /* Vehicle Details */
  .cabin-grid { grid-template-columns: 1fr; }
  /* Rates */
  .rm-row { grid-template-columns: 1fr 1fr; }
  .route-fields { grid-template-columns: 1fr; }
  .rates-tab { flex: 1 1 100%; justify-content: center; }
  /* Offers */
  .offer-card { grid-template-columns: 1fr; }
  .offer-media { aspect-ratio: 16 / 10; }
  .offer-body { padding: 26px 22px; }
  /* Company Pages */
  .gallery-grid { grid-template-columns: 1fr; grid-auto-rows: 260px; }
  .gallery-tile.is-tall { grid-row: span 1; }
  .gallery-tile.is-wide { grid-column: span 1; }
  .tile-cap { opacity: 1; transform: none; }
  /* Account Pages */
  .account-form { padding: 36px 22px 32px; }
  .account-aside { padding: 28px 22px; }
  .aside-copy h2 { font-size: 28px; }
  /* Coming Soon And 404 */
  .soon-count b { font-size: 40px; }
  .soon-count div { padding: 16px 4px; }
  .error-code { gap: 4px; }
  .error-actions .hl-btn { width: 100%; justify-content: center; }
  /* Forms */
  .rq-segment span { min-width: 0; padding: 12px 16px; }
  /* Footer */
  .hl-newsletter { flex-direction: column; gap: 8px; }
  .hl-newsletter .hl-btn { justify-content: center; }
  .footer-links { grid-template-columns: 1fr; }
  .footer-links ul + ul { margin-top: 12px; }
  /* Back To Top */
  .hl-back-to-top { right: 16px; bottom: 16px; width: 46px; height: 46px; }
}
