/*
Theme Name: Lê Điền Rental V2
Author: Lê Điền
Description: Giao diện cho thuê xe Lê Điền - xanh lá, trắng, cam; tối ưu desktop và mobile.
Version: 2.0.0
Text Domain: ledien-rental-v2
*/
:root{--g:#08783f;--g2:#045c32;--g3:#eaf7ef;--o:#ff5b16;--ink:#17372b;--muted:#61726a;--line:#dbe9e1}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}
.wrap{max-width:1440px;margin:auto;padding:0 28px}
.top{background:#fff}.head{display:flex;align-items:center;gap:25px;padding:8px 0}
.brand{display:flex;align-items:center;min-width:470px}.brand img{width:390px;height:auto;max-height:100px;object-fit:contain;object-position:left center}
.contactbar{margin-left:auto;display:flex;align-items:center;gap:28px}.contact{display:flex;align-items:center;gap:8px}.contact .i{width:42px;height:42px;border-radius:12px;background:var(--g);color:#fff;display:grid;place-items:center;font-size:20px;font-weight:800}.contact small{display:block;color:#1d6044;font-weight:700}.contact b{display:block;color:var(--o);font-size:19px;white-space:nowrap}.quick{background:var(--g);color:#fff;padding:13px 20px;border-radius:9px;font-weight:800;white-space:nowrap}
.nav{background:linear-gradient(90deg,#08733d,#075c33);color:#fff}.navin{display:flex;justify-content:flex-end}.nav a{padding:15px 22px;font-weight:800;border-right:1px solid #ffffff18}.nav a:first-child{background:var(--o);border-radius:8px 8px 0 0}
.notice{background:var(--g);color:#fff;text-align:center;font-size:18px;padding:10px 15px;font-weight:600;display:none}
.hero{background:linear-gradient(120deg,#08733e 0%,#12894b 48%,#e6f6eb 100%);overflow:hidden}.hero-grid{max-width:1440px;margin:auto;min-height:360px;padding:25px 48px;display:grid;grid-template-columns:48% 52%;align-items:center}.hero h1{font-size:52px;line-height:1.02;margin:4px 0 8px;color:#fff;text-transform:uppercase;text-shadow:0 3px #07562f}.hero h1 span{color:#ff6a1c}.hero p{font-size:22px;color:#fff;margin:8px 0}.hero .sub{font-size:28px;font-weight:900}.slogan{font-size:18px;font-weight:800;background:#ffffff22;display:inline-block;padding:8px 13px;border-radius:20px}
.fleet-art{height:300px;position:relative}.road{position:absolute;left:0;right:0;bottom:12px;height:90px;background:linear-gradient(#ddd,#aaa);border-radius:50%;transform:perspective(350px) rotateX(55deg)}.vcar{position:absolute;bottom:55px;width:310px;height:115px;border-radius:60px 55px 18px 18px;background:linear-gradient(#fff,#c9d4cf);border:3px solid #667770;box-shadow:0 16px 20px #0005}.vcar:before{content:"";position:absolute;left:60px;top:-63px;width:190px;height:82px;border-radius:90px 90px 12px 12px;background:linear-gradient(135deg,#d9e7e1,#5d756b);border:3px solid #667770}.vcar:after{content:"●     ●";position:absolute;left:42px;bottom:-30px;color:#202b27;font-size:35px;letter-spacing:45px}.v1{left:0;transform:scale(.88)}.v2{left:210px;z-index:2}.v3{left:420px;transform:scale(.9);z-index:1}
.features{max-width:1370px;margin:auto;padding:13px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.feat{border:1px solid var(--line);border-radius:11px;padding:13px;display:flex;gap:10px;align-items:center;box-shadow:0 3px 12px #125d3520}.feat .ico{width:48px;height:48px;border-radius:50%;background:var(--g);color:#fff;display:grid;place-items:center;font-size:22px;flex:none}.feat b{color:var(--g2);font-size:17px}.feat small{display:block;margin-top:3px;color:#4e6259}
.content{max-width:1370px;margin:auto;display:grid;grid-template-columns:1fr 330px;gap:15px}.bar{background:linear-gradient(90deg,#08743e,#0a9850);color:#fff;padding:10px 15px;border-radius:10px 10px 0 0;font-size:23px;font-weight:900}.bar a{float:right;font-size:14px;margin-top:5px}.cards{border:1px solid var(--line);border-top:0;border-radius:0 0 10px 10px;padding:10px;display:grid;grid-template-columns:1fr 1fr;gap:12px}.card{border:1px solid var(--line);border-radius:10px;overflow:hidden;display:grid;grid-template-columns:1fr 1fr}.photo{background:linear-gradient(135deg,#e9f5ed,#d4e9dd);min-height:175px;display:grid;place-items:center}.mini{width:185px;height:72px;border:2px solid #6b7b74;background:#f7f8f7;border-radius:40px 45px 12px 12px;position:relative}.mini:before{content:"";position:absolute;left:35px;top:-32px;width:115px;height:50px;border:2px solid #6b7b74;background:#bdd0c7;border-radius:60px 60px 5px 5px}.mini:after{content:"●      ●";position:absolute;left:28px;bottom:-29px;font-size:33px;color:#23312c;letter-spacing:37px}.info{padding:13px 9px 10px 4px}.info h3{margin:0;color:var(--g);font-size:21px}.info p{font-size:13px;margin:5px 0}.spec{font-size:12px;color:#285d45;margin:8px 0}.price{font-size:24px;font-weight:900;color:#ee2d1e;background:#fff0e8;border-radius:7px;padding:6px;text-align:center}.book{display:block;background:var(--g);color:#fff;text-align:center;padding:8px;border-radius:7px;margin-top:6px;font-weight:900}
.booking{border:4px solid var(--g);border-radius:12px;padding:10px;box-shadow:0 4px 15px #0002;height:max-content}.booking h2{background:var(--g);color:#fff;text-align:center;margin:0;padding:10px;border-radius:7px;font-size:24px}.booking p{text-align:center;margin:6px;color:#5a7066}.booking input,.booking select,.booking textarea{width:100%;padding:10px;margin:4px 0;border:1px solid #d3e1d9;border-radius:7px;font-size:14px}.booking button{width:100%;background:var(--o);color:#fff;border:0;border-radius:7px;padding:13px;font-size:17px;font-weight:900;margin-top:5px}
.routes{display:grid;grid-template-columns:repeat(8,1fr);gap:8px;padding:10px 0}.route{border:1px solid var(--line);border-radius:8px;overflow:hidden;text-align:center}.routepic{height:70px;background:linear-gradient(135deg,#65acd0,#dfeecf)}.route b{display:block;font-size:13px;padding:5px 2px 0}.route small{display:block;padding:3px 0 6px}
.about{max-width:1370px;margin:15px auto;padding-bottom:18px}.aboutbox{border:1px solid var(--line);border-top:0;padding:16px;font-size:18px;line-height:1.6}
.foot{background:#075e34;color:#fff;padding:18px 0}.footin{max-width:1370px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:20px}.foot h3{margin:0 0 5px}.foot p{margin:3px 0;color:#e8f5ed}
@media(max-width:900px){
 .wrap{padding:0 16px}.head{height:82px}.brand{min-width:0}.brand img{width:290px;max-height:70px}.contactbar{display:none}.notice{display:block}
 .nav{display:none}.hero-grid{display:block;min-height:650px;padding:40px 28px 10px}.hero h1{font-size:46px;color:#10271e;text-shadow:none}.hero h1 span{color:#148a4d}.hero p{color:#607068;font-size:19px;line-height:1.55}.hero .sub{font-size:21px;color:#13884d}.slogan{background:#e8f7ed;color:#16844c}
 .fleet-art{height:240px;margin-top:20px}.vcar{transform:scale(.68)!important;transform-origin:center bottom}.v1{left:-50px}.v2{left:85px}.v3{left:220px}
 .features{grid-template-columns:1fr 1fr;padding:10px 12px}.feat b{font-size:14px}.feat small{font-size:11px}
 .content{grid-template-columns:1fr;padding:0 12px}.booking{order:-1}.cards{grid-template-columns:1fr}.routes{grid-template-columns:repeat(4,1fr)}
 .footin{grid-template-columns:1fr 1fr;padding:0 14px}
}
@media(max-width:520px){
 .brand img{width:280px}.hero-grid{min-height:720px}.hero h1{font-size:42px}.fleet-art{height:210px}.vcar{transform:scale(.55)!important}.v1{left:-60px}.v2{left:55px}.v3{left:170px}
 .card{grid-template-columns:1fr}.routes{grid-template-columns:repeat(2,1fr)}.footin{grid-template-columns:1fr}
}
