/* Ocean & Sunshine theme (Vivek, 29 Oct 2026) – site-wide colours, fonts, header, buttons, footer and phone bar.
   Loaded after the bundled theme CSS and the readability fixes, so the old teal/purple brand gives way to navy, blue and yellow.
   ink #0B1F3A · navy #0A3D7A · blue #1565C0 · accent #0B7C87 · CTA yellow #FFB703 · deal red #D62839 · tint #EEF5FF · footer #0B2A55 */

html:root{
  --vh-ink:#0B1F3A;--vh-navy:#0A3D7A;--vh-blue:#1565C0;--vh-accent:#0B7C87;--vh-cta:#FFB703;--vh-cta-hover:#F5A800;
  --vh-deal:#D62839;--vh-tint:#EEF5FF;--vh-line:#E3EAF3;--vh-muted:#52627A;--vh-foot:#0B2A55;
  --vh-head:"Plus Jakarta Sans",Inter,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --vh-body:Inter,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --primary:#0A3D7A;--primary-color:#0A3D7A;--primary-hover:#0B2A55;--primary-trs:rgba(10,61,122,.6);--primary-color-light:#5C8FD6;
  --secondary:#1565C0;--secondary-color:#1565C0;--secondary-hover:#0A3D7A;--secondary-trs:rgba(21,101,192,.6);
  --dark-color:#0B1F3A;--muted-color:#52627A;--gray-color:#52627A;--tst-bg:#EEF5FF;
  --grd-primary:linear-gradient(90deg,#0A3D7A 0%,#1565C0 100%);
  --grd-primary-alt:linear-gradient(90deg,#1565C0 0%,#0A3D7A 100%);
  --grd-primary-tb:linear-gradient(#0A3D7A,#0B2A55);
  --grd-primary-trs:linear-gradient(90deg,rgba(10,61,122,.6) 0%,rgba(21,101,192,.6) 100%);
  --vh-teal-text:#0B7C87;--vh-link:#1565C0
}

/* ---------- type ---------- */
html body{font-family:var(--vh-body);color:var(--vh-ink)}
body h1,body h2,body h3,body h4,body h5,body .h1,body .h2,body .h3,body .h4,body .h5,
body .main-title .title,body .pro-name,body .sub-title{font-family:var(--vh-head);letter-spacing:-.01em}
body .main-title{text-transform:none}
body .main-title .title{color:var(--vh-navy);font-weight:800}
body .main-title .title a{color:inherit}
body .main-title .line,body .line.bg-grd-primary,body .popup-line{background:var(--vh-cta)!important;height:4px;width:56px;border-radius:4px}
body .main-title.text-white .title{color:#fff}
a{color:var(--vh-link)} a:hover{color:var(--vh-navy)}
body .price,body .sm-price{color:var(--vh-navy)}
body .del-price{color:var(--vh-muted)}

/* ---------- buttons ---------- */
body .btn{border-radius:12px;font-weight:700}
body .btn-primary,body .btn-grd-primary{background:var(--vh-navy);border-color:var(--vh-navy);color:#fff}
body .btn-primary:hover,body .btn-primary:focus,body .btn-grd-primary:hover,body .btn-grd-primary:focus{background:#0B2A55;border-color:#0B2A55;color:#fff}
body .btn-outline-primary{color:var(--vh-navy);border:1.5px solid var(--vh-navy);background:#fff}
body .btn-outline-primary:hover,body .btn-outline-primary:focus{background:var(--vh-navy);border-color:var(--vh-navy);color:#fff}
body .btn-outline-primary:not(:disabled):not(.disabled).active,body .btn-outline-primary:not(:disabled):not(.disabled):active,
body .custom-btn-group>.btn:not(:disabled):not(.disabled).active{background:var(--vh-navy);border-color:var(--vh-navy);color:#fff}
body .step-app .btn-outline-primary:focus{box-shadow:0 0 0 .2rem rgba(21,101,192,.35)}
body .image-checkbox .ion,body .image-checkbox-checked .ion{color:var(--vh-navy)!important}
body .vh-quote-btn{background:var(--vh-cta);color:var(--vh-ink)!important;font-weight:800;box-shadow:0 4px 14px rgba(255,183,3,.35)}
body .vh-quote-btn:hover,body .vh-quote-btn:focus{background:var(--vh-cta-hover);color:var(--vh-ink)!important}
body .form-control:focus{border-color:var(--vh-blue);box-shadow:0 0 0 .2rem rgba(21,101,192,.18)}

/* ---------- header: always white, colour logo, dark menu ---------- */
body .main-menu.vh-header,body .sticky .main-menu.vh-header,body .main-menu.vh-header.sticky{background:#fff;box-shadow:0 1px 0 var(--vh-line),0 6px 18px rgba(11,31,58,.06)}
body .vh-header .logo-white,body .sticky .vh-header .logo-white{display:none!important}
body .vh-header .logo-color{display:inline-block!important}
body .vh-header .menuTogglebar{color:var(--vh-navy);width:44px;height:44px;border:1px solid #D3DEEB;border-radius:12px;display:flex;align-items:center;justify-content:center}
body .vh-header .menuTogglebar i{font-size:24px;line-height:1}
body .vh-header .vh-phone{color:var(--vh-navy);font-weight:700;font-size:15px;white-space:nowrap;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
body .vh-header .vh-phone:hover{color:var(--vh-blue)}
body .vh-header .vh-links a:hover,body .vh-header .vh-links a:focus{color:var(--vh-blue)}
body .vh-header .vh-all{color:var(--vh-blue)}
@media (min-width:1200px){body .vh-header>.container{max-width:1240px}}
@media (max-width:1359px){body .vh-header .vh-phone{display:none!important}}
@media (min-width:992px) and (max-width:1199px){
  body .vh-header .vh-menu{gap:14px}
  body .vh-header .vh-top{font-size:13.5px!important}
  body .vh-header .logo-img{height:44px}
  body .vh-header .logo-icon-wrapper{gap:14px}
  body .vh-header .vh-right .vh-quote-btn{padding:9px 14px;font-size:13px}
}
@media (min-width:1200px){body .vh-header .vh-menu{gap:24px}}
@media (min-width:992px){
  body .vh-header .vh-top{color:var(--vh-ink);font-weight:600;font-size:15px}
  body .vh-header .vh-right .vh-quote-btn{padding:11px 20px}
  body .vh-header .vh-item:hover>.vh-top,body .vh-header .vh-item.open>.vh-top{color:var(--vh-blue)}
  body .vh-header .vh-drop{border-radius:16px;box-shadow:0 18px 44px rgba(11,31,58,.16)}
  body .vh-header .vh-right{display:flex;align-items:center;gap:18px}
}
@media (max-width:991px){
  body .vh-header .vh-item.open>.vh-top{color:var(--vh-blue)}
}

/* ---------- inner page banners ---------- */
body .inner-header.bg-grd-primary{background:linear-gradient(120deg,#0B2A55 0%,#0A3D7A 55%,#1565C0 100%)!important}

/* ---------- phone contact bar ---------- */
@media (max-width:991px){
  body .vh-mobile-bar{box-shadow:0 -4px 16px rgba(10,61,122,.16)}
  body .vh-mobile-bar a{font-weight:700}
  body .vh-mobile-bar .vh-mb-call{color:var(--vh-navy)}
  body .vh-mobile-bar .vh-mb-wa{background:#15803D;color:#fff}
  body .vh-mobile-bar .vh-mb-quote{background:var(--vh-cta);color:var(--vh-ink);font-weight:800}
}
body .custom_whatsapp_frame{background-color:#15803D}

/* ---------- footer ---------- */
body .vf{background:var(--vh-foot);color:#BFD3EE;font-size:14px;line-height:1.6}
body .vf a{color:#BFD3EE;text-decoration:none}
body .vf a:hover,body .vf a:focus{color:#fff;text-decoration:underline}
body .vf .vf-in{max-width:1240px;margin:0 auto;padding:56px 24px 28px}
body .vf .vf-top{display:grid;grid-template-columns:1.6fr 1fr 1fr;gap:32px}
body .vf .vf-band-links .vf-group+.vf-group{margin-top:28px}
body .vf .vf-h{color:#fff;font-family:var(--vh-head);font-weight:700;font-size:16px;margin:0 0 12px;letter-spacing:0}
body .vf ul{list-style:none;margin:0;padding:0}
body .vf li{margin:0 0 8px}
body .vf .vf-toggle{display:none}
body .vf .vf-logo{width:150px;height:auto;display:block;margin-bottom:16px}
body .vf .vf-addr{margin:0 0 12px}
body .vf .vf-call{display:inline-block;color:var(--vh-cta);font-weight:800;font-size:18px;margin-bottom:4px}
body .vf .vf-call:hover{color:#FFD166}
body .vf .vf-contact-line{margin:0 0 6px}
body .vf .vf-contact-line b{color:#fff;font-weight:600}
body .vf .vf-social{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
body .vf .vf-social a{width:38px;height:38px;border-radius:50%;border:1px solid #23477A;display:flex;align-items:center;justify-content:center;color:#fff;font-size:16px}
body .vf .vf-social a:hover{background:#23477A;text-decoration:none}
body .vf .vf-chips{display:flex;flex-wrap:wrap;gap:8px}
body .vf .vf-chips li{margin:0}
body .vf .vf-chips a{display:inline-block;border:1px solid #23477A;border-radius:999px;padding:5px 12px}
body .vf .vf-chips a:hover{background:#23477A;text-decoration:none}
body .vf .vf-band{border-top:1px solid #23477A;margin-top:32px;padding-top:24px}
body .vf .vf-cols{columns:4;column-gap:24px}
body .vf .vf-cols li{break-inside:avoid}
body .vf .vf-hubs{margin:10px 0 0;line-height:1.9}
body .vf .vf-hubs span{margin:0 6px;opacity:.6}
body .vf .vf-members{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:12px}
body .vf .vf-members span{background:#fff;border-radius:12px;height:76px;display:flex;align-items:center;justify-content:center;padding:8px}
body .vf .vf-members img{max-width:100%;max-height:60px;object-fit:contain;display:block}
body .vf .vf-pay{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:18px}
body .vf .vf-pay .vf-h{margin:0 6px 0 0}
body .vf .vf-pay span{background:#fff;border-radius:8px;height:40px;min-width:64px;padding:4px 8px;display:flex;align-items:center;justify-content:center}
body .vf .vf-pay img{max-width:52px;max-height:28px;display:block}
body .vf .vf-pay .vf-secure img{max-width:none;max-height:32px}
body .vf .vf-bottom{border-top:1px solid #23477A;margin-top:28px;padding-top:18px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px 20px;font-size:13px;color:#9DB6D8}
body .vf .vf-bottom p{margin:0}
body .vf .vf-bottom ul{display:flex;gap:18px}
body .vf .vf-bottom li{margin:0}
@media (max-width:1199px){body .vf .vf-cols{columns:3}}
@media (max-width:991px){body .vf .vf-top{grid-template-columns:1fr 1fr}body .vf .vf-contact{grid-column:1/-1}}
@media (max-width:767px){
  body .vf .vf-in{padding:28px 16px 24px}
  body .vf .vf-top{grid-template-columns:1fr;gap:0}
  body .vf .vf-contact{order:-1;margin-bottom:10px}
  body .vf .vf-call{display:block;text-align:center;background:var(--vh-cta);color:var(--vh-ink);border-radius:12px;padding:11px 0;font-size:16px;margin:4px 0 8px}
  body .vf .vf-call:hover{color:var(--vh-ink);text-decoration:none}
  body .vf .vf-group{border-top:1px solid #23477A;margin:0!important}
  body .vf .vf-band-links .vf-group{border-bottom:1px solid #23477A}
  body .vf .vf-band.vf-band-links{margin-top:0;padding-top:0}
  body .vf .vf-band-links .vf-group+.vf-group{margin-top:0!important;border-top:0}
  body .vf .vf-contact{grid-column:auto}
  body .vf .vf-group>.vf-h{display:none}
  body .vf .vf-toggle{display:flex;width:100%;justify-content:space-between;align-items:center;background:none;border:0;color:#fff;font:700 15px var(--vh-body);padding:14px 0;text-align:left;cursor:pointer}
  body .vf .vf-toggle span{color:var(--vh-cta);font-size:22px;line-height:1;transition:transform .2s}
  body .vf .vf-group>ul,body .vf .vf-group>.vf-fold{display:none;padding-bottom:14px}
  body .vf .vf-group.is-open>ul,body .vf .vf-group.is-open>.vf-fold{display:block}
  body .vf .vf-group.is-open .vf-toggle span{transform:rotate(45deg)}
  body .vf .vf-group>ul.vf-chips{flex-wrap:wrap;gap:8px}
  body .vf .vf-group.is-open>ul.vf-chips{display:flex}
  body .vf .vf-cols{columns:1}
  body .vf .vf-band{margin-top:22px;padding-top:18px;border-top:0}
  body .vf .vf-members{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
  body .vf .vf-members span{height:56px;padding:5px;border-radius:10px}
  body .vf .vf-members img{max-height:44px}
  body .vf .vf-pay span{height:36px;min-width:54px}
  body .vf .vf-bottom{flex-direction:column}
}
/* inner banners sit under the (now always white) fixed header */
body .inner-header{padding-top:104px;padding-bottom:28px}
@media (max-width:991px){body .inner-header{padding-top:92px;padding-bottom:22px}}
/* dark photo popups (enquiry / book now): light-on-dark buttons, yellow highlights */
body #inquiryPopup .btn-outline-primary,body #inquire_now .btn-outline-primary,body #book_now_pay_later .btn-outline-primary{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.85)}
body #inquiryPopup .btn-outline-primary *,body #inquire_now .btn-outline-primary *,body #book_now_pay_later .btn-outline-primary *{color:inherit}
body #inquiryPopup .btn-outline-primary:hover,body #inquiryPopup .btn-outline-primary:focus,body #inquire_now .btn-outline-primary:hover,body #inquire_now .btn-outline-primary:focus,body #book_now_pay_later .btn-outline-primary:hover,body #book_now_pay_later .btn-outline-primary:focus,
body #inquiryPopup .btn-outline-primary.active,body #inquire_now .btn-outline-primary.active,body #book_now_pay_later .btn-outline-primary.active,
body #inquiryPopup .custom-btn-group>.btn:not(:disabled):not(.disabled).active,body #inquire_now .custom-btn-group>.btn:not(:disabled):not(.disabled).active{background:var(--vh-cta);border-color:var(--vh-cta);color:var(--vh-ink)}
body #inquiryPopup .btn-outline-primary:hover *,body #inquiryPopup .btn-outline-primary.active *,body #inquire_now .btn-outline-primary:hover *,body #inquire_now .btn-outline-primary.active *,body #book_now_pay_later .btn-outline-primary:hover *{color:var(--vh-ink)}
body #inquiryPopup .step-btn.finish-btn,body #inquire_now .step-btn.finish-btn,body #book_now_pay_later .step-btn.finish-btn{background:var(--vh-cta);border-color:var(--vh-cta);color:var(--vh-ink)}
body #inquiryPopup .sub-title,body #inquire_now .sub-title,body #book_now_pay_later .sub-title{color:var(--vh-cta)!important}
body .image-checkbox-checked{border-color:var(--vh-cta)}
body #inquiryPopup .image-checkbox-checked .ion,body #inquire_now .image-checkbox-checked .ion{color:var(--vh-cta)!important}
body #inquiryPopup .form-control,body #inquire_now .form-control,body #book_now_pay_later .form-control{color:#fff;border-color:rgba(255,255,255,.6)}
body #inquiryPopup .form-control::placeholder,body #inquire_now .form-control::placeholder,body #book_now_pay_later .form-control::placeholder{color:rgba(255,255,255,.75)}
/* popups: keep the hover colours whatever other theme rules say */
body #inquiryPopup .btn-outline-primary:hover,body #inquiryPopup .btn-outline-primary:focus,body #inquiryPopup .btn-outline-primary:active,
body #inquire_now .btn-outline-primary:hover,body #inquire_now .btn-outline-primary:focus,body #inquire_now .btn-outline-primary:active,
body #book_now_pay_later .btn-outline-primary:hover,body #book_now_pay_later .btn-outline-primary:focus,body #book_now_pay_later .btn-outline-primary:active{background:var(--vh-cta)!important;border-color:var(--vh-cta)!important;color:var(--vh-ink)!important}
body #inquiryPopup .btn-outline-primary:hover *,body #inquire_now .btn-outline-primary:hover *,body #book_now_pay_later .btn-outline-primary:hover *{color:var(--vh-ink)!important}
/* date picker (opens on top of the popups) */
body .gj-picker{font-family:var(--vh-body);border-radius:14px;overflow:hidden;box-shadow:0 18px 44px rgba(11,31,58,.25)}
body .gj-picker [role=header]{background:var(--vh-navy)!important;color:#fff!important}
body .gj-picker [role=header] *{color:#fff!important}
body .gj-picker div[role=navigator] div{color:var(--vh-ink)}
body .gj-picker div[role=navigator] div:hover{color:var(--vh-blue)}
body .gj-picker table tr td div{color:var(--vh-ink)}
body .gj-picker table tr td.gj-cursor-pointer div:hover{background:var(--vh-tint)!important;color:var(--vh-navy)!important;border-radius:50%}
body .gj-picker table tr td.today div{color:var(--vh-blue)!important;font-weight:700}
body .gj-picker table tr td.selected.gj-cursor-pointer div{background:var(--vh-cta)!important;color:var(--vh-ink)!important;border-radius:50%}
body .gj-picker table tr td.disabled div,body .gj-picker table tr td.other-month div{color:#A9B6C8}
body .gj-picker .gj-button-md{color:var(--vh-navy)}