.btn-signin,.btn-trial{background:none;border:none;padding:0;color:rgba(255,255,255,0.85);font-size:14px;font-weight:500;cursor:pointer;font-family:'DM Sans',sans-serif;text-decoration:none;}link href="https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Barlow+Condensed:wght@700;800;900&display=swap" rel="stylesheet">
<style>
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{background:#0d1628;color:#fff;font-family:'DM Sans',sans-serif;min-height:100vh;overflow-x:hidden;}

.atmo{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;}
.atmo-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.025) 1px,transparent 1px);background-size:60px 60px;}
.atmo-orb{position:absolute;border-radius:50%;filter:blur(120px);}
.atmo-orb.o1{width:500px;height:500px;background:#1e3a5f;opacity:0.18;top:-200px;left:50%;transform:translateX(-50%);animation:orb1 14s ease-in-out infinite;}
.atmo-orb.o2{width:400px;height:400px;background:#2c5a82;opacity:0.13;top:40%;left:-100px;animation:orb2 16s ease-in-out infinite;}
.atmo-orb.o3{width:350px;height:350px;background:#2c5a82;opacity:0.11;bottom:-80px;right:-80px;animation:orb3 12s ease-in-out infinite;}
@keyframes orb1{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-40px)}}
@keyframes orb2{0%,100%{transform:translateY(0)}50%{transform:translateY(-30px)}}
@keyframes orb3{0%,100%{transform:translateY(0)}50%{transform:translateY(30px)}}

/* TOPBAR */
.topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;padding:0 24px;height:68px;background:linear-gradient(90deg,#b87028 0%,#b06828 18%,#b06832 25%,#b06832 32%,#7a5848 44%,#4a5568 54%,#4a5872 68%,#3d506a 85%,#364a63 100%);box-shadow:0 4px 24px rgba(0,0,0,0.45);border-bottom:1px solid rgba(255,255,255,0.03);}
.topbar-logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:#fff;flex-shrink:0;margin-right:20px;}
.topbar-logo-icon{width:30px;height:30px;background:rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.3);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;}
.topbar-logo-text{font-family:'Barlow Condensed',sans-serif;font-size:19px;font-weight:800;color:#fff;line-height:1;}
.topbar-logo-sub{font-size:8px;color:rgba(255,255,255,0.6);letter-spacing:1.5px;text-transform:uppercase;display:block;margin-top:1px;}
.topbar-nav{margin-left:32px;display:flex;align-items:center;gap:28px;margin-right:auto;margin-left:8px;}
.topbar-nav a{font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;color:rgba(255,255,255,0.75);text-decoration:none;letter-spacing:0.3px;transition:color 0.2s;}
.topbar-nav a:hover{color:#fff;}
.bundle-rotator{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.18);border-radius:20px;padding:5px 12px 5px 10px;min-width:320px;flex-shrink:0;margin:0 16px;}
.bundle-rotator-icon{font-size:13px;flex-shrink:0;}
.bundle-rotator-track{position:relative;height:19px;overflow:hidden;flex:1;}
.bundle-rotator-item{position:absolute;top:0;left:0;width:100%;font-size:12px;font-weight:600;color:rgba(255,255,255,0.9);white-space:nowrap;opacity:0;transform:translateY(100%);transition:opacity 0.5s,transform 0.5s;}
.bundle-rotator-item.active{opacity:1;transform:translateY(0);}
.bundle-rotator-item.exit{opacity:0;transform:translateY(-100%);}
.bundle-rotator-cta{font-size:11px;font-weight:700;color:#fff;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.3);border-radius:10px;padding:3px 9px;cursor:pointer;flex-shrink:0;}
.topbar-actions{display:flex;align-items:center;gap:28px;flex-shrink:0;}
.btn-signin,.btn-trial{background:none;border:none;padding:0;color:rgba(255,255,255,0.85);font-size:14px;font-weight:500;cursor:pointer;font-family:'DM Sans',sans-serif;text-decoration:none;}

/* ── HERO ── */.atmo-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.025) 1px,transparent 1px);background-size:60px 60px;}
.atmo-orb{position:absolute;border-radius:50%;filter:blur(120px);}
.atmo-orb.o1{width:500px;height:500px;background:#1e3a5f;opacity:0.18;top:-200px;left:50%;transform:translateX(-50%);animation:orb1 14s ease-in-out infinite;}
.atmo-orb.o2{width:400px;height:400px;background:#2c5a82;opacity:0.13;top:40%;left:-100px;animation:orb2 16s ease-in-out infinite;}
.atmo-orb.o3{width:350px;height:350px;background:#2c5a82;opacity:0.11;bottom:-80px;right:-80px;animation:orb3 12s ease-in-out infinite;}
@keyframes orb1{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-40px)}}
@keyframes orb2{0%,100%{transform:translateY(0)}50%{transform:translateY(-30px)}}
@keyframes orb3{0%,100%{transform:translateY(0)}50%{transform:translateY(30px)}}

/* TOPBAR */
.topbar{position:sticky;top:0;z-index:100;display:flex;align-items:center;padding:0 24px;height:68px;background:linear-gradient(90deg,#b87028 0%,#b06828 18%,#b06832 25%,#b06832 32%,#7a5848 44%,#4a5568 54%,#4a5872 68%,#3d506a 85%,#364a63 100%);box-shadow:0 4px 24px rgba(0,0,0,0.45);border-bottom:1px solid rgba(255,255,255,0.03);}
.topbar-logo{display:flex;align-items:center;gap:9px;text-decoration:none;color:#fff;flex-shrink:0;margin-right:20px;}
.topbar-logo-icon{width:30px;height:30px;background:rgba(255,255,255,0.2);border:1px solid rgba(255,255,255,0.3);border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:15px;}
.topbar-logo-text{font-family:'Barlow Condensed',sans-serif;font-size:19px;font-weight:800;color:#fff;line-height:1;}
.topbar-logo-sub{font-size:8px;color:rgba(255,255,255,0.6);letter-spacing:1.5px;text-transform:uppercase;display:block;margin-top:1px;}
.topbar-breadcrumb{font-size:13px;color:rgba(255,255,255,0.75);display:flex;align-items:center;gap:8px;flex-shrink:0;margin-right:auto;}
.topbar-breadcrumb a{color:rgba(255,255,255,0.7);text-decoration:none;}
.topbar-breadcrumb .sep{opacity:0.45;}
.topbar-breadcrumb .current{color:#fff;font-weight:600;}
.bundle-rotator{display:flex;align-items:center;gap:8px;background:rgba(0,0,0,0.2);border:1px solid rgba(255,255,255,0.18);border-radius:20px;padding:5px 12px 5px 10px;min-width:320px;flex-shrink:0;margin:0 16px;}
.bundle-rotator-icon{font-size:13px;flex-shrink:0;}
.bundle-rotator-track{position:relative;height:19px;overflow:hidden;flex:1;}
.bundle-rotator-item{position:absolute;top:0;left:0;width:100%;font-size:12px;font-weight:600;color:rgba(255,255,255,0.9);white-space:nowrap;opacity:0;transform:translateY(100%);transition:opacity 0.5s,transform 0.5s;}
.bundle-rotator-item.active{opacity:1;transform:translateY(0);}
.bundle-rotator-item.exit{opacity:0;transform:translateY(-100%);}
.bundle-rotator-cta{font-size:11px;font-weight:700;color:#fff;background:rgba(255,255,255,0.15);border:1px solid rgba(255,255,255,0.3);border-radius:10px;padding:3px 9px;cursor:pointer;flex-shrink:0;}
.topbar-actions{display:flex;align-items:center;gap:28px;flex-shrink:0;}


/* PAGE LAYOUT */
.page-wrap{position:relative;z-index:5;display:flex;flex-direction:row;align-items:flex-start;width:100%;padding-top:80px;}
.side-panel{width:300px;flex-shrink:0;padding:24px 8px;}.page-centre{flex:1;min-width:0;padding:0 100px;}

/* HERO */
.hero{text-align:center;padding:36px 24px 20px;}
.hero h1{font-family:'Barlow Condensed',sans-serif;font-size:64px;font-weight:900;line-height:0.95;text-transform:uppercase;letter-spacing:-1px;}
.hero h1 .h-line1{display:block;background:linear-gradient(to right,#f5ece0 0%,#f0d8b8 40%,#e8b880 72%,#d4844a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hero h1 .h-line2{display:block;background:linear-gradient(135deg,#c4622a 0%,#d4844a 50%,#d4a04a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.section-label{display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:3px;margin:20px auto 18px;background:linear-gradient(135deg,#d4844a,#d4a04a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.section-label::before,.section-label::after{content:'';width:40px;height:1px;background:linear-gradient(90deg,transparent,#d4844a);flex-shrink:0;-webkit-text-fill-color:initial;}
.section-label::after{background:linear-gradient(90deg,#d4844a,transparent);}

/* INDUSTRY GRID */
@property --angle{syntax:'<angle>';inherits:true;initial-value:0deg;}
@keyframes spinBorder{to{--angle:360deg;}}
@keyframes cardIn{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.industry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding:0 12px 32px;}
.industry-card{position:relative;border-radius:16px;cursor:pointer;height:220px;border:2px solid rgba(255,255,255,0.07);transition:transform 0.35s cubic-bezier(0.16,1,0.3,1),box-shadow 0.35s,border-color 0.3s;animation:cardIn 0.5s cubic-bezier(0.16,1,0.3,1) both;}
.industry-card:nth-child(1){animation-delay:0.04s}.industry-card:nth-child(2){animation-delay:0.08s}.industry-card:nth-child(3){animation-delay:0.12s}.industry-card:nth-child(4){animation-delay:0.16s}.industry-card:nth-child(5){animation-delay:0.20s}.industry-card:nth-child(6){animation-delay:0.24s}.industry-card:nth-child(7){animation-delay:0.28s}.industry-card:nth-child(8){animation-delay:0.32s}.industry-card:nth-child(9){animation-delay:0.36s}.industry-card:nth-child(10){animation-delay:0.40s}.industry-card:nth-child(11){animation-delay:0.44s}
.industry-card::before{content:'';position:absolute;inset:-3px;border-radius:19px;background:conic-gradient(from var(--angle),transparent 0deg,transparent 55deg,#d4844a 110deg,#c4622a 175deg,#d4a04a 230deg,transparent 290deg,transparent 360deg);opacity:0;z-index:0;transition:opacity 0.35s;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask-composite:exclude;padding:3px;}
.industry-card:hover::before{opacity:1;animation:spinBorder 2.2s linear infinite;}
.industry-card:hover{border-color:transparent;}
.card-inner{position:absolute;inset:2px;border-radius:13px;overflow:hidden;z-index:1;}
.card-photo-bg{position:absolute;inset:0;background-image:var(--card-photo);background-size:cover;background-position:center;opacity:0.50;transition:transform 0.5s cubic-bezier(0.16,1,0.3,1),opacity 0.35s;}
.card-photo-overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,18,35,0.0) 0%,rgba(10,18,35,0.05) 20%,rgba(10,18,35,0.52) 55%,rgba(10,18,35,0.86) 100%);}
.industry-card:hover .card-photo-bg{transform:scale(1.04);opacity:0.50;}
.card-content{position:absolute;bottom:0;left:0;right:0;z-index:2;padding:14px 16px;}
.card-icon{font-size:20px;display:block;margin-bottom:5px;}
.card-name{font-family:'Barlow Condensed',sans-serif;font-size:26px;font-weight:900;line-height:1;text-transform:uppercase;letter-spacing:0.5px;margin-bottom:5px;background:linear-gradient(160deg,#fff 0%,#f5d078 40%,#d4a04a 80%,#d4844a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;filter:drop-shadow(0 0 7px rgba(212,160,74,0.4)) drop-shadow(0 2px 8px rgba(0,0,0,0.8));}

.card-desc{font-size:15px;color:rgba(232,213,184,0.85);line-height:1.4;margin-bottom:10px;}
.card-cta{display:inline-flex;align-items:center;gap:6px;font-size:10px;font-weight:700;letter-spacing:1.6px;text-transform:uppercase;color:#d4844a;}
.card-cta-arrow{width:18px;height:18px;border-radius:50%;background:#c4622a;color:#fff;display:flex;align-items:center;justify-content:center;font-size:9px;}
.see-all-card{grid-column:1/-1;background:linear-gradient(135deg,rgba(196,98,42,0.1),rgba(44,90,130,0.09));border:1px dashed rgba(196,98,42,0.32);border-radius:14px;padding:16px 22px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:all 0.3s;animation:cardIn 0.5s 0.5s cubic-bezier(0.16,1,0.3,1) both;}
.see-all-left{display:flex;align-items:center;gap:12px;}
.see-all-icon{width:36px;height:36px;background:linear-gradient(135deg,#c4622a,#d4844a);border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:16px;}
.see-all-title{font-family:'Barlow Condensed',sans-serif;font-size:17px;font-weight:800;color:#fff;}
.see-all-sub{font-size:11px;color:rgba(255,255,255,0.55);margin-top:2px;}
.see-all-btn{background:linear-gradient(135deg,#c4622a,#d4844a);color:#fff;border:none;border-radius:8px;padding:8px 18px;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;cursor:pointer;}

/* =============================================
   LEFT PANEL &mdash; RIBBON STEPS (like reference)
   ============================================= */
.panel-label{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2.5px;color:#5a8fc0;padding-bottom:10px;border-bottom:1px solid rgba(44,90,130,0.25);margin-bottom:20px;}

.ribbon-steps{display:flex;flex-direction:column;gap:0;}

.ribbon-step{margin-bottom:28px;position:relative;}

/* The ribbon band &mdash; full width with fold effect on left */
.ribbon-band{
  position:relative;
  height:52px;
  display:flex;
  align-items:center;
  margin-left:0;
  margin-right:0;
}

/* Main ribbon body */
.ribbon-body{
  position:absolute;
  left:28px; right:0; top:0; bottom:0;
  display:flex;
  align-items:center;
  padding-left:48px;
  padding-right:16px;
}

/* Ribbon colours per step &mdash; blue shades with a teal accent */
.ribbon-step:nth-child(1) .ribbon-body{background:linear-gradient(90deg,#1a4a8a,#2060b0,#1e8abd);}
.ribbon-step:nth-child(2) .ribbon-body{background:linear-gradient(90deg,#1a5a78,#207898,#1a9aaa);}
.ribbon-step:nth-child(3) .ribbon-body{background:linear-gradient(90deg,#1a3a6e,#2858a8,#4a7acc);}

/* Ribbon tail &mdash; the pointed right end */
.ribbon-body::after{
  content:'';
  position:absolute;
  right:-14px; top:0;
  width:0; height:0;
  border-style:solid;
  border-width:26px 0 26px 14px;
  border-color:transparent;
}
.ribbon-step:nth-child(1) .ribbon-body::after{border-left-color:#1e8abd;}
.ribbon-step:nth-child(2) .ribbon-body::after{border-left-color:#1a9aaa;}
.ribbon-step:nth-child(3) .ribbon-body::after{border-left-color:#4a7acc;}

/* Fold shadow &mdash; the dark triangle bottom-left corner */
.ribbon-fold{
  position:absolute;
  left:0; bottom:-10px;
  width:0; height:0;
  border-style:solid;
  border-width:10px 14px 0 0;
}
.ribbon-step:nth-child(1) .ribbon-fold{border-color:#0a1e40 transparent transparent transparent;}
.ribbon-step:nth-child(2) .ribbon-fold{border-color:#0a1e40 transparent transparent transparent;}
.ribbon-step:nth-child(3) .ribbon-fold{border-color:#0a1e40 transparent transparent transparent;}

/* The fold top part &mdash; visible ribbon left edge */
.ribbon-left-edge{
  position:absolute;
  left:0; top:0;
  width:28px; height:52px;
}
.ribbon-step:nth-child(1) .ribbon-left-edge{background:#1a4a8a;}
.ribbon-step:nth-child(2) .ribbon-left-edge{background:#1a5a78;}
.ribbon-step:nth-child(3) .ribbon-left-edge{background:#1a3a6e;}

/* Step number circle on ribbon */
.ribbon-num{
  position:absolute;
  left:6px; top:50%; transform:translateY(-50%);
  width:38px; height:38px; border-radius:50%;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:'Barlow Condensed',sans-serif;
  font-size:20px; font-weight:900;
  z-index:2;
  box-shadow:0 2px 8px rgba(0,0,0,0.3);
}
.ribbon-step:nth-child(1) .ribbon-num{color:#1a4a8a;}
.ribbon-step:nth-child(2) .ribbon-num{color:#1a5a78;}
.ribbon-step:nth-child(3) .ribbon-num{color:#1a3a6e;}

/* Heading on ribbon */
.ribbon-heading{
  font-family:'Barlow Condensed',sans-serif;
  font-size:17px; font-weight:800;
  color:#fff; text-transform:uppercase;
  letter-spacing:0.5px; line-height:1;
  text-shadow:0 1px 3px rgba(0,0,0,0.3);
  display:flex; align-items:center; gap:8px;
}
.ribbon-heading-icon{font-size:16px;}

/* Description below ribbon */
.ribbon-desc{
  padding:10px 16px 0 76px;
  font-size:12px;
  color:rgba(255,255,255,0.6);
  line-height:1.5;
}

/* =============================================
   RIGHT PANEL &mdash; LIGHT GRAPHIC STAT CARDS
   ============================================= */
.panel-label-right{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:2.5px;color:#5a8fc0;padding-bottom:10px;border-bottom:1px solid rgba(44,90,130,0.25);margin-bottom:16px;}

.stat-wall{display:flex;flex-direction:column;gap:12px;}

.info-panel{padding:24px 16px;display:flex;flex-direction:column;justify-content:center;height:100%;}
.info-wall{display:flex;flex-direction:column;gap:0;align-items:stretch;}
.info-item{padding:20px 0;border-top:1px solid rgba(255,255,255,0.10);}
.info-item:last-child{border-bottom:1px solid rgba(255,255,255,0.10);}
.info-item-label{font-size:10px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;color:rgba(255,255,255,0.45);margin-bottom:6px;}
.info-item-title{font-family:'Barlow Condensed',sans-serif;font-size:22px;font-weight:800;line-height:1.1;color:#fff;margin-bottom:6px;text-transform:uppercase;}
.info-item-desc{font-size:13px;color:rgba(255,255,255,0.60);line-height:1.5;}
.hiw-panel{padding:0 24px;padding-top:0;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;text-align:center;}
.hiw-header{margin-bottom:32px;text-align:center;}
.hiw-eyebrow{display:flex;align-items:center;justify-content:center;gap:12px;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:3px;margin-bottom:10px;background:linear-gradient(135deg,#d4844a,#d4a04a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hiw-eyebrow::before,.hiw-eyebrow::after{content:'';width:32px;height:1px;background:linear-gradient(135deg,#d4844a,#d4a04a);opacity:0.5;flex-shrink:0;}
.hiw-heading{font-family:'Barlow Condensed',sans-serif;font-size:30px;font-weight:900;text-transform:uppercase;line-height:0.95;letter-spacing:-0.5px;background:linear-gradient(to right,#f5ece0 0%,#f0d8b8 40%,#e8b880 72%,#d4844a 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;}
.hiw-steps{display:flex;flex-direction:column;align-items:center;gap:0;position:relative;width:100%;}
.hiw-steps::before{display:none;}
.hiw-step{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 0;position:relative;z-index:1;width:100%;}
.hiw-step-num{flex-shrink:0;width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#1e3a5f,#2c5a82);border:2px solid rgba(255,255,255,0.2);display:flex;align-items:center;justify-content:center;font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:800;color:#fff;position:relative;z-index:2;}
.hiw-step-body{text-align:center;}
.hiw-step-title{font-family:'Barlow Condensed',sans-serif;font-size:16px;font-weight:800;text-transform:uppercase;letter-spacing:0.5px;color:#e8d5b8;margin-bottom:6px;}
.hiw-step-title span{color:#c4622a;}.hiw-connector{width:2px;height:30px;background:linear-gradient(to bottom,rgba(26,84,144,0.85),rgba(26,84,144,0.35));border-radius:2px;margin:0 auto;}.wyg-panel{padding:0 24px;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;text-align:left;}.wyg-item{display:flex;align-items:flex-start;gap:12px;padding:22px 0;border-bottom:1px solid rgba(255,255,255,0.07);}.wyg-item:last-child{border-bottom:none;}.wyg-icon{width:28px;height:28px;flex-shrink:0;margin-top:2px;background:linear-gradient(135deg,#1e3a5f,#2c5a82);border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:12px;}.wyg-body{}.wyg-title{font-family:"Barlow Condensed",sans-serif;font-size:16px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;color:#e8d5b8;margin-bottom:4px;}.wyg-title-price{text-transform:none;}.wyg-desc{font-size:15px;color:rgba(255,255,255,0.62);line-height:1.5;}
.hiw-step-desc{font-size:15px;color:rgba(255,255,255,0.55);line-height:1.55;max-width:200px;margin:0 auto;}

.btn-see-all-orange{display:inline-flex;align-items:center;gap:8px;background:#c4622a;color:#fff;font-family:'Barlow Condensed',sans-serif;font-size:15px;font-weight:700;text-transform:uppercase;letter-spacing:0.5px;padding:10px 22px;border-radius:6px;text-decoration:none;transition:background 0.2s;}
.btn-see-all-orange:hover{background:#d4844a;}

    .topbar-spacer { flex: 1; }
.pricing-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 32px;
    }
    .price-card {
      background: var(--card);
      border: 2px solid var(--paper3);
      border-radius: var(--radius-lg);
      padding: 40px;
      position: relative;
      transition: all 0.3s;
    }
    .price-card:hover {
      transform: translateY(-8px);
      box-shadow: var(--shadow-lg);
      border-color: var(--primary);
    }
    .price-card.featured {
      border-color: var(--primary);
      border-width: 3px;
      box-shadow: 0 20px 60px rgba(26,84,144,0.15);
    }
    .popular-badge {
      position: absolute;
      top: -16px;
      left: 50%;
      transform: translateX(-50%);
      background: var(--primary);
      color: white;
      padding: 6px 20px;
      border-radius: 50px;
      font-size: 12px;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 1px;
    }
    .plan-name {
      font-family: 'Syne', sans-serif;
      font-size: 24px;
      font-weight: 700;
      margin-bottom: 8px;
      color: var(--ink);
    }
    .plan-desc {
      color: var(--ink3);
      font-size: 14px;
      margin-bottom: 24px;
    }
    .plan-price {
      display: flex;
      align-items: baseline;
      margin-bottom: 8px;
    }
    .price-dollar {
      font-family: 'Syne', sans-serif;
      font-size: 20px;
      font-weight: 700;
      color: var(--ink3);
    }
    .price-amount {
      font-family: 'Syne', sans-serif;
      font-size: 56px;
      font-weight: 800;
      color: var(--primary);
      line-height: 1;
    }
    .price-period {
      font-size: 16px;
      color: var(--ink3);
      margin-left: 8px;
    }
    .price-savings {
      font-size: 13px;
      color: var(--success);
      font-weight: 600;
      margin-bottom: 24px;
    }
    .plan-cta {
      width: 100%;
      margin-bottom: 32px;
    }
    .plan-features {
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .plan-features li {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      font-size: 14px;
      color: var(--ink2);
    }
    .plan-features li::before {
      content: '✓';
      color: var(--success);
      font-weight: 700;
      font-size: 18px;
      flex-shrink: 0;
    }
    .feature-highlight {
      font-weight: 600;
      color: var(--primary);
    }
    
    /* INDIVIDUAL TOOLS */
    .individual-tools-section {
      max-width: 1200px;
      margin: 80px auto;
      padding: 0 32px;
    }
    .section-header {
      text-align: center;
      margin-bottom: 48px;
    }
    .section-header h2 {
      font-family: 'Syne', sans-serif;
      font-size: 40px;
      font-weight: 700;
      margin-bottom: 12px;
    }
    .section-header p {
      color: var(--ink3);
      font-size: 18px;
    }
    .tools-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 20px;
      margin-bottom: 40px;
    }
    .tool-card {
      background: var(--card);
      border: 2px solid var(--paper3);
      border-radius: var(--radius-lg);
      padding: 24px;
      transition: all 0.3s;
      text-align: center;
    }
    .tool-card:hover {
      border-color: var(--primary);
      transform: translateY(-4px);
      box-shadow: var(--shadow);
    }
    .tool-icon {
      font-size: 36px;
      margin-bottom: 12px;
    }
    .tool-name {
      font-family: 'Syne', sans-serif;
      font-size: 14px;
      font-weight: 700;
      margin-bottom: 8px;
      color: var(--ink);
    }
    .tool-price {
      font-family: 'Syne', sans-serif;
      font-size: 20px;
      font-weight: 700;
      color: var(--primary);
    }
    
    /* FAQ */
    .faq-section {
      background: var(--card);
      padding: 80px 32px;
    }
    .faq-container {
      max-width: 800px;
      margin: 0 auto;
    }
    .faq-item {
      border-bottom: 1px solid var(--paper3);
      padding: 24px 0;
    }
    .faq-question {
      font-family: 'Syne', sans-serif;
      font-size: 18px;
      font-weight: 700;
      margin-bottom: 12px;
      color: var(--ink);
    }
    .faq-answer {
      color: var(--ink2);
      line-height: 1.7;
    }
    
    /* CTA */
    .cta-section {
      background: linear-gradient(135deg, var(--primary-dark), var(--primary));
      color: white;
      text-align: center;
      padding: 80px 32px;
    }
    .cta-section h2 {
      font-family: 'Syne', sans-serif;
      font-size: 48px;
      font-weight: 700;
      margin-bottom: 20px;
    }
    .cta-section p {
      font-size: 20px;
      opacity: 0.9;
      margin-bottom: 40px;
      max-width: 600px;
      margin-left: auto;
      margin-right: auto;
    }
    .btn-white {
      background: white;
      color: var(--primary);
    }
    .btn-white:hover {
      transform: translateY(-2px);
      box-shadow: 0 8px 24px rgba(255,255,255,0.3);
    }
    
    <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="theme-color" content="#0d1628">
  <link rel="manifest" href="/manifest.json">
  <title>Pricing — StaxAI</title>
  <link href="https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=DM+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
  <style>
    :root {
      --bg:   #0d1628;
      --bg2:  #111d35;
      --bg3:  #162240;
      --card-border: rgba(255,255,255,0.10);
      --blue: #1A5490;
      --orange: #E8500A;
      --green: #22c55e;
      --muted: rgba(255,255,255,0.55);
      --text: #ffffff;
    }
    * { margin:0; padding:0; box-sizing:border-box; }
    body { font-family:'DM Sans', sans-serif; color:var(--text); background:var(--bg); line-height:1.6; }

    /* ── NAV ── */
    nav {
      position: sticky; top: 0;
      background: rgba(13,22,40,0.95);
      backdrop-filter: blur(12px);
      border-bottom: 1px solid var(--card-border);
      z-index: 1000;
    }
    .nav-container {
      max-width: 1200px; margin: 0 auto;
      padding: 18px 32px;
      display: flex; align-items: center; justify-content: space-between;
    }
    .logo {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 24px; font-weight: 700; color: var(--orange);
      text-decoration: none; letter-spacing: 0.5px;
    }
    .nav-links { display: flex; gap: 28px; list-style: none; align-items: center; }
    .nav-links a { text-decoration: none; color: var(--muted); font-weight: 500; font-size: 14px; transition: color 0.2s; }
    .nav-links a:hover { color: #fff; }
    .btn { display: inline-block; padding: 10px 22px; border-radius: 8px; font-weight: 600; font-size: 14px; text-decoration: none; transition: all 0.2s; cursor: pointer; border: none; font-family: 'DM Sans', sans-serif; }
    .btn-primary { background: var(--orange); color: white; }
    .btn-primary:hover { background: #c74408; transform: translateY(-1px); }
    .btn-lg { padding: 14px 28px; font-size: 16px; border-radius: 10px; }
    .btn-outline { background: transparent; color: var(--muted); border: 1px solid var(--card-border); }
    .btn-outline:hover { border-color: rgba(255,255,255,0.3); color: #fff; }

    /* ── PAGE HEADER ── */
    .page-header {
      background: linear-gradient(135deg, #0a1220 0%, var(--bg2) 100%);
      border-bottom: 1px solid var(--card-border);
      padding: 80px 32px 120px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }
    .page-header::before {
      content: '';
      position: absolute; inset: 0;
      background: radial-gradient(ellipse 70% 60% at 50% 0%, rgba(232,80,10,0.08) 0%, transparent 70%);
    }
    .page-header h1 {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 64px; font-weight: 800; margin-bottom: 16px;
      letter-spacing: -1px; position: relative;
    }
    .page-header p {
      font-size: 20px; color: var(--muted); max-width: 560px; margin: 0 auto; position: relative;
    }

    /* ── PRICING GRID ── */
    .pricing-container {
      max-width: 1200px; margin: -60px auto 80px;
      padding: 0 32px; position: relative; z-index: 1;
    }
    .pricing-grid {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
    }
    .price-card {
      background: var(--bg2); border: 1px solid var(--card-border);
      border-radius: 20px; padding: 36px;
      position: relative; transition: all 0.3s;
    }
    .price-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 20px 60px rgba(0,0,0,0.5);
      border-color: rgba(255,255,255,0.2);
    }
    .price-card.featured {
      border-color: var(--orange);
      border-width: 2px;
      background: linear-gradient(180deg, rgba(232,80,10,0.06) 0%, var(--bg2) 60%);
    }
    .popular-badge {
      position: absolute; top: -14px; left: 50%; transform: translateX(-50%);
      background: var(--orange); color: white;
      padding: 5px 18px; border-radius: 50px;
      font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px;
      white-space: nowrap;
    }
    .plan-name {
      font-family: 'Barlow Condensed', sans-serif;
      font-size: 28px; font-weight: 700; margin-bottom: 6px; color: #fff;
    }
    .plan-desc { color: var(--muted); font-size: 14px; margin-bottom: 24px; }
    .plan-price { display: flex; align-items: baseline; margin-bottom: 6px; }
    .price-dollar { font-size: 20px; font-weight: 700; color: var(--muted); margin-top: 8px; }
    .price-amount { font-family: 'Barlow Condensed', sans-serif; font-size: 60px; font-weight: 800; color: #fff; line-height: 1; }
    .price-period { font-size: 16px; color: var(--muted); margin-left: 6px; }
    .price-savings { font-size: 13px; color: var(--green); font-weight: 600; margin-bottom: 24px; }
    .plan-cta { width: 100%; margin-bottom: 28px; display: block; text-align: center; }
    .plan-features { list-style: none; display: flex; flex-direction: column; gap: 14px; }
    .plan-features li { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: rgba(255,255,255,0.75); }
    .plan-features li::before { content: '✓'; color: var(--green); font-weight: 700; font-size: 16px; flex-shrink: 0; }
    .feature-highlight { font-weight: 700; color: #fff; }

    /* ── DIVIDER ── */
    .section-divider { max-width: 1200px; margin: 0 auto; padding: 0 32px 60px; }
    .section-divider hr { border: none; border-top: 1px solid var(--card-border); }

    /* ── INDIVIDUAL TOOLS ── */
    .individual-tools-section { max-width: 1200px; margin: 0 auto 80px; padding: 0 32px; }
    .section-header { text-align: center; margin-bottom: 48px; }
    .section-header h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 44px; font-weight: 700; margin-bottom: 12px; }
    .section-header p { color: var(--muted); font-size: 17px; }
    .category-label { font-family: 'Barlow Condensed', sans-serif; font-size: 20px; font-weight: 700; color: rgba(255,255,255,0.5); margin: 40px 0 16px; letter-spacing: 1px; text-transform: uppercase; }
    .tools-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 0; }
    .tool-card {
      background: var(--bg2); border: 1px solid var(--card-border);
      border-radius: 14px; padding: 22px; transition: all 0.25s; text-align: center;
    }
    .tool-card:hover { border-color: rgba(255,255,255,0.2); transform: translateY(-3px); }
    .tool-icon { font-size: 32px; margin-bottom: 10px; }
    .tool-name { font-family: 'Barlow Condensed', sans-serif; font-size: 16px; font-weight: 700; margin-bottom: 8px; color: #fff; }
    .tool-price { font-family: 'Barlow Condensed', sans-serif; font-size: 22px; font-weight: 700; color: var(--orange); }

    /* ── FAQ ── */
    .faq-section { background: var(--bg2); border-top: 1px solid var(--card-border); padding: 80px 32px; }
    .faq-container { max-width: 800px; margin: 0 auto; }
    .faq-item { border-bottom: 1px solid var(--card-border); padding: 24px 0; }
    .faq-question { font-family: 'Barlow Condensed', sans-serif; font-size: 20px; font-weight: 700; margin-bottom: 10px; color: #fff; cursor: pointer; }
    .faq-answer { color: var(--muted); line-height: 1.7; font-size: 15px; }

    /* ── CTA ── */
    .cta-section {
      text-align: center; padding: 80px 32px;
      background: linear-gradient(135deg, #0a1220, var(--bg2));
      border-top: 1px solid var(--card-border);
    }
    .cta-section h2 { font-family: 'Barlow Condensed', sans-serif; font-size: 52px; font-weight: 800; margin-bottom: 16px; }
    .cta-section p { font-size: 19px; color: var(--muted); margin-bottom: 36px; max-width: 560px; margin-left: auto; margin-right: auto; }
    .cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }

    /* ── RESPONSIVE ── */
    
    /* RESPONSIVE */
    @media (max-width: 768px) {
      .pricing-grid { grid-template-columns: 1fr; }
      .tools-grid { grid-template-columns: repeat(2, 1fr); }
      .page-header h1 { font-size: 36px; }
      .nav-links { display: none; }
    }
  </style>
</head>
<body>

<div class="topbar">
  <a href="index.html" style="display:flex;align-items:center;text-decoration:none;"><img src="StaxAI Cropped Transparent.png" alt="StaxAI" style="height:38px;width:auto;display:block;"></a>
  
  <div class="topbar-nav"><a href="javascript:void(0)" id="back-btn">&#8592; Back</a></div><div class="topbar-spacer"></div><div class="bundle-rotator">
    <span class="bundle-rotator-icon">&#128230;</span>
    <div class="bundle-rotator-track">
      <div class="bundle-rotator-item active">Starter — any 3 tools $149/mth</div>
      <div class="bundle-rotator-item">Growth — any 6 tools $299/mth</div>
      <div class="bundle-rotator-item">Complete — all tools $499/mth</div>
    </div>
    <span class="bundle-rotator-cta">Bundle &#8594;</span>
  </div>
  <div class="topbar-actions">
    <a href="login.html" class="btn-signin">Sign In</a>
    <a href="tools.html?workflow=trial" class="btn-trial">Start Free Trial</a>
  </div>
</div>

  <!-- PAGE HEADER -->
  <section class="page-header">
    <h1>Simple, Transparent Pricing</h1>
    <p>Everything your trades business needs in one platform. No contracts. Cancel anytime.</p>
  </section>

  <!-- PRICING CARDS -->
  <section class="pricing-container">
    <div class="pricing-grid">

      <!-- STARTER -->
      <div class="price-card">
        <div class="plan-name">Starter</div>
        <div class="plan-desc">Perfect for solo operators and 1–2 person teams getting started with AI</div>
        <div class="plan-price">
          <span class="price-dollar">$</span>
          <span class="price-amount">149</span>
          <span class="price-period">/month</span>
        </div>
        <div class="price-savings">Save 20% vs individual tools</div>
        <a href="/login.html?signup=1&plan=starter" class="btn btn-lg btn-outline plan-cta">Get Started</a>
        <ul class="plan-features">
          <li><span class="feature-highlight">3 core tools</span> of your choice</li>
          <li>AI Website Chatbot</li>
          <li>Social Media Manager</li>
          <li>Industry News Digest</li>
          <li>Email Assistant</li>
          <li>All tool features included</li>
          <li>Mobile app (PWA) access</li>
          <li>Email support</li>
          <li>Cancel anytime</li>
        </ul>
      </div>

      <!-- GROWTH (FEATURED) -->
      <div class="price-card featured">
        <div class="popular-badge">Most Popular</div>
        <div class="plan-name">Growth</div>
        <div class="plan-desc">For small teams of 3–10 staff ready to automate and scale</div>
        <div class="plan-price">
          <span class="price-dollar">$</span>
          <span class="price-amount">299</span>
          <span class="price-period">/month</span>
        </div>
        <div class="price-savings">Save 30% vs individual tools</div>
        <a href="/login.html?signup=1&plan=growth" class="btn btn-lg btn-primary plan-cta">Get Started</a>
        <ul class="plan-features">
          <li><span class="feature-highlight">8 core tools</span> included</li>
          <li>Everything in Starter, plus:</li>
          <li>Strategic Plan & Ops Dashboard</li>
          <li>Quote Generator</li>
          <li>Customer Progress Updates</li>
          <li>Invoice Automation</li>
          <li>SWMS & Safety Docs</li>
          <li>Priority email support</li>
          <li>Quarterly strategy call</li>
        </ul>
      </div>

      <!-- COMPLETE -->
      <div class="price-card">
        <div class="plan-name">Complete</div>
        <div class="plan-desc">The full suite — every tool for your industry, unlimited usage</div>
        <div class="plan-price">
          <span class="price-dollar">$</span>
          <span class="price-amount">499</span>
          <span class="price-period">/month</span>
        </div>
        <div class="price-savings">All tools included + unlimited usage</div>
        <a href="/login.html?signup=1&plan=complete" class="btn btn-lg btn-outline plan-cta">Get Started</a>
        <ul class="plan-features">
          <li><span class="feature-highlight">All 14–18 tools</span> for your industry</li>
          <li>Everything in Growth, plus:</li>
          <li>All industry-specific tools</li>
          <li>Design Visualiser</li>
          <li>Smart Job Scheduling</li>
          <li>Business Intelligence Dashboard</li>
          <li>Tender Response Generator</li>
          <li>Dedicated account manager</li>
          <li>Phone + email support</li>
          <li>Monthly strategy calls</li>
        </ul>
      </div>

    </div>
  </section>

  <!-- INDIVIDUAL TOOLS -->
  <section class="individual-tools-section">
    <div class="section-header">
      <h2>Or Pick Individual Tools</h2>
      <p>Add exactly what you need — mix and match any tools</p>
    </div>

    <div class="category-label">Marketing & Customer Acquisition</div>
    <div class="tools-grid">
      <div class="tool-card"><div class="tool-icon">💬</div><div class="tool-name">AI Website Chatbot</div><div class="tool-price">$79/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📱</div><div class="tool-name">Social Media Manager</div><div class="tool-price">$59/mo</div></div>
      <div class="tool-card"><div class="tool-icon">✍️</div><div class="tool-name">Website Content Writer</div><div class="tool-price">$49/mo</div></div>
      <div class="tool-card"><div class="tool-icon">⭐</div><div class="tool-name">Review &amp; Referral Booster</div><div class="tool-price">$29/mo</div></div>
    </div>

    <div class="category-label">Quotes, Tenders &amp; Sales</div>
    <div class="tools-grid">
      <div class="tool-card"><div class="tool-icon">📋</div><div class="tool-name">Quote Generator</div><div class="tool-price">$49/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📑</div><div class="tool-name">Tender Response Generator</div><div class="tool-price">$99/mo</div></div>
      <div class="tool-card"><div class="tool-icon">🎨</div><div class="tool-name">Design Visualiser</div><div class="tool-price">$99/mo</div></div>
    </div>

    <div class="category-label">Operations &amp; Communication</div>
    <div class="tools-grid">
      <div class="tool-card"><div class="tool-icon">📧</div><div class="tool-name">Email Assistant</div><div class="tool-price">$69/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📲</div><div class="tool-name">Customer Progress Updates</div><div class="tool-price">$49/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📅</div><div class="tool-name">Smart Job Scheduling</div><div class="tool-price">$129/mo</div></div>
      <div class="tool-card"><div class="tool-icon">🧾</div><div class="tool-name">Invoice Automation</div><div class="tool-price">$59/mo</div></div>
    </div>

    <div class="category-label">Strategy, Planning &amp; Compliance</div>
    <div class="tools-grid">
      <div class="tool-card"><div class="tool-icon">📋</div><div class="tool-name">Strategic Plan Generator</div><div class="tool-price">$89/mo</div></div>
      <div class="tool-card"><div class="tool-icon">🦺</div><div class="tool-name">SWMS &amp; Safety Docs</div><div class="tool-price">$59/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📰</div><div class="tool-name">Industry News Digest</div><div class="tool-price">$39/mo</div></div>
      <div class="tool-card"><div class="tool-icon">📊</div><div class="tool-name">Business Intelligence</div><div class="tool-price">$89/mo</div></div>
    </div>

    <div style="text-align:center;margin-top:48px;">
      <a href="/prototype.html" class="btn btn-lg btn-primary">See All Tools for Your Industry →</a>
    </div>
  </section>

  <!-- FAQ -->
  <section class="faq-section">
    <div class="faq-container">
      <div class="section-header">
        <h2>Frequently Asked Questions</h2>
      </div>
      <div class="faq-item">
        <div class="faq-question">Can I change my plan anytime?</div>
        <div class="faq-answer">Yes. Upgrade, downgrade, or cancel anytime. No lock-in contracts. Changes take effect at your next billing cycle.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">What if I only need 2–3 tools?</div>
        <div class="faq-answer">Subscribe to individual tools à la carte. Most customers start with 2–3 tools and add more as they see the value.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">Do you offer a free trial?</div>
        <div class="faq-answer">Every plan comes with a 14-day free trial. No credit card required to get started.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">Are there setup fees or hidden costs?</div>
        <div class="faq-answer">No setup fees, no hidden costs. The price you see is what you pay. All features included in each tool, no surprises.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">What support do I get?</div>
        <div class="faq-answer">All plans include email support. Growth and Complete plans get priority support and strategy calls. Tools are designed to be self-explanatory — no training needed.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">Do tools work on mobile?</div>
        <div class="faq-answer">Yes — StaxAI is a Progressive Web App (PWA). Install it to your phone's home screen for a native app experience. Works on iOS and Android.</div>
      </div>
      <div class="faq-item">
        <div class="faq-question">What payment methods do you accept?</div>
        <div class="faq-answer">We accept all major credit cards and debit cards via Stripe. Invoicing is available for Complete plan customers.</div>
      </div>
    </div>
  </section>

  <!-- CTA -->
  <section class="cta-section">
    <h2>Ready to Automate Your Business?</h2>
    <p>Pick your industry, choose your tools, and start your free trial today. No credit card required.</p>
    <div class="cta-buttons">
      <a href="/prototype.html" class="btn btn-lg btn-outline">Explore Tools</a>
      <a href="/login.html?signup=1" class="btn btn-lg btn-primary">Start Free Trial →</a>
    </div>
  </section>

<footer style="background:#0a0f1a;border-top:1px solid rgba(255,255,255,0.08);padding:48px 0 32px;">
  <div style="max-width:1200px;margin:0 auto;padding:0 24px;">
    <div style="display:flex;flex-wrap:wrap;gap:40px;justify-content:space-between;margin-bottom:40px;">
      <div style="min-width:200px;">
        <div style="font-family:'Barlow Condensed',sans-serif;font-size:20px;font-weight:700;color:#c4622a;margin-bottom:8px;">StaxAI</div>
        <div style="font-size:13px;color:rgba(255,255,255,0.5);line-height:1.6;">AI-powered tools built for<br>Australian trades businesses.</div>
      </div>
      <div style="min-width:160px;">
        <div style="font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#c4622a;margin-bottom:12px;">Product</div>
        <div style="display:flex;flex-direction:column;gap:8px;">
          <a href="industry-select.html" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Browse Tools</a>
          <a href="pricing-page.html" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Pricing</a>
          <a href="login.html?tab=signup" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Sign Up</a>
        </div>
      </div>
      <div style="min-width:160px;">
        <div style="font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#c4622a;margin-bottom:12px;">Company</div>
        <div style="display:flex;flex-direction:column;gap:8px;">
          <a href="contact.html" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Contact</a>
          <a href="privacy-policy.html" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Privacy Policy</a>
          <a href="terms-of-service.html" style="font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;">Terms of Service</a>
        </div>
      </div>
    </div>
    <div style="border-top:1px solid rgba(255,255,255,0.08);padding-top:24px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;">
      <div style="font-size:12px;color:rgba(255,255,255,0.3);">&copy; 2025 Strategic Solutions. ABN 52 634 683 467. All rights reserved.</div>
      <div style="font-size:12px;color:rgba(255,255,255,0.3);">Built for Australian trades &mdash; by Australians.</div>
    </div>
  </div>
</footer>

<script>
(function(){
  var btn=document.getElementById('back-btn');
  if(btn){
    btn.addEventListener('click',function(){
      if(history.length>1){history.back();}
      else if(document.referrer){window.location.href=document.referrer;}
      else{window.location.href='index.html';}
    });
  }
})();
</script></body>
</html>