*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Poppins',sans-serif;color:#062743;background:#fff;overflow-x:hidden;padding-top:120px}
button,input,select,textarea{font-family:inherit}
::selection{background:#FDBB3B4d;color:#062743}
img{max-width:100%;display:block}
a{text-decoration:none}
:root{--gold:#FDBB3B;--navy:#062743}

/* ── ANIMATIONS ── */
@keyframes fadeInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes popUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes scaleIn{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes scroll{0%{transform:translateX(0)}100%{transform:translateX(calc(-382px * 20))}}
.anim-right{opacity:0;transform:translateX(30px)}.anim-right.is-visible{animation:fadeInRight .8s ease-out forwards}
.anim-popup{opacity:0;transform:translateY(20px)}.anim-popup.is-visible{animation:popUp .8s cubic-bezier(.16,1,.3,1) forwards}
.anim-scale{transform:scaleX(0);transform-origin:left}.anim-scale.is-visible{animation:scaleIn .6s ease-out forwards}

/* ── LAYOUT UTILS ── */
.container{max-width:1280px;margin:0 auto;padding:0 24px}
.container-md{max-width:1152px;margin:0 auto;padding:0 24px}
.flex{display:flex}.grid{display:grid}
.items-center{align-items:center}.justify-center{justify-content:center}
.text-center{text-align:center}.text-left{text-align:left}
.relative{position:relative}.absolute{position:absolute}
.overflow-hidden{overflow:hidden}.z0{z-index:0}.z10{z-index:10}

/* ── GOLD BAR ── */
.gold-bar{width:48px;height:4px;background:var(--gold);display:block}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 28px;border-radius:2px;font-weight:700;font-size:14px;cursor:pointer;border:none;transition:all .3s}
.btn-primary{background:var(--gold);color:var(--navy)}.btn-primary:hover{background:var(--navy);color:#fff}
.btn-outline{background:transparent;border:2px solid var(--gold);color:var(--navy)}.btn-outline:hover{background:#FDBB3B0d}
.btn-navy{background:var(--navy);color:#fff}.btn-navy:hover{background:var(--gold);color:var(--navy)}
.btn-lg{padding:20px 48px;font-size:10px}

/* ── HAND-DRAWN CIRCLE (SVG overlay) ── */
.hd-wrap{position:relative;display:inline-block}
.hd-wrap svg{position:absolute;left:-10%;top:-5%;width:120%;height:115%;pointer-events:none;z-index:0}
.hd-wrap span{position:relative;z-index:1}

/* ── HIGHLIGHT (gold underline block) ── */
.hl{position:relative;display:inline-block}
.hl span{position:relative;z-index:1;padding:0 4px}
.hl::after{content:'';position:absolute;bottom:4px;left:0;width:100%;height:40%;background:var(--gold);z-index:0;opacity:.8}

/* ── TOPBAR ── */
#vw-topbar{position:fixed;top:0;left:0;right:0;z-index:10000;background:var(--navy);height:40px;display:flex;align-items:center}
#vw-topbar .topbar-inner{max-width:1280px;margin:0 auto;padding:0 24px;display:flex;justify-content:flex-end;align-items:center;gap:24px;width:100%}
#vw-topbar .topbar-phone{display:flex;align-items:center;gap:8px;color:#fff;font-size:12px;font-weight:600;text-decoration:none;transition:color .2s}
#vw-topbar .topbar-phone:hover{color:var(--gold)}
#vw-topbar .topbar-phone svg{width:14px;height:14px;color:var(--gold);flex-shrink:0}
#vw-topbar .topbar-sep{width:1px;height:16px;background:rgba(255,255,255,.25)}
#vw-topbar .topbar-login{display:flex;align-items:center;gap:8px;color:#fff;font-size:12px;font-weight:600;text-decoration:none;cursor:pointer;background:none;border:none;transition:color .2s;padding:0}
#vw-topbar .topbar-login:hover{color:var(--gold)}
#vw-topbar .topbar-login svg{width:14px;height:14px;color:var(--gold);flex-shrink:0}

/* ── NAV ── */
#vw-nav{position:fixed;top:40px;left:0;right:0;z-index:9999;background:transparent;backdrop-filter:none;border-bottom:1px solid transparent;box-shadow:none;transition:background .35s,border-color .35s,box-shadow .35s,backdrop-filter .35s}
#vw-nav.nav-scrolled{background:rgba(255,255,255,.97);border-bottom-color:#f1f5f9;box-shadow:0 1px 8px rgba(0,0,0,.06);backdrop-filter:blur(12px)}
#vw-nav .vw-nav-inner{max-width:1280px;margin:0 auto;padding:16px 24px;display:flex;justify-content:space-between;align-items:center}
.vw-logo-btn{background:none;border:none;cursor:pointer;padding:0;transition:transform .3s}
.vw-logo-btn:hover{transform:scale(1.05)}
.vw-logo-btn img{height:48px;width:auto}
#vw-desktopnav{display:none;align-items:center;gap:40px}
@media(min-width:1024px){#vw-desktopnav{display:flex}}
.vw-navlink{background:none;border:none;cursor:pointer;color:var(--navy);font-size:13px;font-weight:600;transition:color .3s;padding:4px 0;position:relative}
.vw-navlink:hover,.vw-navlink.active{color:var(--gold)}
.vw-navlink.active::after{content:'';position:absolute;bottom:-4px;left:0;width:100%;height:2px;background:var(--gold)}
.vw-nav-actions{display:flex;gap:16px;padding-left:24px;border-left:1px solid #e2e8f0}
.vw-btn-meet{background:var(--gold);color:var(--navy);padding:10px 24px;border-radius:2px;font-weight:700;font-size:13px;text-decoration:none;transition:all .3s;display:inline-block}
.vw-btn-meet:hover{background:var(--navy);color:#fff}
.vw-btn-portal{background:var(--navy);color:#fff;border:none;cursor:pointer;padding:10px 24px;border-radius:2px;font-weight:700;font-size:13px;transition:all .3s}
.vw-btn-portal:hover{background:var(--gold);color:var(--navy)}
.vw-hamburger{display:flex;background:none;border:none;cursor:pointer;color:var(--navy);padding:8px}
@media(min-width:1024px){.vw-hamburger{display:none}}
#vw-mobile-menu{display:none;background:#fff;border-top:1px solid #f1f5f9;padding:40px 24px;flex-direction:column;gap:32px;box-shadow:0 20px 40px rgba(0,0,0,.1)}
#vw-mobile-menu.open{display:flex}
#vw-mobile-menu .vw-navlink{text-align:left;font-size:13px}
.mob-actions{display:flex;flex-direction:column;gap:16px;padding-top:24px;border-top:1px solid #f1f5f9}
.mob-actions a,.mob-actions button{display:block;padding:16px;border-radius:2px;font-weight:700;font-size:14px;text-align:center;transition:all .3s;width:100%}
.mob-actions a{background:var(--gold);color:var(--navy);text-decoration:none}
.mob-actions button{background:var(--navy);color:#fff;border:none;cursor:pointer}

/* ══════════ CTA SECTION ══════════ */
#cta-section{padding:160px 48px;position:relative;overflow:hidden}
#cta-section .cta-wrap{max-width:1280px;margin:0 auto}
#cta-section .cta-card{position:relative;background:transparent;border:none;box-shadow:none;padding:0}
#cta-section .cta-card .cta-bg{position:fixed;display:none}
#cta-section .cta-card .cta-bg img{display:none}
#cta-section::before{content:'';position:absolute;inset:0;background:url('images/call-to-action.jpg') center/cover no-repeat;z-index:0}
#cta-section::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.55);z-index:1}
#cta-section .cta-content{position:relative;z-index:10;max-width:800px;margin:0 auto;text-align:center}
#cta-section h2{font-size:clamp(1.8rem,4vw,3rem);font-weight:700;color:#fff;letter-spacing:-.03em;margin-bottom:12px}
#cta-section .cta-divider{width:64px;height:4px;background:var(--gold);margin:0 auto 16px}
#cta-section p{font-size:1.15rem;color:rgba(255,255,255,.85);line-height:1.8;font-weight:300;margin:0 auto 20px}
#cta-section p strong{font-size:1rem;white-space:nowrap}
#cta-section p strong{color:#fff;font-weight:400;display:block;margin-top:16px}
#cta-section .cta-btn{display:inline-flex;align-items:center;gap:12px;background:var(--gold);color:var(--navy);padding:20px 48px;border-radius:6px;font-weight:800;font-size:1.2rem;box-shadow:0 8px 30px rgba(253,187,59,.4);text-decoration:none;transition:all .3s}
#cta-section .cta-btn:hover{background:var(--navy);color:#fff;transform:scale(1.05)}
#cta-section .cta-btn svg{transition:transform .3s}
#cta-section .cta-btn:hover svg{transform:rotate(12deg)}

/* ── DROPDOWN ── */
.vw-dropdown{position:relative}
.vw-dropdown::after{content:'';position:absolute;top:100%;left:-8px;right:-8px;height:16px}
.vw-dropdown-btn{display:flex!important;align-items:center;gap:5px}
.vw-dropdown-menu{display:none;position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%);background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:8px;min-width:180px;box-shadow:0 8px 24px rgba(0,0,0,.12);z-index:200;white-space:nowrap}
.vw-dropdown:hover .vw-dropdown-menu{display:block}
.vw-dropdown-menu a{display:block;padding:10px 16px;font-size:13px;font-weight:600;color:var(--navy);border-radius:4px;transition:background .2s;text-decoration:none}
.vw-dropdown-menu a:hover{background:var(--gold)}
.vw-dropdown-menu::before{content:'';position:absolute;top:-6px;left:50%;transform:translateX(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #e2e8f0}
.vw-dropdown-menu::after{content:'';position:absolute;top:-5px;left:50%;transform:translateX(-50%);border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:6px solid #fff}
.mob-quiz-links{display:flex;flex-direction:column;gap:8px;padding-left:16px;border-left:2px solid var(--gold);margin-top:8px}
.mob-quiz-links a{font-size:11px;font-weight:600;color:#475569;text-decoration:none;transition:color .2s}
.mob-quiz-links a:hover{color:var(--gold)}

/* ── FOOTER ── */
#vw-footer{background:#f8fafc;border-top:1px solid #e2e8f0;padding:80px 0 48px;color:var(--navy)}
#vw-footer .foot-inner{max-width:1280px;margin:0 auto;padding:0 24px}
#vw-footer .foot-grid{display:grid;grid-template-columns:1fr;gap:24px;padding-bottom:64px;border-bottom:1px solid #e2e8f0}
@media(min-width:768px){#vw-footer .foot-grid{grid-template-columns:1fr 1fr}}
@media(min-width:1024px){#vw-footer .foot-grid{grid-template-columns:1.4fr 0.6fr 1fr 1.3fr 0.7fr 1fr}}
#vw-footer .foot-logo{height:64px;width:auto;margin-bottom:24px}
#vw-footer .foot-contact{list-style:none;display:flex;flex-direction:column;gap:16px;margin-bottom:24px;padding:0}
#vw-footer .foot-contact li{display:flex;align-items:flex-start;gap:12px;font-size:.9rem;color:#475569}
#vw-footer .foot-contact li svg{width:20px;height:20px;color:var(--gold);flex-shrink:0;margin-top:2px}
#vw-footer .socials{display:flex;gap:12px}
#vw-footer .socials a{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid #e2e8f0;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 6px rgba(0,0,0,.06);transition:background .3s}
#vw-footer .socials a:hover{background:var(--gold)}
#vw-footer .socials a svg{width:16px;height:16px;color:var(--navy)}
#vw-footer h4{font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--gold);padding-bottom:12px;border-bottom:1px solid #f1f5f9;margin-bottom:16px}
#vw-footer ul.foot-list{list-style:none;padding:0;display:flex;flex-direction:column;gap:10px}
#vw-footer ul.foot-list li,#vw-footer ul.foot-list button{font-size:.875rem;color:#475569;font-weight:500;background:none;border:none;cursor:pointer;text-align:left;padding:0;transition:color .3s;line-height:1.6}
#vw-footer ul.foot-list li:hover,#vw-footer ul.foot-list button:hover{color:var(--gold)}
#vw-footer .btn-portal-foot{width:100%;background:var(--navy);color:#fff;border:none;cursor:pointer;padding:12px 24px;border-radius:2px;font-weight:700;font-size:13px;transition:all .3s}
#vw-footer .btn-portal-foot:hover{background:var(--gold);color:var(--navy)}
#vw-footer .foot-bottom{padding-top:48px;display:flex;flex-direction:column;gap:32px}
#vw-footer .foot-legal-row{display:flex;flex-direction:column;gap:16px;font-size:10px;font-weight:700;letter-spacing:.1em;color:#6b7280}
@media(min-width:768px){#vw-footer .foot-legal-row{flex-direction:row;align-items:center;justify-content:space-between}}
#vw-footer .foot-legal-row a{color:#6b7280;text-decoration:underline;text-decoration-color:#e2e8f0;text-underline-offset:4px;transition:color .3s}
#vw-footer .foot-legal-row a:hover{color:var(--gold)}
#vw-footer .foot-policy-links{display:flex;gap:32px;flex-wrap:wrap}
#vw-footer .compliance-box{background:#fff;padding:24px 32px;border-radius:12px;border:1px solid #e2e8f0;box-shadow:0 2px 8px rgba(0,0,0,.04);display:flex;flex-direction:column;gap:16px}
#vw-footer .comp-abn{font-size:10px;font-weight:700;letter-spacing:.1em;color:#6b7280}
#vw-footer .comp-ack{font-size:10px;color:#6b7280;font-style:normal;border-top:1px solid #f1f5f9;padding-top:16px;line-height:1.6}

#back-to-top{position:fixed;bottom:32px;right:32px;z-index:9998;width:48px;height:48px;border-radius:50%;background:var(--navy);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.2);opacity:0;transform:translateY(16px);transition:opacity .3s,transform .3s}
#back-to-top.visible{opacity:1;transform:translateY(0)}
#back-to-top:hover{background:var(--gold);color:var(--navy)}

/* ══════════════════════════════════════
   MOBILE OPTIMISATION  360px – 430px
   (6.1"–6.9" phone screens)
══════════════════════════════════════ */
/* Nav — white background when mobile menu is open */
#vw-nav:has(#vw-mobile-menu.open){background:rgba(255,255,255,.97)!important;border-bottom-color:#f1f5f9!important;box-shadow:0 1px 8px rgba(0,0,0,.06)!important;backdrop-filter:blur(12px)!important}
#vw-nav:has(#vw-mobile-menu.open) .vw-hamburger{color:var(--navy)!important}

@media(max-width:430px){
  /* Topbar — icons only, tighter height */
  #vw-topbar{height:36px}
  #vw-topbar .topbar-inner{gap:16px;padding:0 16px}
  #vw-topbar .topbar-phone span,
  #vw-topbar .topbar-login span{display:none}
  #vw-topbar .topbar-phone,
  #vw-topbar .topbar-login{gap:0}
  #vw-topbar .topbar-phone svg,
  #vw-topbar .topbar-login svg{width:16px;height:16px}

  /* Nav — reduced height, tighter logo */
  body{padding-top:108px}
  #vw-nav{top:36px}
  #vw-nav .vw-nav-inner{padding:12px 16px}
  .vw-logo-btn img{height:40px}

  /* Containers */
  .container,.container-md{padding:0 16px}

  /* Buttons */
  .btn-lg{padding:16px 32px;font-size:13px;min-height:48px}

  /* Mobile menu */
  #vw-mobile-menu{padding:32px 16px;gap:24px}

  /* CTA section */
  #cta-section{padding:80px 16px}
  #cta-section h2{font-size:clamp(1.6rem,6vw,2.4rem)}
  #cta-section p{font-size:1rem}
  #cta-section .cta-btn{padding:16px 32px;font-size:1rem}

  /* Footer */
  #vw-footer{padding:48px 0 32px}
  #vw-footer .foot-grid{gap:24px;padding-bottom:40px}
  #vw-footer .foot-logo{height:48px}
  #vw-footer .foot-contact li{font-size:.8rem}
  #vw-footer ul.foot-list li,#vw-footer ul.foot-list button{font-size:.8rem}
  #vw-footer h4{font-size:11px}
  #vw-footer .foot-bottom{padding-top:32px;gap:20px}
  #vw-footer .compliance-box{padding:16px 20px}

  /* Back-to-top */
  #back-to-top{bottom:20px;right:16px;width:40px;height:40px}
}

/* ══════════════════════════════════════
   DESKTOP OPTIMISATION  1280px – 1728px
   (13"–16" laptop screens)
══════════════════════════════════════ */
@media(min-width:1440px){
  .container{max-width:1400px}
  .container-md{max-width:1280px}
  #vw-topbar .topbar-inner{max-width:1400px}
  #vw-nav .vw-nav-inner{max-width:1400px}
  #vw-footer .foot-inner{max-width:1400px}
  #vw-footer .foot-grid{gap:48px}
  #cta-section .cta-wrap{max-width:1400px}
  #cta-section h2{font-size:clamp(2.4rem,3.5vw,3.5rem)}

  /* Nav links */
  #vw-desktopnav{gap:32px}
  .vw-navlink{font-size:14px}
  .vw-btn-meet,.vw-btn-portal{padding:11px 28px;font-size:14px}
}
@media(min-width:1728px){
  .container{max-width:1600px}
  .container-md{max-width:1400px}
  #vw-topbar .topbar-inner{max-width:1600px}
  #vw-nav .vw-nav-inner{max-width:1600px}
  #vw-footer .foot-inner{max-width:1600px}
  #cta-section .cta-wrap{max-width:1600px}
  #vw-desktopnav{gap:40px}
}
