.experience-header { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:20px; padding-bottom:20px; }
.experience-header nav { display:flex; align-items:center; gap:28px; font-size:13px; font-weight:600; }
.experience-header img { width:204px; height:auto; }
.breadcrumbs { display:flex; flex-wrap:wrap; gap:10px; margin:30px 0 36px; font-size:12px; color:#536c60; }
.breadcrumbs a { text-decoration:underline; text-underline-offset:4px; }
.experience-hero { display:grid; grid-template-columns:1.05fr 1fr; gap:55px; align-items:center; padding-bottom:70px; }
.experience-hero h1 { font-size:clamp(38px,4.3vw,66px); letter-spacing:-2.5px; line-height:1.08; }
.experience-intro { font-size:17px; line-height:1.85; margin:25px 0; max-width:560px; }
.experience-hero figure { margin:0; transform:rotate(2deg); }
.experience-hero figure img { width:100%; height:520px; object-fit:cover; border-radius:150px 150px 35px 35px; }
.experience-hero figcaption { text-align:center; font-size:12px; margin-top:12px; color:#536c60; }
.experience-facts { list-style:none; padding:0; display:flex; gap:8px; flex-wrap:wrap; margin-bottom:30px; }
.experience-facts li { border:1px solid #cbd3bb; padding:8px 12px; border-radius:20px; font-size:12px; }
.experience-body { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:80px; align-items:start; padding:55px 0; border-top:1px solid #ccd3bc; }
.experience-body article>section { margin-bottom:58px; }
.experience-body h2, .experience-related h2 { font-size:clamp(29px,3vw,43px); line-height:1.2; margin-bottom:25px; }
.experience-body h3 { font-size:18px; margin:25px 0 12px; }
.experience-body p { line-height:1.9; margin-bottom:18px; }
.experience-itinerary { counter-reset:day; padding:0; list-style:none; }
.experience-itinerary li { position:relative; padding:0 0 26px 58px; line-height:1.8; }
.experience-itinerary li::before { counter-increment:day; content:counter(day,decimal-leading-zero); position:absolute; left:0; top:0; width:38px; height:38px; display:grid; place-items:center; background:#f5c34e; border-radius:50%; font-size:13px; font-weight:700; }
.experience-booking { padding:30px 25px; background:#eef0df; border-radius:25px; position:sticky; top:28px; }
.experience-booking h2 { font-size:30px; letter-spacing:-1px; }
.experience-booking h2 small { display:block; font:12px/2 'Be Vietnam Pro',Arial,sans-serif; letter-spacing:0; }
.experience-booking p { font-size:13px; }
.experience-booking .button { width:100%; }
.experience-booking .experience-small { font-size:11px; margin-top:15px; }
.experience-booking a:not(.button) { overflow-wrap:anywhere; }
.experience-booking hr { border:0; border-top:1px solid #ccd3bc; margin:25px 0; }
.experience-body details { border-bottom:1px solid #cbd3bb; padding:20px 0; }
.experience-body summary { font-weight:600; cursor:pointer; line-height:1.7; }
.experience-body details p { margin:15px 0 0; }
.experience-related { padding:0 0 85px; }
.experience-related>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:25px; }
.experience-related img { width:100%; height:220px; object-fit:cover; border-radius:22px; }
.experience-related h3 { font-size:17px; margin-top:16px; line-height:1.6; }
.experience-footer { background:#174739; color:#fff9eb; padding:35px 0 95px; }
.experience-footer .container { display:flex; justify-content:space-between; align-items:center; gap:25px; }
.experience-footer p { font-size:13px; line-height:1.9; }
.experience-footer a { font-size:13px; text-decoration:underline; }
.experience-whatsapp { position:fixed; bottom:22px; right:24px; background:#25d366; color:#063a1d; border-radius:50px; padding:12px 19px; display:flex; align-items:center; gap:10px; box-shadow:0 7px 24px #17473925; font-size:12px; font-weight:700; z-index:20; }
.experience-whatsapp svg { width:27px; height:27px; color:white; }
@media(max-width:1000px) { .experience-body { gap:35px; grid-template-columns:minmax(0,1fr) 310px; } .experience-hero { gap:30px; } .experience-hero figure img { height:450px; } }
@media(max-width:800px) { .experience-header img { width:150px; } .experience-header nav>a:first-child { display:none; } .experience-header .button { padding:12px 14px; font-size:11px; } .experience-hero { grid-template-columns:1fr; gap:40px; } .experience-hero h1 { letter-spacing:-1.8px; } .experience-hero figure { width:92%; margin:auto; } .experience-hero figure img { height:430px; } .experience-body { grid-template-columns:1fr; } .experience-booking { position:static; } .experience-related { padding-top:30px; } .experience-related>div { grid-template-columns:1fr; gap:30px; } .experience-related img { height:260px; } .experience-footer .container { flex-direction:column; align-items:flex-start; } }
@media(max-width:400px) { .experience-header { gap:10px; } .experience-header img { width:127px; } .experience-header .button { max-width:147px; line-height:1.5; text-align:center; } .experience-hero figure img { height:330px; } .experience-whatsapp { bottom:16px; right:16px; } }