/*
Theme Name: Makai Property Advisory
Theme URI: https://makai.com.au
Author: Evoluz Global Solutions
Version: 2.0.0
Text Domain: makai
*/

/* ============================================================
   CSS VARIABLES
   ============================================================ */
:root {
  --navy:       #0C3157;
  --amber:      #ED8A19;
  --slate:      #1A2A3A;
  --cream:      #F2E9D8;
  --white:      #FFFFFF;
  --light-gray: #F8F7F5;
  --mid-gray:   #6B7280;
  --border:     #E5E0D8;
  --black:      #000000;
  --green:      #3A7D44;

  --font: 'Poppins', sans-serif;

  --fw-regular:  400;
  --fw-medium:   500;
  --fw-semibold: 600;
  --fw-bold:     700;
  --fw-extrabold:800;

  --container: 1240px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 20px;
  --radius-full: 9999px;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 16px rgba(0,0,0,0.10);
  --shadow-lg: 0 8px 32px rgba(0,0,0,0.14);
  --shadow-xl: 0 16px 48px rgba(0,0,0,0.18);

  --transition: 250ms ease;
}

/* ============================================================
   RESET
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: 16px; }
body { font-family: var(--font); color: var(--slate); background: var(--white); line-height: 1.7; -webkit-font-smoothing: antialiased; }
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; transition: color var(--transition); }
ul, ol { list-style: none; }
button { cursor: pointer; border: none; background: none; font-family: var(--font); }

/* ============================================================
   LAYOUT
   ============================================================ */
.container { width: 100%; max-width: var(--container); margin: 0 auto; padding: 0 1.5rem; }
.section { padding: 80px 0; }
.section--sm { padding: 50px 0; }
.section--lg { padding: 100px 0; }

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
.eyebrow { display: block; font-size: 0.75rem; font-weight: var(--fw-semibold); letter-spacing: 0.15em; text-transform: uppercase; color: var(--amber); margin-bottom: 0.75rem; }
.section-title { font-size: 2.25rem; font-weight: var(--fw-bold); color: var(--navy); line-height: 1.2; margin-bottom: 1.25rem; }
.section-title--white { color: var(--white); }
.section-subtitle { font-size: 1rem; color: var(--mid-gray); line-height: 1.8; max-width: 620px; }
.text-center { text-align: center; }
.text-center .section-subtitle { margin: 0 auto; }
.divider { width: 50px; height: 3px; background: var(--amber); margin-bottom: 1.5rem; }
.divider--center { margin-left: auto; margin-right: auto; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.75rem 1.75rem; font-family: var(--font); font-size: 0.875rem; font-weight: var(--fw-semibold); border-radius: var(--radius-sm); transition: all var(--transition); cursor: pointer; white-space: nowrap; }
.btn--primary { background: var(--navy); color: var(--white); border: 2px solid var(--navy); }
.btn--primary:hover { background: var(--amber); border-color: var(--amber); transform: translateY(-2px); box-shadow: var(--shadow-md); }
.btn--amber { background: var(--amber); color: var(--white); border: 2px solid var(--amber); }
.btn--amber:hover { background: var(--navy); border-color: var(--navy); transform: translateY(-2px); }
.btn--outline { background: transparent; color: var(--white); border: 2px solid var(--white); }
.btn--outline:hover { background: var(--white); color: var(--navy); }
.btn--outline-navy { background: transparent; color: var(--navy); border: 2px solid var(--navy); }
.btn--outline-navy:hover { background: var(--navy); color: var(--white); }
.btn--outline-amber { background: transparent; color: var(--amber); border: 2px solid var(--amber); padding: 0.5rem 1.5rem; font-size: 0.75rem; }
.btn--outline-amber:hover { background: var(--amber); color: var(--white); }

/* ============================================================
   PROSE CONTENT (Privacy / Terms)
   ============================================================ */
.prose-content h2 { font-size: 1.5rem; font-weight: var(--fw-bold); color: var(--navy); margin: 2rem 0 0.75rem; }
.prose-content p { color: var(--mid-gray); line-height: 1.9; margin-bottom: 1rem; }
.prose-content a { color: var(--navy); text-decoration: underline; }
