:root {
  --green: #0F3D2E;
  --green-2: #1F5B43;
  --sage: #7A9E7E;
  --sage-2: #DCE8D8;
  --cream: #FDF8F0;
  --cream-2: #F6F0E6;
  --paper: #FFFFFF;
  --ink: #17352A;
  --muted: #5D6F66;
  --line: #E7E0D4;
  --shadow: 0 20px 50px rgba(15, 61, 46, .09);
  --radius: 24px;
  --radius-sm: 16px;
  --max: 1180px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; overflow-x: clip; }
body {
  margin: 0;
  font-family: "DM Sans", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background: linear-gradient(180deg, var(--cream), #fff 38%, var(--cream));
  line-height: 1.55;
}
img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
.container { width: min(var(--max), calc(100% - 40px)); margin: 0 auto; }
.skip-link { position: absolute; left: -999px; top: 8px; background: var(--green); color:#fff; padding: 10px 14px; border-radius: 8px; z-index: 999; }
.skip-link:focus { left: 8px; }
.site-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(253, 248, 240, .88);
  backdrop-filter: blur(18px);
  border-bottom: 1px solid rgba(231, 224, 212, .8);
}
.nav-wrap { height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 12px; min-width: 210px; }
.logo-mark { width: 54px; height: 54px; object-fit: cover; border-radius: 14px; box-shadow: 0 6px 20px rgba(15,61,46,.08); }
.brand-name { font-family: 'Lora', Georgia, 'Times New Roman', serif; font-size: 1.45rem; color: var(--green); line-height: 1.05; letter-spacing: -.02em; }
.brand-tag { display:block; font-size: .72rem; font-family: "DM Sans", Inter, sans-serif; color: var(--muted); margin-top: 3px; letter-spacing: 0; }
.main-nav { display:flex; align-items:center; gap: 6px; }
.main-nav a { padding: 10px 12px; border-radius: 999px; color: #203E33; font-weight: 650; font-size: .94rem; }
.main-nav a:hover, .main-nav a.active { background: rgba(122,158,126,.14); color: var(--green); }
.nav-actions { display:flex; align-items:center; gap: 10px; }
.btn, button.btn {
  display:inline-flex; align-items:center; justify-content:center; gap: 10px;
  border-radius: 999px; padding: 13px 20px; border: 1px solid var(--green);
  font-weight: 800; font-size: .96rem; cursor:pointer; transition: .2s ease;
}
.btn-primary { background: var(--green); color:#fff; box-shadow: 0 12px 24px rgba(15,61,46,.16); }
.btn-primary:hover { background: #0B2F24; transform: translateY(-1px); }
.btn-secondary { background: rgba(255,255,255,.62); color: var(--green); }
.btn-secondary:hover { background: var(--sage-2); }
.btn-disabled { background: var(--cream-2); color: var(--muted); border-color: var(--line); cursor: default; box-shadow:none; font-weight:700; }
.btn-disabled:hover { transform:none; background: var(--cream-2); }
.made-in-au { display:inline-flex; align-items:center; gap:6px; margin-top:12px; font-size:.84rem; font-weight:700; color:var(--muted); }
.menu-toggle { display:none; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px 12px; background: transparent; border:0; color:var(--green); font-weight:800; font-size:1rem; }
.hero { padding: 74px 0 54px; position: relative; overflow: hidden; }
.hero-grid { display:grid; grid-template-columns: 1.03fr .97fr; gap: 42px; align-items:center; }
.kicker { color: var(--green-2); font-weight: 850; text-transform: uppercase; letter-spacing: .14em; font-size:.78rem; margin-bottom: 14px; }
h1, h2, h3 { font-family: 'Lora', Georgia, 'Times New Roman', serif; color: var(--green); line-height:1.08; letter-spacing:-.035em; margin:0; }
h1 { font-size: clamp(3rem, 7vw, 6rem); max-width: 720px; }
h2 { font-size: clamp(2.1rem, 4vw, 3.5rem); }
h3 { font-size: clamp(1.35rem, 2vw, 1.7rem); }
p { margin: 0; }
.lead { font-size: 1.16rem; color:#31473F; max-width: 650px; margin-top: 24px; }
.hero-ctas { display:flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.trust-row { display:flex; flex-wrap:wrap; gap: 18px; margin-top: 32px; }
.trust-item { display:flex; align-items:center; gap:10px; color: var(--muted); font-weight:700; font-size:.92rem; }
.icon-chip { width: 38px; height: 38px; border-radius: 50%; display:grid; place-items:center; background: var(--sage-2); color: var(--green); font-weight:900; }
.hero-visual { position: relative; min-height: 520px; }
.glow { position:absolute; inset: 12% -6% auto auto; width: 440px; height: 440px; background: radial-gradient(circle, rgba(122,158,126,.2), transparent 68%); border-radius: 50%; filter: blur(6px); }
.phone-stack { position: relative; height: 520px; display:flex; align-items:center; justify-content:center; gap: -18px; }
.phone { width: 218px; min-height: 430px; border: 12px solid #111; border-radius: 36px; background: #fff; box-shadow: var(--shadow); padding: 18px 14px; position:relative; }
.phone.small { width: 190px; min-height: 380px; transform: translateY(34px); opacity: .96; }
.phone:nth-child(2) { z-index:2; width: 236px; min-height: 470px; }
.phone .bar { width: 64px; height: 6px; background:#111; border-radius:99px; margin: -8px auto 16px; }
.phone h4 { margin:0 0 12px; color:var(--green); font-size:1.05rem; }
.app-card { border:1px solid var(--line); background: var(--cream); border-radius: 16px; padding: 13px; margin-bottom: 10px; }
.app-card strong { display:block; color:#102F25; margin-bottom:4px; }
.app-card span { font-size:.78rem; color:var(--muted); display:block; }
.app-tabs { display:flex; justify-content:space-around; position:absolute; left:12px; right:12px; bottom:12px; color:var(--muted); font-size:.68rem; }
.section { padding: 76px 0; }
.section-tight { padding: 48px 0; }
.section-head { display:flex; justify-content:space-between; gap: 28px; align-items:end; margin-bottom: 32px; }
.section-head p { color:var(--muted); max-width: 620px; margin-top: 12px; }
.card { background: rgba(255,255,255,.78); border:1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
.panel { padding: 32px; }
.grid { display:grid; gap: 20px; }
.grid-2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.grid-4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.grid-5 { grid-template-columns: repeat(5, minmax(0,1fr)); }
.feature-card { padding: 24px; min-height: 190px; }
.feature-card .icon-chip { margin-bottom: 18px; }
.feature-card h3 { margin-bottom: 10px; }
.feature-card p { color: var(--muted); }
.product-strip { display:grid; grid-template-columns: .9fr 1.1fr; gap: 24px; align-items:center; }
.product-tiles { display:grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }
.product-tile { border-radius: 20px; min-height: 170px; background: linear-gradient(145deg, #F0E9DD, #fff); border: 1px solid var(--line); padding: 18px; display:flex; flex-direction:column; justify-content:end; gap:8px; position:relative; overflow:hidden; }
.product-tile:before { content:""; position:absolute; inset:18px 18px auto auto; width:66px; height:66px; border-radius:18px; background: rgba(122,158,126,.18); }
.product-tile .tile-icon { position:absolute; inset:18px 18px auto auto; width:66px; height:66px; border-radius:18px; display:grid; place-items:center; color:var(--green); z-index:1; }
.product-tile .tile-icon svg { width:34px; height:34px; }
.product-tile strong { position:relative; z-index:1; color:var(--green); }
.steps { display:grid; grid-template-columns: repeat(5, 1fr); gap: 16px; }
.step { text-align:center; padding: 26px 16px; }
.step-number { width: 34px; height: 34px; margin: 0 auto 14px; border-radius:50%; background:var(--green); color:#fff; display:grid; place-items:center; font-weight:900; }
.step .icon-chip { margin: 0 auto 16px; }
.library-stats { display:grid; grid-template-columns: repeat(6,1fr); gap: 14px; }
.stat { text-align:center; padding: 20px; }
.stat strong { display:block; font-size:2rem; color:var(--green); font-family: 'Lora', Georgia, serif; }
.stat span { color:var(--muted); font-weight:700; font-size:.92rem; }
.cta-band { background: linear-gradient(135deg, rgba(220,232,216,.75), rgba(253,248,240,.85)); border:1px solid var(--line); border-radius: var(--radius); padding: 36px; display:grid; grid-template-columns: 1fr auto; gap:24px; align-items:center; }
.disclaimer-box { border: 1px solid rgba(15,61,46,.25); background:rgba(255,255,255,.68); border-radius: var(--radius-sm); padding:24px; }
.page-hero { padding: 70px 0 34px; }
.page-hero .lead { max-width: 780px; }
.content { padding: 30px; }
.content h2 { margin: 36px 0 14px; font-size: 2.2rem; }
.content h3 { margin: 26px 0 10px; font-family: "DM Sans", Inter, sans-serif; color: var(--ink); letter-spacing:0; font-size:1.2rem; }
.content p, .content li { color: var(--muted); }
.content ul { margin: 12px 0 0; padding-left: 20px; }
.list-clean { list-style:none; padding:0 !important; margin:0 !important; display:grid; gap:12px; }
.list-clean li { padding: 14px 16px; background: var(--cream); border:1px solid var(--line); border-radius:14px; }
.badge { display:inline-flex; align-items:center; padding: 6px 10px; border-radius:999px; background: var(--sage-2); color:var(--green); font-weight:800; font-size:.78rem; }
.table-wrap { overflow:auto; border-radius: 18px; border:1px solid var(--line); }
table { border-collapse: collapse; width:100%; background:#fff; min-width: 720px; }
th, td { padding: 14px 16px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
th { background: var(--cream); color: var(--green); }
.site-footer { background: #fff; border-top:1px solid var(--line); padding: 44px 0 24px; }
.footer-grid { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 32px; }
.footer-grid h4 { color:var(--green); margin:0 0 12px; }
.footer-grid a, .footer-grid p { display:block; color:var(--muted); margin: 8px 0; }
.footer-bottom { border-top:1px solid var(--line); margin-top: 28px; padding-top: 18px; display:flex; justify-content:space-between; gap:16px; color:var(--muted); font-size:.92rem; }
.mobile-only { display:none; }
@media (max-width: 980px) {
  .menu-toggle { display:inline-flex; }
  .main-nav { display:none; position:absolute; left:20px; right:20px; top:82px; background:#fff; border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); padding:12px; flex-direction:column; align-items:stretch; }
  .main-nav.open { display:flex; }
  .main-nav a { border-radius:14px; padding:12px 14px; }
  .nav-actions .btn-secondary { display:none; }
  .hero-grid, .product-strip, .cta-band { grid-template-columns:1fr; }
  .hero-visual { min-height: 450px; }
  .phone.small { display:none; }
  .grid-3, .grid-4, .grid-5, .steps, .library-stats, .product-tiles { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .grid-2 { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}
@media (max-width: 640px) {
  .container { width: min(100% - 26px, var(--max)); }
  .nav-wrap { height:74px; }
  .brand { min-width:0; }
  .brand-name { font-size:1.12rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .brand-tag { display:none; }
  .logo-mark { width:44px; height:44px; }
  .nav-actions .btn { padding: 11px 14px; font-size: .88rem; }
  .hero { padding-top: 48px; }
  h1 { font-size: clamp(2.7rem, 16vw, 4.2rem); }
  .lead { font-size:1.05rem; }
  .section { padding: 54px 0; }
  .section-head { display:block; }
  .phone { transform: scale(.88); }
  .hero-visual { min-height: 420px; }
  .grid-3, .grid-4, .grid-5, .steps, .library-stats, .product-tiles { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; }
  .panel, .content { padding:22px; }
}

/* Social icons (footer) */
.social-row { display:flex; gap:10px; margin-top:16px; }
.social-link { width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:var(--cream); color:var(--green); display:grid; place-items:center; transition:.2s ease; }
.social-link:hover { background:var(--sage-2); transform:translateY(-1px); }
.social-link svg { width:18px; height:18px; }

/* Glossary definitions */
.list-clean li strong { display:block; color:var(--green); margin-bottom:3px; }
.list-clean li span { color:var(--muted); font-size:.95rem; }
.verdict { display:inline-block; margin-left:6px; padding:2px 9px; border-radius:999px; background:var(--sage-2); color:var(--green); font-size:.66rem; font-weight:800; letter-spacing:.05em; text-transform:uppercase; vertical-align:middle; }

/* Topic groups */
.topic-group { margin-bottom:46px; }
.topic-group:last-of-type { margin-bottom:8px; }

/* Learn pages */
.learn-stack { display:grid; gap:20px; max-width: 880px; }
.callout { border-left:4px solid var(--sage); background:var(--cream); border-radius:14px; padding:16px 18px; margin:16px 0; }
.callout strong { color:var(--green); display:block; margin-bottom:6px; }
.callout p { color:var(--muted); }
.qa-list { margin-top:18px; display:grid; gap:10px; }
.qa-list details { border:1px solid var(--line); background:var(--cream); border-radius:14px; padding:14px 16px; }
.qa-list summary { cursor:pointer; font-weight:700; color:var(--green); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.qa-list summary::marker { color: var(--sage); }
.qa-list summary::after { content:'+'; margin-left:auto; color:var(--sage); font-weight:800; font-size:1.05rem; line-height:1; }
.qa-list details[open] summary::after { content:'\2212'; }
.qa-list details p { margin-top:12px; color:var(--muted); }
.qa-tag { flex-shrink:0; }
.learn-tile h3 { font-size:1.15rem; }
.learn-tile p { font-size:.92rem; margin-top:8px; }
a.badge:hover { background: var(--sage); color:#fff; }
.list-clean li a strong { text-decoration:underline; text-decoration-color: rgba(122,158,126,.55); text-underline-offset:3px; }
.list-clean li a:hover strong { text-decoration-color: var(--green); }

a.product-tile { text-decoration:none; color:inherit; }

/* Breadcrumbs (learn + product detail pages) */
.breadcrumb { display:flex; flex-wrap:wrap; align-items:center; gap:8px; font-size:.82rem; color:var(--muted); margin-bottom:16px; }
.breadcrumb a { color:var(--green-2); font-weight:700; }
.breadcrumb a:hover { text-decoration:underline; }
.breadcrumb .bc-sep { color:var(--line); }
.breadcrumb [aria-current="page"] { color:var(--muted); }

/* Filters + search (blog, glossary) */
.filter-bar { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 28px; }
.filter-bar button { border:1px solid var(--line); background:var(--paper); color:var(--green); font-weight:700; font-size:.86rem; padding:8px 14px; border-radius:999px; cursor:pointer; transition:.15s ease; font-family:inherit; }
.filter-bar button:hover { background:var(--sage-2); }
.filter-bar button.active { background:var(--green); color:#fff; border-color:var(--green); }
.glossary-search { margin-bottom:10px; }
.glossary-search input { width:100%; max-width:540px; padding:13px 16px; border:1px solid var(--line); border-radius:14px; font-size:1rem; font-family:inherit; background:var(--paper); color:var(--ink); }
.glossary-search input:focus { outline:2px solid var(--sage); outline-offset:1px; }
.glossary-count { color:var(--muted); font-size:.9rem; margin:0 0 18px; }
.start-here ol { margin:14px 0 0; padding-left:22px; }
.start-here ol li { margin:8px 0; }
.start-here ol li a { color:var(--green-2); font-weight:700; }
.start-here ol li a:hover { text-decoration:underline; }
.content ol { margin:12px 0 0; padding-left:22px; }
.check-first li { margin:7px 0; }