/* Gilded - getgilded.com.au */
:root{
  --bg:#f7f7f5; --panel:#ffffff; --ink:#16161a; --muted:#6e6e6a;
  --line:#e7e7e3; --gold:#c9a24b; --gold-soft:#f6f1e3; --gold-deep:#9a7c33;
  --dark:#121214; --dark-2:#1a1a1d; --cream-text:#d8d7d3;
  --green:#2e7d4f; --green-soft:#e3f1e8; --red:#b3432f;
  --blue:#2f5e8f; --blue-soft:#e5eef6;
  --radius:14px;
  --serif:"Fraunces", Georgia, "Times New Roman", serif;
  --sans:"Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
}
*{box-sizing:border-box; margin:0; padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--sans); color:var(--ink); background:var(--bg); font-size:17px; line-height:1.6}
img,svg{max-width:100%; display:block}
a{color:var(--gold-deep)}

/* ---------- Audience top bar ---------- */
.topbar{background:var(--gold-soft); color:var(--ink); font-size:.9rem; text-align:center; padding:9px 20px; border-bottom:1px solid rgba(201,162,75,.35)}
.topbar a{color:var(--gold-deep); font-weight:700; text-decoration:none; white-space:nowrap}
.topbar a:hover{text-decoration:underline}
.topbar .muted-inline{color:var(--muted)}

/* ---------- Capability / trust strip ---------- */
.trust{border-bottom:1px solid var(--line); background:#fff}
.trust .wrap{display:flex; flex-wrap:wrap; gap:10px 26px; justify-content:center; padding:16px 24px; font-size:.85rem; color:var(--muted)}
.trust b{color:var(--ink); font-weight:600}
.trust .dot{color:var(--gold)}

/* ---------- Nav ---------- */
header.site{position:sticky; top:0; z-index:40; background:rgba(18,18,20,.97); backdrop-filter:blur(6px); border-bottom:1px solid rgba(201,162,75,.25)}
.nav{max-width:1120px; margin:0 auto; display:flex; align-items:center; gap:28px; padding:16px 24px}
.brand{font-family:var(--serif); font-size:1.5rem; font-weight:600; color:#fff; text-decoration:none; letter-spacing:.3px}
.brand span{color:var(--gold)}
.nav nav{display:flex; gap:22px; margin-left:12px}
.nav nav a{color:var(--cream-text); text-decoration:none; font-size:.95rem; padding:6px 2px; border-bottom:2px solid transparent}
.nav nav a:hover{color:#fff}
.nav nav a.active{color:#fff; border-bottom-color:var(--gold)}
.nav .cta{margin-left:auto}

/* ---------- Buttons ---------- */
.btn{display:inline-block; background:var(--gold); color:#131208; text-decoration:none; font-weight:600; padding:12px 24px; border-radius:10px; font-size:.98rem; border:0; cursor:pointer; transition:background .15s, transform .15s}
.btn:hover{background:#d6b160; transform:translateY(-1px)}
.btn.ghost{background:transparent; border:1px solid rgba(216,215,211,.4); color:var(--cream-text)}
.btn.ghost:hover{border-color:var(--gold); color:#fff; background:transparent}
.btn.ghost.on-light{border-color:var(--line); color:var(--ink)}
.btn.ghost.on-light:hover{border-color:var(--gold); color:var(--gold-deep)}
.btn.lg{padding:15px 32px; font-size:1.05rem}

/* ---------- Layout ---------- */
.wrap{max-width:1120px; margin:0 auto; padding:0 24px}
section{padding:84px 0}
section.tight{padding:56px 0}
.kicker{display:inline-block; font-size:.78rem; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold-deep); margin-bottom:14px}
.soon{display:inline-block; background:var(--gold); color:#131208; font-size:.68rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:3px 11px; border-radius:20px; margin-left:10px; vertical-align:middle}
.dark .kicker{color:var(--gold)}
h1{font-family:var(--serif); font-weight:600; font-size:clamp(2.2rem, 5vw, 3.4rem); line-height:1.12; letter-spacing:-.5px}
h2{font-family:var(--serif); font-weight:600; font-size:clamp(1.7rem, 3.5vw, 2.3rem); line-height:1.2; margin-bottom:14px}
h3{font-size:1.12rem; margin-bottom:8px}
.lede{font-size:1.16rem; color:var(--muted); max-width:640px}
.dark .lede{color:#a5a49e}
.center{text-align:center}
.center .lede{margin:0 auto}

/* ---------- Hero ---------- */
.hero{background:var(--dark); color:#fff; position:relative; overflow:hidden; padding:96px 0 0}
.hero::before{content:""; position:absolute; inset:-40% -20% auto; height:120%; background:radial-gradient(ellipse at 70% 10%, rgba(201,162,75,.22), transparent 55%); pointer-events:none}
.hero .wrap{position:relative}
.hero-grid{display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center; padding-bottom:96px}

/* ---------- Dual-audience hero (make / trade) ---------- */
.hero-dual{padding:8px 0 90px}
.hero-lead{text-align:center; max-width:780px; margin:0 auto}
.hero .hero-lead .lede{margin:20px auto 30px}
.hero-lead .hero-note{margin-top:20px}
.doors{display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:44px}
.door{background:rgba(255,255,255,.04); border:1px solid rgba(201,162,75,.28); border-radius:16px; padding:32px 30px; text-align:left; transition:transform .18s, border-color .18s, background .18s}
.door:hover{transform:translateY(-4px); border-color:var(--gold); background:rgba(255,255,255,.07)}
.door .door-ico{font-size:1.5rem; width:54px; height:54px; border-radius:14px; background:rgba(201,162,75,.16); color:var(--gold); display:flex; align-items:center; justify-content:center; margin-bottom:18px}
.door .door-tag{font-size:.72rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold)}
.door h3{font-family:var(--serif); font-size:1.5rem; color:#fff; margin:6px 0 10px}
.door p{color:#a5a49e; font-size:.98rem; margin-bottom:20px}
.door .door-link{color:#fff; font-weight:700; text-decoration:none; font-size:.95rem; border-bottom:2px solid var(--gold); padding-bottom:2px}
.door:hover .door-link{color:var(--gold)}
.converge{text-align:center; margin-top:26px; color:#a5a49e; font-size:1rem}
.converge b{color:#fff; font-weight:600}
.converge a{color:var(--gold); font-weight:700; text-decoration:none; white-space:nowrap}
.converge a:hover{text-decoration:underline}

/* ---------- Equal make/trade pillars (light sections) ---------- */
.pillar-label{display:inline-flex; align-items:center; gap:8px; font-size:.72rem; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; color:var(--gold-deep); background:var(--gold-soft); padding:5px 12px; border-radius:20px; margin-bottom:14px}
.hero .lede{margin:22px 0 34px}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap; align-items:center}
.hero-note{font-size:.85rem; color:#85847f; margin-top:18px}
.shot{background:var(--bg); border-radius:var(--radius); box-shadow:0 30px 70px rgba(0,0,0,.45); overflow:hidden; border:1px solid rgba(201,162,75,.3)}
.shot img, .shot svg{width:100%; height:auto}

/* ---------- Feature cards ---------- */
.cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:20px; margin-top:44px}
.card{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:28px 26px; box-shadow:0 1px 3px rgba(15,15,20,.06); transition:transform .18s, box-shadow .18s}
.card:hover{transform:translateY(-3px); box-shadow:0 12px 30px rgba(15,15,20,.1)}
.card .ico{width:46px; height:46px; border-radius:12px; background:var(--gold-soft); color:var(--gold-deep); display:flex; align-items:center; justify-content:center; font-size:1.3rem; margin-bottom:16px}
.card p{color:var(--muted); font-size:.95rem}

/* ---------- Numbered steps ---------- */
.steps{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px,1fr)); gap:20px; margin-top:44px; counter-reset:step}
.step{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:26px 24px; position:relative; box-shadow:0 1px 3px rgba(15,15,20,.06)}
.step::before{counter-increment:step; content:counter(step); display:flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:50%; background:var(--gold-soft); color:var(--gold-deep); font-family:var(--serif); font-weight:600; font-size:1.1rem; margin-bottom:14px}
.step h3{margin-bottom:6px}
.step p{color:var(--muted); font-size:.92rem}

/* ---------- Passion pricing callout ---------- */
.callout{background:#fdf3d7; border-radius:var(--radius); border-left:4px solid #8a6d1a; padding:26px 30px; margin-top:40px; max-width:760px; margin-left:auto; margin-right:auto; text-align:left}
.callout b{color:#8a6d1a}
.callout p{color:#5c5636; margin-top:8px}

/* ---------- Split feature sections ---------- */
.split{display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center}
.split.rev > .shot-col{order:2}
.split ul{list-style:none; margin-top:18px}
.split li{padding:9px 0 9px 34px; position:relative; color:#45454a}
.split li::before{content:"✓"; position:absolute; left:0; top:9px; width:22px; height:22px; border-radius:50%; background:var(--green-soft); color:var(--green); font-size:.8rem; font-weight:700; display:flex; align-items:center; justify-content:center}
.split .shot{box-shadow:0 20px 50px rgba(15,15,20,.18)}
.alt-band{background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line)}

/* ---------- Pricing ---------- */
.plans{display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:24px; margin-top:48px; max-width:1080px; margin-left:auto; margin-right:auto}
.plan{background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:36px 32px; text-align:left; position:relative}
.plan.featured{border:2px solid var(--gold); box-shadow:0 18px 44px rgba(138,106,36,.16)}
.plan .flag{position:absolute; top:-13px; left:32px; background:var(--gold); color:#131208; font-size:.72rem; font-weight:700; letter-spacing:1px; text-transform:uppercase; padding:4px 12px; border-radius:20px}
.plan h3{font-family:var(--serif); font-size:1.45rem}
.plan .tagline{color:var(--muted); font-size:.92rem; margin:4px 0 20px}
.price{font-family:var(--serif); font-size:2.9rem; font-weight:600; line-height:1}
.price small{font-family:var(--sans); font-size:.95rem; color:var(--muted); font-weight:400}
.plan ul{list-style:none; margin:24px 0 28px}
.plan li{padding:7px 0 7px 30px; position:relative; font-size:.95rem; color:#45454a}
.plan li::before{content:"✓"; position:absolute; left:0; top:7px; width:20px; height:20px; border-radius:50%; background:var(--gold-soft); color:var(--gold-deep); font-size:.72rem; font-weight:700; display:flex; align-items:center; justify-content:center}
.plan li.dim{color:#a3a29c}
.plan li.dim::before{content:"–"; background:#efefec; color:#a3a29c}
.plan .btn{width:100%; text-align:center}
.gst{font-size:.82rem; color:var(--muted); text-align:center; margin-top:18px}

/* ---------- Comparison table ---------- */
.compare{width:100%; border-collapse:collapse; margin-top:40px; background:#fff; border-radius:var(--radius); overflow:hidden; box-shadow:0 1px 3px rgba(15,15,20,.06)}
.compare th, .compare td{padding:14px 18px; border-bottom:1px solid var(--line); text-align:left; font-size:.95rem}
.compare thead th{background:var(--dark); color:#fff; font-family:var(--serif); font-size:1.02rem; font-weight:600}
.compare thead th:nth-child(2), .compare thead th:nth-child(3){text-align:center; width:150px}
.compare td:nth-child(2), .compare td:nth-child(3){text-align:center}
.compare .yes{color:var(--green); font-weight:700}
.compare .no{color:#c4c3be}
.compare .grp td{background:var(--gold-soft); color:var(--gold-deep); font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:1px; padding:9px 18px}

/* ---------- Dark band / CTA ---------- */
.dark{background:var(--dark); color:#fff}
.dark h2{color:#fff}
.cta-band{background:var(--dark); color:#fff; text-align:center; padding:90px 24px; position:relative; overflow:hidden}
.cta-band::before{content:""; position:absolute; inset:auto -20% -60%; height:120%; background:radial-gradient(ellipse at 50% 100%, rgba(201,162,75,.25), transparent 60%)}
.cta-band > *{position:relative}
.cta-band p{color:#a5a49e; margin:14px auto 34px; max-width:520px}

/* ---------- Stats strip ---------- */
.stats-strip{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:20px; margin-top:44px}
.stat-box{border-left:3px solid var(--gold); padding:6px 0 6px 20px}
.stat-box b{font-family:var(--serif); font-size:1.7rem; display:block; font-weight:600}
.stat-box span{color:var(--muted); font-size:.9rem}
.dark .stat-box span{color:#a5a49e}

/* ---------- FAQ ---------- */
.faq{max-width:760px; margin:40px auto 0}
.faq details{background:#fff; border:1px solid var(--line); border-radius:12px; padding:20px 24px; margin-bottom:12px}
.faq summary{font-weight:600; cursor:pointer; font-size:1.02rem}
.faq p{margin-top:12px; color:var(--muted); font-size:.95rem}

/* ---------- Forms (contact) ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1.2fr; gap:64px; align-items:start}
form.contact{background:#fff; border:1px solid var(--line); border-radius:18px; padding:36px; box-shadow:0 12px 34px rgba(15,15,20,.08)}
.f-row{display:grid; grid-template-columns:1fr 1fr; gap:16px}
label{display:block; font-size:.8rem; font-weight:700; letter-spacing:.5px; text-transform:uppercase; color:var(--muted); margin:18px 0 6px}
input,select,textarea{width:100%; font:inherit; padding:12px 14px; border:1px solid var(--line); border-radius:10px; background:var(--bg)}
input:focus,select:focus,textarea:focus{outline:2px solid var(--gold-soft); border-color:var(--gold)}
.contact-detail{padding:8px 0 8px 0; border-bottom:1px solid var(--line); margin-bottom:8px}
.contact-detail b{display:block; font-size:.8rem; text-transform:uppercase; letter-spacing:1px; color:var(--gold-deep); margin-bottom:2px}
.form-ok{display:none; background:var(--green-soft); color:var(--green); border-radius:10px; padding:14px 18px; margin-top:20px; font-weight:600}

/* ---------- About ---------- */
.prose{max-width:720px}
.prose p{margin-bottom:20px; color:#45454a}
.prose p:first-of-type{font-size:1.15rem}

/* ---------- Footer ---------- */
footer.site{background:var(--dark); color:#85847f; padding:56px 24px 40px; border-top:1px solid rgba(201,162,75,.25)}
.foot-grid{max-width:1120px; margin:0 auto; display:grid; grid-template-columns:2fr 1fr 1fr; gap:40px}
footer .brand{font-size:1.3rem}
footer h4{color:#d8d7d3; font-size:.85rem; text-transform:uppercase; letter-spacing:1.5px; margin-bottom:14px}
footer a{color:#a5a49e; text-decoration:none; display:block; padding:4px 0; font-size:.92rem}
footer a:hover{color:var(--gold)}
.foot-legal{max-width:1120px; margin:44px auto 0; padding-top:24px; border-top:1px solid rgba(216,215,211,.12); font-size:.82rem; line-height:1.7}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .hero-grid,.split,.contact-grid{grid-template-columns:1fr; gap:40px}
  .split.rev > .shot-col{order:0}
  .foot-grid{grid-template-columns:1fr}
  .nav nav{display:none}
  section{padding:60px 0}
}