/*
Theme Name: Central Vietnam Transfer
Theme URI: https://centralvietnamtransfer.com
Author: Central Vietnam Transfer
Description: Bespoke WordPress theme for a private transfer business.
Version: 1.0.1
Text Domain: central-vietnam-transfer
*/
:root{--ink:#173a37;--cream:#f7f1e7;--lime:#d9ee70;--orange:#ef7955;--muted:#6f7872}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--cream);color:var(--ink);font-family:"DM Sans",sans-serif}
a{text-decoration:none;color:inherit}
.site-header{height:84px;padding:0 6vw;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #173a3722}
.brand{display:flex;align-items:center;gap:10px;font-size:11px;line-height:1.05;letter-spacing:.07em;text-transform:uppercase}
.brand b{font-size:14px;letter-spacing:.02em}
.brand-mark{width:34px;height:34px;border-radius:50%;background:var(--ink);color:var(--lime);display:grid;place-items:center;font-weight:700;letter-spacing:-.08em}
nav{display:flex;gap:30px;font-size:14px}
nav a:hover{color:var(--orange)}
.header-cta{font-weight:700;font-size:14px}
.header-cta span,button span{color:var(--orange);font-size:20px;margin-left:7px}
.hero{min-height:590px;display:grid;grid-template-columns:1.04fr .96fr;overflow:hidden}
.hero-copy{padding:105px 6vw 70px}
.eyebrow{font-size:11px;letter-spacing:.15em;font-weight:700;margin:0 0 16px;color:var(--orange)}
h1,h2,h3{font-family:"Playfair Display",serif;margin:0;font-weight:600}
h1{font-size:clamp(46px,5vw,76px);line-height:1.05;letter-spacing:-.045em}
em{font-weight:inherit;color:var(--orange)}
.intro{font-size:18px;line-height:1.55;max-width:510px;margin:25px 0 33px;color:#465651}
.trust-row{font-size:12px;display:flex;flex-wrap:wrap;gap:14px;color:#52625d}
.trust-row span:first-child{color:var(--ink);font-weight:700}
.hero-visual{position:relative;background:#c8dbaf;overflow:hidden;min-height:400px}
.sun{position:absolute;right:19%;top:12%;width:94px;height:94px;border-radius:50%;background:#f9bd6a}
.mountain{position:absolute;bottom:0;clip-path:polygon(0 100%,43% 19%,54% 56%,70% 0,100% 100%);width:100%;height:75%;background:#7da48b}
.mountain-front{height:58%;background:#497a68;clip-path:polygon(0 100%,0 54%,29% 19%,50% 64%,72% 27%,100% 70%,100% 100%)}
.road{position:absolute;background:#f6e8bf;width:118%;height:35%;bottom:-17%;right:-12%;border-radius:50% 0 0;transform:rotate(-13deg)}
.car{position:absolute;right:20%;bottom:20%;width:190px;height:68px;border-radius:34px 48px 17px 15px;background:var(--orange);border-bottom:10px solid #c75c43;box-shadow:0 12px 8px #173a3729}
.car:before{content:"";position:absolute;left:46px;top:-31px;width:102px;height:43px;background:#e1f0e8;border-radius:35px 35px 0 0;transform:skew(-12deg)}
.car-window{position:absolute;left:104px;top:-27px;width:41px;height:35px;border-left:3px solid #e5f2eb;transform:skew(-12deg)}
.car i{position:absolute;width:32px;height:32px;border:7px solid #263d3d;background:#d9ee70;border-radius:50%;bottom:-23px}
.car i:first-of-type{left:22px}
.car i:last-of-type{right:20px}
.location-tag{position:absolute;left:8%;bottom:8%;font-size:11px;font-weight:700;letter-spacing:.12em}
.location-tag span{color:var(--orange);margin:0 7px}
.booking-section{background:var(--ink);padding:70px 6vw 55px;color:var(--cream)}
.booking-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:28px}
.booking-heading .eyebrow{color:var(--lime)}
h2{font-size:clamp(34px,3.5vw,52px);line-height:1.08;letter-spacing:-.04em}
.booking-card{display:grid;grid-template-columns:1.15fr 1.15fr .8fr 1fr;gap:14px;background:#fffdf8;padding:15px;color:var(--ink)}
label{font-size:11px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;display:grid;gap:7px}
select,input{font:500 15px "DM Sans";color:var(--ink);background:transparent;border:0;border-bottom:1px solid #aeb7af;padding:7px 0;outline:none}
button{border:0;background:var(--lime);color:var(--ink);font:700 14px "DM Sans";cursor:pointer;padding:14px;align-self:end;transition:transform .2s}
button:hover{transform:translateY(-2px)}
.booking-note{font-size:12px;color:#b8c5bb;margin:15px 0 0}
.routes{padding:110px 6vw}
.routes-showcase{overflow:hidden}.route-heading-side{max-width:300px}.route-heading-side>p{line-height:1.5;color:var(--muted);font-size:15px}.route-heading-side>a{font-size:14px;font-weight:700}.route-heading-side>a span{color:var(--orange);font-size:20px;margin-left:5px}
.route-slider{position:relative}.slider-controls{position:absolute;right:0;top:-66px;display:flex;gap:8px}.slider-button{width:42px;height:42px;padding:0;background:var(--ink);color:var(--cream);font-size:21px;display:grid;place-items:center}.slider-button:hover{background:var(--orange)}
.route-slider-track{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding-bottom:12px;scrollbar-width:none}.route-slider-track::-webkit-scrollbar{display:none}.route-slide{min-width:min(390px,78vw);scroll-snap-align:start;background:#e9e4d9;overflow:hidden}.route-slide-image{height:238px;display:block;overflow:hidden}.route-slide-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.route-slide:hover .route-slide-image img{transform:scale(1.06)}.route-slide-body{padding:20px 22px 23px;min-height:245px;display:flex;flex-direction:column}.route-slide .route-number{color:var(--orange)}.route-slide .route-cities{margin:24px 0 10px}.route-slide h3{font-size:27px;line-height:1.1}.route-slide h3 a:hover{color:var(--orange)}.route-slide-body>p:not(.route-cities){font-size:14px;line-height:1.45;color:#52615b}.route-slide-body>div{margin-top:auto;display:flex;align-items:end;justify-content:space-between;font-size:12px}.route-slide-body strong{font-size:17px}.route-slide-body small{font-size:11px;font-weight:400}
.routes-page-hero{padding:105px 12vw 90px;background:#e5eade}.routes-page-hero h1{font-size:clamp(50px,6vw,83px);max-width:780px}.routes-page-hero>p:not(.eyebrow){font-size:18px;line-height:1.55;max-width:560px;margin:26px 0 0;color:#4c5d56}.routes-page-list{padding:85px 8vw;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.route-directory-card{display:grid;grid-template-columns:1fr 1.08fr;background:var(--cream);border:1px solid #dcd7cc}.route-directory-image{min-height:270px;overflow:hidden}.route-directory-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}.route-directory-card:hover img{transform:scale(1.05)}.route-directory-copy{padding:28px;display:flex;flex-direction:column}.route-directory-copy>span{color:var(--orange);font-size:12px;font-weight:700}.route-directory-copy>p{font-size:13px;font-weight:700;margin:29px 0 10px}.route-directory-copy>p b{color:var(--orange);padding:0 5px}.route-directory-copy h2{font-size:31px}.route-directory-copy h2 a:hover{color:var(--orange)}.route-directory-copy>div{display:flex;justify-content:space-between;align-items:end;margin-top:auto;font-size:12px}.route-directory-copy strong{font-size:17px}.route-directory-copy small{font-size:11px;font-weight:400}
.section-title{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:38px}
.section-title>p{max-width:290px;line-height:1.5;color:var(--muted);font-size:15px}
.route-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.route-card{min-height:310px;padding:26px;background:#e9e4d9;display:flex;flex-direction:column}
.route-card.featured{background:var(--orange);color:#fff9ef}
.route-number{font-size:12px;font-weight:700;opacity:.7}
.route-cities{font-size:13px;font-weight:700;margin:38px 0 13px}
.route-cities b{margin:0 5px}
.route-card h3{font-size:27px;line-height:1.1}
.route-card>p:not(.route-cities){font-size:14px;line-height:1.5;color:#50605a}
.featured>p:not(.route-cities){color:#fff6eb}
.route-card div{margin-top:auto;display:flex;justify-content:space-between;align-items:end;font-size:12px}
.route-card strong{font-size:18px}
.route-card small{font-size:11px;font-weight:400}
.why{background:#e3ebe2;display:grid;grid-template-columns:1fr 1fr;min-height:590px}
.why-image{background:#a7c1aa;position:relative;overflow:hidden}
.why-image p{position:absolute;bottom:45px;left:12%;font-size:clamp(32px,4vw,56px);line-height:.87;font-family:"Playfair Display";color:#f8f0df;z-index:2}
.arch{position:absolute;border:32px solid #426f61;border-bottom:0;width:260px;height:380px;border-radius:200px 200px 0 0;bottom:0}
.arch-one{left:20%}
.arch-two{left:54%;height:270px;border-color:#6f947d}
.why-copy{padding:105px 10%}
.why-copy>p:not(.eyebrow){max-width:420px;line-height:1.6;color:#52625d;font-size:16px}
.why ul{padding:0;margin-top:30px;list-style:none}
.why li{padding:13px 0;border-top:1px solid #9caea1;font-size:15px;font-weight:600}
.why li span{color:var(--orange);font-size:11px;margin-right:20px}
.testimonial{padding:105px 15%;background:var(--cream);text-align:center}
.quote{font-family:"Playfair Display";font-size:clamp(27px,3.4vw,48px);line-height:1.17;max-width:850px;margin:0 auto 30px;letter-spacing:-.03em}
.testimonial>p:last-child{font-size:11px;letter-spacing:.11em}
.contact{text-align:center;background:var(--orange);padding:110px 20px 95px;color:#fffaf1}
.contact .eyebrow{color:var(--ink)}
.contact h2{font-size:clamp(45px,5.5vw,74px)}
.contact h2 em{color:var(--lime)}
.contact>a{display:inline-flex;gap:18px;align-items:center;margin-top:35px;background:var(--ink);padding:16px 24px;font-weight:700}
.contact>a span{color:var(--lime);font-size:20px}
.contact-small{font-size:13px;margin-top:22px}
.contact-small a{text-decoration:underline}
footer{background:var(--ink);color:#e8eee6;display:flex;justify-content:space-between;align-items:center;padding:34px 6vw;font-size:12px}
footer .brand-mark{background:var(--lime);color:var(--ink)}
.modal{position:fixed;inset:0;background:#153632b0;z-index:5;display:none;align-items:center;justify-content:center;padding:20px}
.modal.open{display:flex}
.modal-box{position:relative;width:min(100%,480px);background:var(--cream);padding:42px}
.modal-box h2{font-size:39px}
.modal-box>p:not(.eyebrow){line-height:1.5;color:var(--muted);font-size:14px}
.close{position:absolute;right:13px;top:13px;background:transparent;font-size:29px;padding:5px;color:var(--ink)}
#details-form{display:grid;gap:18px;margin-top:27px}
#details-form button{margin-top:6px}
@media(max-width:760px){.site-header{padding:0 22px;height:70px}
nav{display:none}
.header-cta{font-size:12px}
.hero,.why{grid-template-columns:1fr}
.hero-copy{padding:72px 24px 50px}
.hero-visual{height:360px}
.booking-section,.routes{padding:62px 24px}
.booking-heading,.section-title{display:block}
.booking-heading h2{margin-top:4px}
.booking-card,.route-grid{grid-template-columns:1fr}
.booking-card{padding:20px}
.route-card{min-height:260px}
.why-image{height:350px}
.why-copy{padding:65px 24px}
.testimonial{padding:76px 25px}
.contact{padding:80px 20px}
footer{padding:30px 24px;display:grid;gap:18px}
footer p{margin:0}
.trust-row{display:grid;gap:7px}
}

/* Native SVG logo stays sharp at every size and does not crop. */
.brand-logo{display:block;width:206px;height:46px;object-fit:contain}
footer .brand-logo{filter:brightness(0) invert(1)}
@media(max-width:760px){.brand-logo{width:166px;height:40px}}

/* Route post detail template */
.route-detail-hero{position:relative;isolation:isolate;min-height:650px;padding:94px 12vw 66px;display:flex;flex-direction:column;justify-content:end;background:linear-gradient(90deg,#112c2aeb 0%,#173a37c9 46%,#173a3724 100%),var(--route-image) center/cover;color:var(--cream)}
.route-detail-hero .eyebrow{color:var(--lime)}
.route-detail-hero .eyebrow a:hover{color:var(--orange)}
.route-detail-hero .eyebrow span{margin:0 7px;color:#9eb7a7}
.route-detail-cities{font-size:14px;font-weight:700;letter-spacing:.04em;margin:0 0 18px;color:var(--lime)}
.route-detail-cities b{color:var(--orange);padding:0 5px}
.route-detail-hero h1{font-size:clamp(43px,5.5vw,76px);max-width:810px;text-shadow:0 2px 22px #0b262399}
.route-detail-stats{display:flex;align-items:end;gap:48px;border-top:1px solid #e9efe366;margin-top:57px;padding-top:22px}
.route-detail-stats>div{display:grid;gap:7px;min-width:125px}
.route-detail-stats span{font-size:10px;letter-spacing:.14em;font-weight:700;color:#bdcabe}
.route-detail-stats strong{font-size:18px}.route-detail-stats small{font-size:11px;font-weight:400}
.detail-book,.route-detail-content aside>a{display:inline-flex;align-items:center;gap:11px;background:var(--lime);color:var(--ink);font-size:14px;font-weight:700;padding:15px 19px;margin-left:auto}.detail-book span,.route-detail-content aside>a span{font-size:20px;color:var(--orange)}
.route-detail-content{max-width:1180px;margin:0 auto;padding:90px 30px 110px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.65fr);gap:90px}
.route-detail-content article{font-size:17px;line-height:1.75;color:#3f514b}.route-detail-content article h2{font-size:36px;margin:45px 0 17px;color:var(--ink)}
.route-intro{display:flex;gap:18px;padding:0 0 36px;margin-bottom:35px;border-bottom:1px solid #bdc9be}.route-intro-mark{font-size:25px;color:var(--orange)}.route-intro p{font:600 24px/1.42 "Playfair Display",serif;color:var(--ink);margin:0}
.route-detail-content article ul{padding:0;margin:0;list-style:none;border-top:1px solid #bec7bd}.route-detail-content article li{position:relative;padding:16px 18px 16px 35px;border-bottom:1px solid #bec7bd;font-weight:600;color:var(--ink);background:#fffdf8}.route-detail-content article li:before{content:"↗";position:absolute;left:10px;color:var(--orange)}
.route-seo-copy{margin-top:60px;padding:35px;background:#e5eade}.route-seo-copy h2{margin-top:0!important}.route-seo-copy>p:not(.eyebrow){margin:0;color:#42534d}.route-seo-copy>div{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:25px}.route-seo-copy span{font-size:14px;line-height:1.45;padding:15px;background:var(--cream)}.route-seo-copy b{display:block;color:var(--orange);font-size:12px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:4px}
.image-credit{font-size:11px!important;color:#69756e}.image-credit a{text-decoration:underline}
.route-detail-content aside{position:sticky;top:25px;align-self:start;background:var(--ink);color:var(--cream);padding:34px;box-shadow:12px 12px 0 var(--lime)}.route-detail-content aside .eyebrow{color:var(--lime)}.route-detail-content aside h2{font-size:36px}.route-detail-content aside>p:not(.eyebrow){line-height:1.6;color:#d9e3d9}.route-detail-content aside ul{font-size:14px;line-height:1.6;padding-left:17px;margin:25px 0}.route-detail-content aside>a{margin:5px 0 0;background:var(--orange);color:#fffaf1;width:100%;justify-content:space-between}
.standard-page{max-width:1040px;margin:0 auto;padding:100px 30px 120px}.standard-page article{max-width:900px}.standard-page h1{max-width:820px}.standard-page .intro{max-width:820px;font-size:17px}.standard-page .intro h2{font-size:38px;margin:54px 0 16px}.standard-page .intro p{line-height:1.7;color:#465651}.page-lead{font:600 26px/1.38 "Playfair Display",serif!important;color:var(--ink)!important;max-width:720px}.standard-page .intro ul{padding:0;margin:25px 0 50px;list-style:none;border-top:1px solid #bdc9be}.standard-page .intro li{position:relative;padding:15px 10px 15px 32px;border-bottom:1px solid #bdc9be;font-weight:600}.standard-page .intro li:before{content:"↗";position:absolute;left:4px;color:var(--orange)}.page-callout{margin-top:58px;padding:46px;background:var(--ink);color:var(--cream)}.page-callout .eyebrow{color:var(--lime)}.page-callout h2{font-size:42px}.page-callout p:not(.eyebrow){color:#dce5dc}.page-button{display:inline-flex;align-items:center;gap:12px;margin-top:14px;padding:15px 20px;background:var(--lime);color:var(--ink);font-weight:700}.page-button span{font-size:20px;color:var(--orange)}.contact-page-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:48px}.contact-page-grid section{padding:36px;background:#e5eade}.contact-page-grid section+section{background:#e9e4d9}.contact-page-grid h2{font-size:34px}.contact-page-grid strong{font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--orange)}.contact-page-grid a:not(.page-button){text-decoration:underline}.faq-list{margin-top:48px;border-top:1px solid #bdc9be}.faq-list details{border-bottom:1px solid #bdc9be;padding:0 0 18px}.faq-list summary{padding:20px 30px 2px 0;cursor:pointer;position:relative;font:600 23px/1.3 "Playfair Display",serif}.faq-list summary::marker{color:var(--orange)}.faq-list p{max-width:720px;margin:14px 0 0}
.detail-booking{padding-top:64px}
.route-gallery-section{padding:0 6vw 105px;display:grid;grid-template-columns:.7fr 1.3fr;gap:55px;align-items:end;background:var(--cream)}.route-gallery-section h2{font-size:46px}.route-gallery{position:relative}.route-gallery .slider-controls{top:-59px}.route-gallery-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}.route-gallery-track::-webkit-scrollbar{display:none}.route-gallery-track figure{min-width:78%;height:320px;margin:0;scroll-snap-align:start;overflow:hidden}.route-gallery-track img{width:100%;height:100%;object-fit:cover}
@media(max-width:760px){.route-detail-hero{min-height:560px;padding:65px 24px 47px;background:linear-gradient(0deg,#112c2af2 5%,#173a373b 100%),var(--route-image) center/cover}.route-detail-stats{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:38px}.detail-book{grid-column:1/-1;margin:4px 0 0;justify-content:space-between}.route-detail-content{padding:60px 24px;grid-template-columns:1fr;gap:55px}.route-intro p{font-size:21px}.route-detail-content aside{position:static;box-shadow:8px 8px 0 var(--lime)}.route-seo-copy{padding:25px}.route-seo-copy>div{grid-template-columns:1fr}}
@media(max-width:760px){.standard-page{padding:70px 24px 75px}.standard-page .intro h2{font-size:33px;margin-top:42px}.page-lead{font-size:22px!important}.contact-page-grid{grid-template-columns:1fr;margin-top:35px}.contact-page-grid section{padding:28px}.page-callout{padding:30px}.page-callout h2{font-size:34px}.faq-list summary{font-size:20px}}
@media(max-width:760px){.route-gallery-section{padding:0 24px 65px;display:block}.route-gallery-section h2{font-size:38px;margin-bottom:65px}.route-gallery .slider-controls{top:-53px}.route-gallery-track figure{min-width:88%;height:250px}}
@media(max-width:760px){.slider-controls{position:static;margin:19px 0 15px}.route-slide{min-width:82vw}.route-slide-image{height:210px}.route-heading-side{margin-top:24px}.routes-page-hero{padding:72px 24px 64px}.routes-page-list{padding:45px 24px;grid-template-columns:1fr}.route-directory-card{grid-template-columns:1fr}.route-directory-image{min-height:220px}.route-directory-copy{min-height:250px}}
