@charset "utf-8";@import "fontawesome-4.6.3.min.css";@import "framework.css";#topbar{padding:15px 0;font-size:.8rem;text-transform:none}#topbar *{margin:0}#topbar ul li{display:inline-block;margin-right:10px;padding-right:15px;border-right:1px solid}#topbar ul li:last-child{margin-right:0;padding-right:0;border-right:none}#topbar i{margin:0 5px 0 0;line-height:normal}#header #logo{margin-top:15px;margin-bottom:5px}#header #logo *{margin:0;padding:0;line-height:1}#header #logo h1{font-size:22px;font-variant:small-caps}#header #logo p{font-size:12px;text-transform:lowercase}#pageintro{padding:150px 0}#pageintro article *{text-transform:none}#pageintro article .heading{margin:0 0 50px;padding:0;line-height:1;font-size:64px}#pageintro article p:first-of-type{margin-bottom:20px;font-size:26px}#pageintro article footer{margin-top:80px}#pageintro article footer a{
	padding-bottom: 15px;
	border-bottom: 2px solid
}#services{position:relative}#services .table-cell{margin-top:-1px;padding:3%;border:1px solid;border-top:none}#services article{text-align:center}#services article *{margin:0;line-height:1}#services article i{display:inline-block;width:50px;height:50px;line-height:48px;margin-bottom:20px;border:1px solid;text-align:center;font-size:24px}#services article .heading{margin-bottom:10px;font-size:1.2rem}#services article p{margin-bottom:10px;line-height:1.4}.container{
	padding-top: 40px;
	padding-right: 0;
	padding-bottom: 40px;
	padding-left: 0;
}.cta > li:last-child{margin-bottom:0}.cta article{display:block;position:relative;min-height:80px;padding:0 0 0 70px}.cta article::before,.cta article::after{display:table;content:""}.cta article::after{clear:both}.cta article *{margin:0;line-height:1}.cta article i{display:block;position:absolute;top:0;left:0;width:50px;height:50px;line-height:48px;border:1px solid;text-align:center;font-size:24px}.cta article .heading{margin-bottom:10px;font-size:1.2rem}.cta article p{margin-bottom:10px;line-height:1.4}#comments ul{margin:0 0 40px;padding:0;list-style:none}#comments li{margin:0 0 10px;padding:15px}#comments .avatar{float:right;margin:0 0 10px 10px;padding:3px;border:1px solid}#comments address{font-weight:700}#comments time{font-size:smaller}#comments .comcont{display:block;margin:0;padding:0}#comments .comcont p{margin:10px 5px 10px 0;padding:0}#comments form{display:block;width:100%}#comments input,#comments textarea{width:100%;padding:10px;border:1px solid}#comments textarea{overflow:auto}#comments div{margin-bottom:15px}#comments input[type="submit"],#comments input[type="reset"]{display:inline-block;width:auto;min-width:150px;margin:0;padding:8px 5px;cursor:pointer}.sidebar .sdb_holder{margin-bottom:50px}.sidebar .sdb_holder:last-child{margin-bottom:0}#footer{padding:40px 0;text-align:center}#footer .heading,#footer ul{margin-bottom:30px}#footer > ul:last-of-type{margin-bottom:40px}#footer .faico a{border-radius:50%}#footer #copyright *{margin:0;padding:0}*,::before,::after{transition:all .3s ease-in-out}#mainav form *{transition:none}nav ul,nav ol{margin:0;padding:0;list-style:none}#mainav,#breadcrumb,.sidebar nav{line-height:normal}#mainav .drop::after,#mainav li li .drop::after,#breadcrumb li a::after,.sidebar nav a::after{position:absolute;font-family:"FontAwesome";font-size:10px;line-height:10px}#mainav ul.clear{margin-top:3px}#mainav ul{text-transform:none}#mainav ul ul{z-index:9999;position:absolute;width:180px;text-transform:none}#mainav ul ul ul{left:180px;top:0}#mainav li{display:inline-block;position:relative;margin:0 15px 0 0;padding:0}#mainav li:last-child{margin-right:0}#mainav li li{width:100%;margin:0}#mainav li a{display:block;padding:30px 0}#mainav li li a{border:solid;border-width:0 0 1px}#mainav .drop{padding-left:15px}#mainav li li a,#mainav li li .drop{display:block;margin:0;padding:10px 15px}#mainav .drop::after,#mainav li li .drop::after{content:"\f0d7"}#mainav .drop::after{top:35px;left:5px}#mainav li li .drop::after{top:15px;left:5px}#mainav ul ul{visibility:hidden;opacity:0}#mainav ul li:hover > ul{visibility:visible;opacity:1}#mainav form{display:none;margin:0;padding:0}#mainav form select,#mainav form select option{display:block;cursor:pointer;outline:none}#mainav form select{width:100%;padding:5px;border:none}#mainav form select option{margin:5px;padding:0;border:none}#breadcrumb{padding:15px 0}#breadcrumb ul{margin:0;padding:0;list-style:none;text-transform:none}#breadcrumb li{display:inline-block;margin:0 6px 0 0;padding:0}#breadcrumb li a{display:block;position:relative;margin:0;padding:0 12px 0 0;font-size:12px}#breadcrumb li a::after{top:3px;right:0;content:"\f101"}#breadcrumb li:last-child a{margin:0;padding:0}#breadcrumb li:last-child a::after{display:none}.sidebar nav{display:block;width:100%}.sidebar nav li{margin:0 0 3px;padding:0}.sidebar nav a{display:block;position:relative;margin:0;padding:5px 10px 5px 15px;text-decoration:none;border:solid;border-width:0 0 1px}.sidebar nav a::after{top:9px;left:5px;content:"\f101"}.sidebar nav ul ul a{padding-left:35px}.sidebar nav ul ul a::after{left:25px}.sidebar nav ul ul ul a{padding-left:55px}.sidebar nav ul ul ul a::after{left:45px}.pagination{display:block;width:100%;text-align:center;clear:both}.pagination li{display:inline-block;margin:0 2px 0 0}.pagination li:last-child{margin-right:0}.pagination a,.pagination strong{display:block;padding:8px 11px;border:1px solid;background-clip:padding-box;font-weight:400}#backtotop{z-index:999;display:inline-block;position:fixed;visibility:hidden;bottom:20px;right:20px;width:36px;height:36px;line-height:36px;font-size:16px;text-align:center;opacity:.2}#backtotop i{display:block;width:100%;height:100%;line-height:inherit}#backtotop.visible{visibility:visible;opacity:.5}#backtotop:hover{opacity:1}table,th,td{border:1px solid;border-collapse:collapse;vertical-align:top}table,th{table-layout:auto}table{width:100%;margin-bottom:15px}th,td{padding:5px 8px}td{border-width:0 1px}#gallery{display:block;width:100%;margin-bottom:50px}#gallery figure figcaption{display:block;width:100%;clear:both}#gallery li{margin-bottom:30px}.faico{margin:0;padding:0;list-style:none}.faico li{display:inline-block;margin:8px 5px 0 0;padding:0;line-height:normal}.faico li:last-child{margin-right:0}.faico a{display:inline-block;width:36px;height:36px;line-height:36px;font-size:18px;text-align:center;color:#474747;background-color:#FFF}.faico a:hover{color:#FFF}.faicon-dribble:hover{background-color:#EA4C89}.faicon-facebook:hover{background-color:#3B5998}.faicon-google-plus:hover{background-color:#DB4A39}.faicon-linkedin:hover{background-color:#0E76A8}.faicon-twitter:hover{background-color:#00ACEE}.faicon-vk:hover{background-color:#4E658E}body{color:#474747;background-color:#F7F7F7}a{color:#B97D2D}a:active,a:focus{background:transparent}hr,.borderedbox{border-color:#D7D7D7}label span{color:red;background-color:inherit}input:focus,textarea:focus,:required:focus{border-color:#B97D2D}.overlay{color:#FFF;background-color:inherit}.overlay::after{color:inherit;background-color:rgba(0,0,0,.55)}.btn,.btn.inverse:hover{
	color: #FFF;
	background-color: #339933;
	border-color: #B97D2D
}.btn:hover,.btn.inverse{color:inherit;background-color:transparent;border-color:inherit}.row0,.row0 a{color:#474747;background-color:#F7F7F7}.row1{color:#474747;background-color:#FFF}.row3{color:#474747;background-color:#FFF}.row4{color: #ffffff;background-color: #000}#topbar ul li{border-color:rgba(255,255,255,.2)}#topbar > div:last-of-type li:first-child a{color:#B97D2D}#header #logo h1 a{color:inherit;background-color:inherit}#pageintro article footer a{color:inherit;border-color:inherit}#services .table-cell{border-color:#D7D7D7}#services article i{color:#B97D2D;border-color:#D7D7D7}#services article:hover i{color:#FFF;background-color:#B97D2D;border-color:#B97D2D}.cta article i{color:#B97D2D;border-color:#D7D7D7}.cta article:hover i{color:#FFF;background-color:#B97D2D;border-color:#B97D2D}#footer #copyright a{color:inherit;background-color:inherit}#mainav li a{color:inherit}#mainav .active a,#mainav a:hover,#mainav li:hover > a{color:#B97D2D;background-color:inherit}#mainav li li a,#mainav .active li a{color:#FFF;background-color:rgba(0,0,0,.6);border-color:rgba(0,0,0,.6)}#mainav li li:hover > a,#mainav .active .active > a{color:#FFF;background-color:#B97D2D}#mainav form select{color:#FFF;background-color:#413E3D}#breadcrumb a{color:inherit;background-color:inherit}#breadcrumb li:last-child a{color:#B97D2D}.container .sidebar nav a{color:inherit;border-color:#D7D7D7}.container .sidebar nav a:hover{color:#B97D2D}.pagination a,.pagination strong{border-color:#D7D7D7}.pagination .current *{color:#FFF;background-color:#B97D2D}#backtotop{color:#FFF;background-color:#B97D2D}table,th,td,#comments .avatar,#comments input,#comments textarea{border-color:#D7D7D7}#comments input:focus,#comments textarea:focus,#comments :required:focus{border-color:#B97D2D}th{color:#FFF;background-color:#373737}tr,#comments li,#comments input[type="submit"],#comments input[type="reset"]{color:inherit;background-color:#FBFBFB}tr:nth-child(even),#comments li:nth-child(even){color:inherit;background-color:#F7F7F7}table a,#comments a{background-color:inherit}@media screen and (min-width:978px){.hoc{max-width:978px}}@media screen and (max-width:900px){.hoc{max-width:90%}#header{padding:15px 0}#header #logo{margin:10}#mainav ul{display:none}#mainav form{display:block;margin-top:8px}#comments input[type="reset"]{margin-top:10px}.pagination li{display:inline-block;margin:0 5px 5px 0}}@media screen and (max-width:750px){.imgl,.imgr{display:inline-block;float:none;margin:0 0 10px}.fl_left,.fl_right{display:block;float:none}.one_half,.one_third,.two_third,.one_quarter,.two_quarter,.three_quarter{display:block;float:none;width:auto;margin:0 0 30px;padding:0}#topbar{padding-top:15px;text-align:center}#topbar ul{margin:0 0 15px;line-height:normal}#header{text-align:center}#header #logo{margin:0 0 30px}#mainav form{margin-top:0}#pageintro article .heading{margin-bottom:30px;font-size:38px}#pageintro article p:first-of-type{margin-bottom:20px;font-size:18px}#services .table,#services .table-row,#services .table-cell{display:block;width:100%}#services .table-cell{padding:5%}}@media screen and (max-width:450px){#topbar ul li{margin-bottom:2px;padding-right:0;border-right:none}}@media screen and (max-width:650px){.scrollable{display:block;width:100%;margin:0 0 30px;padding:0 0 15px;overflow:auto;overflow-x:scroll}.scrollable table{margin:0;padding:0;white-space:nowrap}.inline li{display:block;margin-bottom:10px}.pushright li{margin-right:0}.font-x2{font-size:1.4rem}.font-x3{font-size:1.6rem}}@media (max-width:768px){.hero-overlay{margin-top:-20px;padding:20px 15px}}
/* ================================
   Review Floating Box หน้า index
==================================*/
.review-floating-box{width:100%;display:flex;justify-content:flex-end;padding:10px 30px;box-sizing:border-box;margin-top:10px;z-index:10;position:relative}.review-box{background-color:rgb(255 255 255 / .95);padding:14px 22px;border-radius:12px;font-weight:500;font-size:15px;line-height:1.6;color:#000;max-width:320px;box-shadow:0 2px 6px rgb(0 0 0 / .15);transition:all 0.3s ease;word-break:break-word;white-space:normal}.review-box a{color:#000;text-decoration:none;display:block}.review-box:hover{background-color:rgb(255 255 255);box-shadow:0 4px 12px rgb(0 0 0 / .2);transform:scale(1.03)}

/* ================================
   Car Gallery for รถของเรา หน้าเพจ
==================================*/
.car-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;padding:20px;max-width:1200px;margin:0 auto}@media (max-width:992px){.car-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.car-grid{grid-template-columns:1fr}}.car-card{background-color:#fff;border:1px solid #ddd;border-radius:12px;padding:20px;text-align:center;box-shadow:0 4px 12px rgb(0 0 0 / .06);transition:all 0.3s ease;display:flex;flex-direction:column;align-items:center;height:auto;position:relative}.car-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgb(0 0 0 / .15)}.car-card img{max-width:100%;height:auto;max-height:200px;object-fit:contain;margin-bottom:15px;display:block;box-shadow:0 2px 10px rgb(0 0 0 / .08);border-radius:4px}.car-card h4{font-size:1.2em;margin:10px 0 5px;font-weight:700;color:#333;text-transform:uppercase}.car-card .price{font-size:1em;font-weight:700;margin-bottom:8px;color:#444}.top-pick-badge{position:absolute;top:12px;left:12px;background:crimson;color:#fff;font-size:12px;padding:4px 10px;border-radius:20px;font-weight:700;box-shadow:0 2px 5px rgb(0 0 0 / .15);min-height:24px;line-height:1;visibility:hidden;opacity:0}.car-card.top-pick .top-pick-badge{visibility:visible;opacity:1}.car-buttons{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:nowrap;margin-top:12px;width:100%}@media (max-width:480px){.car-buttons{flex-direction:column}.btn,.btn-green{width:100%}}.btn,.btn-green{flex:1;padding:12px 0;font-size:15px;font-weight:600;border-radius:6px;border:none;text-align:center;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;line-height:1.4;transition:background-color 0.3s ease;color:#fff}.btn{background-color:#2f5f31}.btn:hover,.btn:focus{background-color:#1f4421;outline:none}.btn-green{background-color:#2a8a30}.btn-green:hover,.btn-green:focus{background-color:#1f6e24;outline:none}.car-icons{display:flex;justify-content:space-between;align-items:stretch;gap:12px;padding:0;margin:10px 0;list-style:none;flex-wrap:nowrap}.car-icons li{flex:1 1 22%;display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:rgb(0 0 0 / .04);border-radius:6px;padding:8px 4px;box-shadow:0 1px 2px rgb(0 0 0 / .05);font-size:13px;text-align:center;min-width:60px;box-sizing:border-box;transition:transform 0.2s ease}.car-icons .icon{font-size:18px;margin-bottom:2px}.car-icons .label{font-size:11px;color:#333;word-break:keep-all}@media (max-width:480px){.car-icons{gap:8px}.car-icons li{min-width:72px;padding:6px 4px}}

/* ================================
   Feature Grid คำคมหน้าแรก
==================================*/
.feature-grid{display:flex;flex-wrap:wrap;gap:30px;justify-content:center;margin:40px auto;max-width:1200px;padding:0 20px}.feature-item{flex:1 1 300px;background:#fff;border:1px solid #e0e0e0;border-radius:12px;padding:20px;box-shadow:0 4px 10px rgb(0 0 0 / .05);transition:transform 0.3s ease}.feature-item:hover{transform:translateY(-5px);box-shadow:0 6px 16px rgb(0 0 0 / .08)}.feature-item i{font-size:30px;color:#c49a00;margin-bottom:10px;display:inline-block}.feature-item h5{font-size:18px;font-weight:700;color:#333;margin:10px 0}.feature-item p{font-size:15px;color:#555;line-height:1.6}.feature-item footer{margin-top:15px}.feature-item footer a{color:#2a7ae2;text-decoration:none;font-weight:500}.feature-item footer a:hover{text-decoration:underline}
/* ================================
   CTA Button ปุ่มไต้คำคม 
==================================*/
.cta-button{display:inline-block;background-color:#2a9d8f;color:#fff;font-size:20px;font-weight:700;padding:16px 32px;border-radius:8px;text-decoration:none;transition:background 0.3s ease,transform 0.2s ease,box-shadow 0.3s ease;box-shadow:0 4px 12px rgb(0 0 0 / .1)}.cta-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgb(0 0 0 / .15);background:linear-gradient(to right,#2dcf90,#1f9d72)}@media screen and (max-width:768px){.cta-button{font-size:16px;padding:10px 24px}.feature-item{flex:1 1 100%}}

/* ================================
  end of edit 1
==================================*/

/* ================================
  start of edit 2
==================================*/
/* Start of line qr code effect */
.qr-line-img{width:160px;height:160px;border-radius:16px;box-shadow:0 4px 10px rgb(0 0 0 / .15);transition:all 0.3s ease-in-out}.qr-line-img:hover{transform:scale(1.05) translateY(-3px);box-shadow:0 8px 20px rgb(0 0 0 / .25);cursor:pointer}.qr-hover-img{width:160px;height:160px;border-radius:16px;box-shadow:0 4px 10px rgb(0 0 0 / .15);transition:transform 0.3s ease,box-shadow 0.3s ease;display:block;margin:0 auto}.qr-hover-img:hover{transform:scale(1.05) translateY(-3px);box-shadow:0 8px 20px rgb(0 0 0 / .25);cursor:pointer}.qr-box{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;padding:20px}.qr-box .heading{font-weight:700;margin-bottom:15px;font-size:16px;color:#5a3b00}.qr-box .heading span{font-size:14px;color:#a55a00}
/* End of line qr code effect */

/* Start of ปุ่ม เขี่ยวเข้ม หน้า Index */
.popular-car-box{background-color:#2e5b3e;padding:20px 15px;border-radius:10px;text-align:center;max-width:100%;margin-bottom:30px;margin-top:30px;transition:background-color 0.3s ease,transform 0.2s ease}.popular-car-box:hover{background-color:#1f4630;transform:translateY(-2px);cursor:pointer}.popular-car-box a{text-decoration:none;color:#fff;display:block}
/* End of ปุ่ม เขี่ยวเข้ม หน้า Index  */
/* Layout หน้า Contact page  */
.contact-wrapper{display:flex;flex-wrap:wrap;gap:40px;padding:40px 20px;background-color:#f9f9f9;border-radius:12px;max-width:1200px;margin:auto;box-sizing:border-box}.contact-left,.contact-right{flex:1 1 0%;min-width:300px;max-width:100%;background:#fff;padding:30px;border-radius:10px;box-shadow:0 3px 8px rgb(0 0 0 / .05);box-sizing:border-box}@media (max-width:900px){.contact-left,.contact-right{flex:1 1 100%;padding:20px}.contact-wrapper{padding:20px}}.contact-left form .form-group{margin-bottom:20px}.contact-left form label{display:block;font-weight:600;margin-bottom:8px;color:#333}.contact-left form input,.contact-left form select,.contact-left form textarea{width:100%;padding:12px 15px;border:1px solid #ccc;border-radius:6px;font-size:1em;background-color:#fefefe}.contact-left form textarea{resize:vertical}.btn-submit{background-color:#2a8a30;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:1em;cursor:pointer;transition:background-color 0.2s ease}.btn-submit:hover{background-color:#1f6e24}
/* End Layout หน้า Contact page  */

/* Contact Info Styling */
.contact-info {
  list-style: none;
  padding: 0;
  margin-top: 0;
}

.contact-info li {
  margin-bottom: 12px;
  font-size: 1em;
  line-height: 1.6;
  color: #333;
}

.contact-info a {
  color: #2a8a30;
  text-decoration: none;
}

.contact-info a:hover {
  text-decoration: underline;
}

.qrcode {
  display: block;
  margin-top: 20px;
  max-width: 160px;
  height: auto;
  border-radius: 8px;
}

/* Responsive: Stack on mobile */
@media (max-width: 768px) {
  .contact-left, .contact-right {
    flex: 1 1 100%;
    padding: 20px;
  }

  .contact-wrapper {
    padding: 20px;
  }
}


h2, h3 {
  font-weight: 600;
  color: #333;
  margin-bottom: 15px;
}

.description {
  margin-bottom: 25px;
  color: #666;
}

.form-group {
  margin-bottom: 20px;
}

label {
  display: block;
  margin-bottom: 8px;
  font-weight: 500;
}

input, select, textarea {
  width: 100%;
  padding: 12px;
  font-size: 16px;
  border-radius: 6px;
  border: 1px solid #ccc;
}

textarea {
  resize: vertical;
}

.btn-submit {
  background-color: #007BFF;
  color: #fff;
  padding: 12px 24px;
  border: none;
  border-radius: 6px;
  font-size: 16px;
  cursor: pointer;
  transition: 0.3s ease;
}

.btn-submit:hover {
  background-color: #0056b3;
}

.contact-info {
  list-style: none;
  padding: 0;
  margin-bottom: 20px;
}

.contact-info li {
  margin-bottom: 10px;
}

.qrcode {
  width: 150px;
  margin-top: 10px;
  margin-bottom: 20px;
}
/* Layout flex-container แนะนำให้ใช้ร่วม */


/* Sidebar */
.sidebar {
  flex: 1 1 250px;
  background-color: #f9f9f9;
  border-radius: 10px;
  padding: 24px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

.sidebar-title {
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 20px;
  color: #222;
}

.sidebar-menu ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sidebar-menu li {
  margin-bottom: 12px;
}

.sidebar-menu a {
  text-decoration: none;
  color: #333;
  padding: 10px 14px;
  display: block;
  border-radius: 6px;
  transition: background-color 0.3s ease, color 0.3s ease;
  font-weight: 500;
}

.sidebar-menu a:hover,
.sidebar-menu a.active {
  background-color: #FF6600;
  color: #fff;
  font-weight: 600;
}

/* Content Area */
.content {
  flex: 3 1 600px;
  background-color: #fff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

.content h2 {
  font-size: 26px;
  color: #222;
  margin-bottom: 20px;
  font-weight: 700;
}

/* Responsive */
@media (max-width: 768px) {
  .rental-layout {
    flex-direction: column;
  }

  .sidebar, .content {
    flex: 1 1 100%;
    padding: 20px;
  }
}


/* ---------- SECTION BLOCK ---------- */
.section-block {
  background: #fff;
  padding: 30px;
  border-radius: 10px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  margin-bottom: 30px;
  transition: all 0.3s ease;
}

/* Headings */
.section-block h3 {
  font-size: 20px;
  color: #333;
  margin-bottom: 12px;
  font-weight: 600;
}

/* List Style */
.section-block ul {
  padding-left: 20px;
  list-style: disc;
  font-size: 16px;
  line-height: 1.6;
  color: #444;
}

/* Paragraphs */
.section-block p {
  margin: 12px 0;
  font-size: 16px;
  line-height: 1.6;
  color: #444;
}

/* ---------- LAYOUT FIX ---------- */
.rental-layout {
  display: flex;
  flex-direction: row;
  gap: 24px;
}

/* Sidebar */
.sidebar {
  width: 250px;
  flex-shrink: 0;
  background-color: #f9f9f9;
  padding: 20px;
  border-radius: 10px;
}

.sidebar-title {
  font-size: 18px;
  font-weight: bold;
  margin-bottom: 12px;
}

.sidebar-menu ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.sidebar-menu li {
  margin-bottom: 8px;
}

.sidebar-menu a {
  text-decoration: none;
  color: #333;
  font-size: 15px;
  display: block;
  padding: 6px 10px;
  border-radius: 6px;
  transition: background 0.2s;
}

.sidebar-menu a:hover,
.sidebar-menu a.active {
  background-color: #ff6600;
  color: #fff;
}

/* ---------- RESPONSIVE MOBILE ---------- */
@media (max-width: 768px) {
  .rental-layout {
    flex-direction: column;
  }

  .sidebar {
    width: 100%;
    margin-bottom: 24px;
  }

  .section-block {
    padding: 20px 16px;
    margin-bottom: 24px;
  }

  .section-block h3 {
    font-size: 18px;
  }

  .section-block ul {
    font-size: 15px;
    padding-left: 16px;
  }

  .section-block p {
    font-size: 15px;
  }
}
/* ---------- ปุ่ม home page main 3ปุ่ม ---------- */
.btn.medium {
  display: block;
  background-color: #009245;
  color: #fff;
  padding: 16px 24px;
  font-size: 1.5rem;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  border-radius: 10px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  line-height: 1.4;
  transition: background 0.3s ease, transform 0.2s;
  width: 100%;
  max-width: 500px;
  margin: 16px auto; /* เพิ่มระยะห่างด้านบน-ล่างพร้อมกัน */
}


.btn.medium:hover {
  background-color: #007733;
  transform: translateY(-2px);
}

/* Responsive: Mobile adjustments */
@media (max-width: 768px) {
  .btn.medium {
    font-size: 1.2rem;
    padding: 14px 18px;
    border-radius: 8px;
  }
}

.nowrap {
  white-space: nowrap;
}

/* ✅ Benefit Lines on index page */
.benefit-lines {
  font-size: 28px;
  line-height: 1.7;
  margin-bottom: 12px;
  text-align: center;
  color: white;
  padding-left: 20px;
  padding-right: 20px;
  box-sizing: border-box;
}

.benefit-lines .line {
  white-space: normal; /* เปลี่ยนจาก nowrap เพื่อให้ข้อความพับบรรทัดอัตโนมัติ */
  word-break: break-word;
}

.benefit-note {
  font-size: 18px;
  color: #eee;
  text-align: center;
  padding: 0 20px;
  box-sizing: border-box;
  margin-top: 10px;
}

/* ปรับขนาดตัวอักษรบนมือถือให้ไม่ใหญ่เกินไป */
@media (max-width: 768px) {
  .benefit-lines {
    font-size: 22px;
    padding-left: 16px;
    padding-right: 16px;
  }

  .benefit-note {
    font-size: 16px;
    padding-left: 16px;
    padding-right: 16px;
  }
}

/* ✅ Caption-style */
.benefit-note {
  font-size: 15px;
  line-height: 1.6;
  color: #ffffff;
  opacity: 0.75;
  text-align: center;
  max-width: 95%;
  margin: 0 auto 36px auto;
  font-style: italic;
  letter-spacing: 0.2px;
}

/* ✅ Responsive */
@media (max-width: 768px) {
  .benefit-lines {
    font-size: 20px;
  }

  .benefit-note {
    font-size: 13.5px;
    line-height: 1.5;
    margin-bottom: 28px;
  }
}

/* --- พื้นหลัง & layout Section Promotion indexpage --- */
.promo-section {
  background: linear-gradient(90deg, #a44cee, #6a20c3);
  padding: 60px 20px;
  color: #f0f0f0; /* เปลี่ยนจาก white เป็น off-white เพื่อสบายตากว่า */
  text-align: center;
}

.promo-title {
  font-size: 30px;
  font-weight: 800;
  margin-bottom: 18px;
  line-height: 1.4;
  color: #fafafa;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

.promo-highlight {
  font-size: 24px;
  font-weight: 700;
  color: #ffffff;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
}

.highlight-price {
  color: #ffeb3b;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6);
}

.promo-subtext {
  font-size: 18px;
  opacity: 0.95;
  line-height: 1.6;
  margin-bottom: 30px;
  color: #e0e0e0;
}

.promo-button {
  display: inline-block;
  background: #6a20c3; /* สีพื้นเข้มเพื่อให้เห็นชัด */
  color: #fff;
  padding: 14px 24px;
  font-size: 18px;
  font-weight: bold;
  border-radius: 8px;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.25);
  margin-top: 20px;
  transition: all 0.3s ease;
}

.promo-button:hover {
  background: #5b1ca7;
  transform: scale(1.03);
}


/* Responsive */
@media (max-width: 768px) {
  .promo-title {
    font-size: 22px;
    line-height: 1.4;
  }

  .promo-highlight {
    font-size: 20px;
  }

  .promo-subtext {
    font-size: 16px;
    padding: 0 10px;
  }

  .promo-button {
    font-size: 16px;
    padding: 12px 24px;
  }

  footer .contact-info {
    font-size: 14px;
  }

  footer img.qr {
    width: 140px;
    margin-bottom: 16px;
  }
}
#scrollTopBtn {
  position: fixed;
  bottom: 30px;
  right: 20px;
  z-index: 9999;
  font-size: 20px;
  background-color: #ff6600;
  color: white;
  border: none;
  border-radius: 50%;
  padding: 12px 16px;
  cursor: pointer;
  display: none;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  transition: opacity 0.3s ease;
}

#scrollTopBtn:hover {
  background-color: #e05500;
}
.review-section {
  padding: 40px 0;
  text-align: center;
}

.review-heading {
  font-size: 28px;
  font-weight: 700;
  color: #222;
  margin-bottom: 10px;
}

.review-subheading {
  font-size: 18px;
  color: #666;
  margin-bottom: 30px;
}

.elfsight-app {
  margin-top: 20px;
}

@media (max-width: 768px) {
  .review-heading {
    font-size: 22px;
  }

  .review-subheading {
    font-size: 16px;
  }
}




/* faq SECTION */
.faq-container{max-width:960px;margin:0 auto;padding:40px 20px;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif;color:#333;line-height:1.7;box-sizing:border-box}.faq-heading{font-size:2rem;font-weight:700;margin-bottom:20px;text-align:center;color:#333}.faq-subheading{text-align:center;color:#666;margin-bottom:40px;font-size:1.1rem}.faq-category{font-size:1.35rem;font-weight:700;color:#009245;margin:60px 0 30px;border-bottom:2px solid #e0e0e0;padding-bottom:10px}.faq-item{background-color:#fff;border-radius:12px;box-shadow:0 4px 12px rgb(0 0 0 / .06);margin-bottom:24px;padding:20px}.faq-question{font-size:1.1rem;font-weight:600;margin-bottom:10px;color:#c2185b}.faq-answer{font-size:1rem;color:#333}.faq-footer{text-align:center;margin-top:40px}.faq-button{display:inline-block;background-color:#009245;color:#fff;padding:12px 26px;font-size:16px;font-weight:700;border-radius:10px;text-decoration:none;transition:background-color 0.3s ease}.faq-button:hover{background-color:#007a3d}@media screen and (max-width:768px){.faq-heading{font-size:1.6rem}.faq-subheading{font-size:1rem}.faq-category{font-size:1.2rem}.faq-question{font-size:1rem}.faq-answer{font-size:.95rem}.faq-button{width:100%;padding:12px;font-size:15px}}



.car-list-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* << จาก auto-fit เปลี่ยนเป็นค่านี้ */
  gap: 30px;
  max-width: 1200px;
  width: 100%;

	
	
}


/* กล่องการ์ดแต่ละคัน */
.car-card-box {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
  padding: 20px 15px;
  position: relative;
  transition: transform 0.2s ease;
}

.car-card-box:hover {
  transform: translateY(-6px);
}
.car-card-fleet {
  background: white;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  text-align: center;
  padding: 20px 15px;
  position: relative;
  transition: transform 0.2s ease;
}

.car-card-fleet:hover {
  transform: translateY(-6px);
}
/* รูปรถ */
.car-card-box img {
  width: 100%;
  max-height: 170px;
  object-fit: contain;
}

/* ป้ายยอดนิยม */
.car-badge {
  position: absolute;
  top: 15px;
  left: 15px;
  background: crimson;
  color: #fff;
  font-size: 0.8rem;
  padding: 5px 12px;
  border-radius: 999px;
  font-weight: bold;
  z-index: 1;
}

/* ชื่อรถและราคา */
.car-card-box h4 {
  font-size: 1.1rem;
  font-weight: bold;
  margin: 15px 0 5px;
}

.car-price {
  font-weight: bold;
  color: #444;
  margin-bottom: 10px;
}

.car-specs {
  display: grid;
  grid-template-columns: repeat(4, 1fr); /* 4 ช่องแนวนอน */
  gap: 10px;
  margin: 10px 0 20px;
}

.car-spec-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: #f1f4f8;
  padding: 8px 6px;
  border-radius: 8px;
  font-size: 0.75rem;
  color: #333;
  text-align: center;
  line-height: 1.2;
  white-space: nowrap;
}

.car-spec-item .icon {
  font-size: 1.2rem;
  margin-bottom: 4px;
}


/* ปุ่มด้านล่าง */
.car-action-buttons {
  display: flex;
  justify-content: space-around;
  margin-top: 15px;
  gap: 10px;
}

.car-action-buttons .car-btn {
  flex: 1;
  padding: 12px 15px;
  border-radius: 8px;
  font-size: 0.9rem;
  font-weight: bold;
  color: white;
  text-decoration: none;
  background: #333;
  text-align: center;
  transition: background 0.3s ease;
}

.car-action-buttons .car-btn.green {
  background-color: #2e7d32;
}

.car-action-buttons .car-btn:hover {
  opacity: 0.9;
}

@media screen and (max-width: 1024px) {
  .car-list-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 640px) {
  .car-list-grid {
    grid-template-columns: repeat(1, 1fr);
  }
}

/* ป้องกันทุก element ล้นออกด้านขวา */
html, body {
  max-width: 100%;
  overflow-x: hidden;
  box-sizing: border-box;
}

/* บังคับให้ทุก element ยึด box-sizing */
*, *::before, *::after {
  box-sizing: inherit;
}

/* Footer buttons แสดงแบบ responsive */
footer {
  padding: 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

footer .btn {
  display: block;
  width: 100%;
  max-width: 480px;
  margin-bottom: 12px;
  text-align: center;
  padding: 14px 20px;
  font-size: 16px;
  border-radius: 8px;
  background-color: #2f5f31;
  color: white;
  text-decoration: none;
  font-weight: bold;
  transition: background-color 0.2s ease;
  word-break: break-word;
}

footer .btn:hover {
  background-color: #1f4421;
}
/* Index ที่เที่ยวแนะนำ พื้นหลัง */


/* SECTION: Destination with full-width grey background */


/* Indexpage Tour destination estimation */
.distance-info{font-size:.95rem;color:#666;margin-top:12px}.map-button{display:inline-block;margin-top:10px;padding:10px 16px;background-color:#009245;color:#fff;font-weight:600;font-size:.95rem;border-radius:8px;text-decoration:none;transition:background-color 0.3s ease}.map-button:hover{background-color:#007a38}.car-card:hover{transform:translateY(-6px);box-shadow:0 8px 24px rgb(0 0 0 / .12)}.map-button:hover{transform:scale(1.05)}.hero-section-wrapper{background:linear-gradient(135deg,#f4f9f6 0%,#e9f5ee 100%);width:100vw;margin-left:calc(-50vw + 50%);padding:60px 20px}.hero-section{max-width:900px;margin:0 auto;background:#fff;border-radius:16px;box-shadow:0 8px 30px rgb(0 0 0 / .05);padding:40px 30px;font-family:'Prompt',sans-serif;color:#333;text-align:center}.hero-section h2{font-size:1.8rem;font-weight:700;margin-bottom:30px;color:#009245}.hero-section ul{list-style:none;padding:0;text-align:left;font-size:18px;line-height:1.8;max-width:720px;margin:0 auto 30px}.hero-section li{margin-bottom:12px}.hero-section a{color:#007bff;font-weight:600;text-decoration:none}.hero-section hr{margin:0 auto;width:60%;border:.5px solid #ddd}@media (max-width:600px){.hero-section{padding:30px 20px}.hero-section h2{font-size:1.4rem}.hero-section ul{font-size:16px}}
/* หน้า รถของเรา heading seprator between car categorys */
.section-heading-wrapper{grid-column:1 / -1;text-align:center;margin:60px 0 30px}.section-heading-pill{display:inline-flex;align-items:center;gap:12px;padding:14px 28px;background:linear-gradient(145deg,#f8f8f8,#ffffff);border:1px solid #e0e0e0;border-radius:999px;box-shadow:0 8px 24px rgb(0 0 0 / .05);font-family:'Prompt',sans-serif;font-size:1.5rem;font-weight:600;color:#2e5b3e;transition:all 0.3s ease;cursor:default}.section-heading-pill:hover{transform:translateY(-4px) scale(1.03);box-shadow:0 16px 28px rgb(0 0 0 / .12)}

.error-page-wrapper{display:flex;justify-content:center;align-items:center;padding:60px 15px;min-height:80vh;box-sizing:border-box;background-color:#f5f5f5}.error-container{text-align:center;max-width:600px;width:100%;padding:40px 20px;background:#fff;border-radius:16px;box-shadow:0 8px 30px rgb(0 0 0 / .1);margin:0 auto}.error-container h1{font-size:80px;margin:0;color:#f60}.error-container h2{font-size:28px;margin-top:10px}.error-container p{font-size:18px;margin:20px 0;color:#555}.error-container a{display:inline-block;margin-top:25px;background-color:#009245;color:#fff;padding:12px 24px;border-radius:8px;text-decoration:none;font-weight:700;transition:background-color 0.3s ease}.error-container a:hover{background-color:#007d3e}.car-emoji{margin-bottom: 100px; font-size:40px;margin-top:20px}.sub-brand{margin-top:10px;font-size:16px;color:#777}
/* รถของเรา */
.container-fleet{max-width:480px;margin:0 auto;padding:20px 15px;font-family:'Prompt',sans-serif;color:#333;background-color:#fff;border-radius:16px;box-shadow:0 0 15px rgb(0 0 0 / .06)}.section-title{font-size:1.5rem;font-weight:700;text-align:center;color:#2a2a2a;margin-bottom:20px}.car-featured{display:flex;flex-direction:column;align-items:center;gap:20px;margin-bottom:30px}.car-featured-image img{max-width:100%;border-radius:12px;box-shadow:0 6px 12px rgb(0 0 0 / .1)}.car-featured-details{text-align:center}.car-featured-details h3{font-size:1.2rem;margin-bottom:12px}.pricing-table{width:100%;border-collapse:collapse;margin:0 auto 20px;font-size:.95rem}.pricing-table th{background-color:#000;color:#fff;font-weight:600;text-align:center;padding:10px}.pricing-table td{border:1px solid #ddd;padding:10px;text-align:center}.btn-group{display:flex;gap:10px;justify-content:center;margin-top:10px;flex-wrap:wrap}.btn{padding:10px 16px;border-radius:8px;font-size:.95rem;text-decoration:none;display:inline-block;transition:background-color 0.3s ease}.btn-primary{background-color:#007bff;color:#fff}.btn-primary:hover{background-color:#0056b3}.btn-secondary{background-color:#eaeaea;color:#333}.btn-secondary:hover{background-color:#d5d5d5}.car-gallery{margin-top:40px}.car-gallery .sub-title{text-align:center;font-size:1.1rem;margin-bottom:15px;font-weight:600}.gallery-grid{width:100%;max-width:480px;margin:0 auto;display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:40px}.gallery-grid img{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:10px;box-shadow:0 2px 8px rgb(0 0 0 / .06);transition:transform 0.3s ease;cursor:zoom-in}.gallery-grid img:hover{transform:scale(1.05)}.fleet-header-wrapper{text-align:center;padding-top:30px;padding-bottom:30px}.fleet-title{display:inline-block;font-size:2rem;font-weight:700;color:#333;font-family:'Prompt','Segoe UI',sans-serif;background:#fff;padding:10px 20px;border-radius:12px;box-shadow:0 2px 10px rgb(0 0 0 / .1)}
/* คันอื่นๆ */
.similar-models-udc{padding:40px 20px;background-color:#fff;text-align:center}.similar-title-udc{font-size:1.6rem;font-weight:700;color:#1f2937;margin-bottom:30px}.similar-cars-grid-udc{display:flex;justify-content:center;flex-wrap:wrap;gap:24px}.similar-car-card-udc{background-color:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;width:280px;box-shadow:0 4px 12px rgb(0 0 0 / .06);text-align:center;transition:transform 0.3s ease}.similar-car-card-udc:hover{transform:translateY(-4px)}.similar-car-card-udc img{width:100%;height:auto;border-radius:8px;margin-bottom:14px}.similar-specs-udc{display:flex;justify-content:center;flex-wrap:nowrap;gap:20px;margin-bottom:16px}.spec-item-udc{display:flex;flex-direction:column;align-items:center;font-size:.85rem;color:#374151;white-space:nowrap}.spec-icon{font-size:1.3rem;line-height:1}.spec-text{font-size:.8rem;color:#6b7280;margin-top:4px}.similar-car-card-udc h4{font-size:1.05rem;font-weight:600;color:#111827;margin:10px 0 4px;text-transform:uppercase}.similar-car-card-udc span{font-weight:400;font-size:.95rem;color:#6b7280}.car-price{font-size:1rem;font-weight:500;color:#1f2937;margin-bottom:16px}.btn-primary{display:inline-block;background-color:#00bfff;color:#fff;padding:10px 20px;font-weight:600;font-size:.95rem;border-radius:8px;text-decoration:none;transition:background-color 0.3s ease}.btn-primary:hover{background-color:#09c}@media screen and (max-width:768px){.similar-car-card-udc{width:100%;max-width:320px}.similar-specs-udc{flex-wrap:wrap;gap:16px}}
/* ที่เที่ยว */
.ocr-section-wrapper{display:flex;gap:40px;max-width:1200px;margin:0 auto;padding:60px 20px;background-color:#f5f5f5;flex-wrap:wrap}.ocr-sidebar-sticky{position:sticky;top:100px;background:#fff;padding:20px;border-radius:12px;border:1px solid #ddd;max-width:240px;box-shadow:0 4px 12px rgb(0 0 0 / .05)}.ocr-nav-group{list-style:none;padding:0;margin:0}.ocr-nav-title{font-size:1rem;font-weight:700;color:#555;margin:20px 0 10px;padding-top:10px;border-top:1px solid #eee}.ocr-nav-item{margin-bottom:14px}.ocr-nav-item a{display:flex;align-items:center;font-size:.95rem;color:#007bff;text-decoration:none;transition:color 0.2s ease}.ocr-nav-item a:hover{color:#0056b3}.ocr-nav-icon{font-size:1.2rem;margin-right:8px}.ocr-main{flex:1;min-width:0}.ocr-province-title{font-size:1.8rem;margin-bottom:20px;border-bottom:3px solid #007bff;display:inline-block;padding-bottom:5px}.ocr-spot-card{display:flex;flex-wrap:wrap;background:#fff;border:1px solid #e5e7eb;border-radius:12px;box-shadow:0 4px 12px rgb(0 0 0 / .05);padding:20px;margin-bottom:30px;gap:20px}.ocr-spot-image{width:100%;max-width:280px;height:auto;border-radius:8px;object-fit:cover;flex-shrink:0}.ocr-spot-content{flex:1;min-width:250px}.ocr-spot-title{font-size:1.4rem;margin-bottom:10px}.ocr-button{display:inline-block;background-color:#007bff;color:#fff;padding:10px 16px;border-radius:6px;text-decoration:none;margin:12px 0;transition:background-color 0.3s ease}.ocr-button:hover{background-color:#0056b3}.ocr-tiein{font-style:italic;font-size:.9rem;color:#666}.breadcrumb-wrapper{background-color:#ccc;padding:10px 20px}.breadcrumb-wrapper ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap}.breadcrumb-wrapper li{margin-right:10px}.breadcrumb-wrapper a{text-decoration:none;color:#333}.breadcrumb-wrapper a:hover{text-decoration:underline}@media (max-width:768px){.ocr-section-wrapper{flex-direction:column}.ocr-sidebar-sticky{max-width:100%;margin-bottom:30px}.ocr-spot-card{flex-direction:column;align-items:center}.ocr-spot-image{max-width:100%;width:100%}.ocr-spot-content{width:100%}}