:root { --main-teal: #006180; --muted-gold: #b89a46; --btn-dark: #515151; --bg-warm-grey: #f7f5f0; --bg-card-white: #ffffff; --hover-light-grey: #f6f6f6; --text-muted: #666666; --text-dark: #292929; } * { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif !important; } body { background: #ffffff; color: var(--text-muted); line-height: 1.7; } .container { max-width: 1200px; width: 92%; margin: 0 auto; padding: 0 15px; } .py-16 { padding: 4rem 0; } .py-12 { padding: 3rem 0; } .mb-5 { margin-bottom: 1.25rem; } .mb-8 { margin-bottom: 2rem; } .mb-10 { margin-bottom: 2.5rem; } .mb-14 { margin-bottom: 3.5rem; } .mb-16 { margin-bottom:4rem; } .text-center { text-align: center; } .section-divider { width:130px; height:1px; margin:24px auto 40px; background: linear-gradient(to right, transparent, var(--muted-gold), transparent); } .brand-gold { color: var(--muted-gold); font-weight:600; } .brand-teal { color: var(--main-teal); font-weight:600; } /* Base Card add light grey shadow + hover */ .base-card { background: var(--bg-card-white); border-radius:16px; box-shadow: 0 3px 12px #e2e2e2; padding:32px 28px; transition: all 0.3s ease; } .base-card:hover { transform: translateY(-4px); box-shadow:0 8px 22px #d9d9d9; } .grid-two-col { display:grid; grid-template-columns: 1fr 1fr; gap:3rem; } .choice-card-wrap { display:flex; flex-direction:column; gap:1.8rem; } /* Category select card shadow & hover */ .select-card { padding:26px; border-radius:14px; background: var(--bg-warm-grey); display:flex; align-items:center; gap:22px; transition:0.3s ease; cursor:pointer; color:inherit; box-shadow:0 2px 10px #e8e8e8; } .select-card:hover { background:#fff; box-shadow:0 6px 18px #dddddd; transform: translateY(-3px); } .card-icon { width:60px; height:60px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:var(--main-teal); color:#fff; font-size:26px; } .card-text h4 { font-size:1.2rem; color:var(--text-dark); margin-bottom:6px; } .card-text p { font-size:0.95rem; color:var(--text-muted); } .form-group { margin-bottom:18px; } .form-group label { display:block; margin-bottom:6px; color:var(--text-dark); font-weight:500; } .form-control { width:100%; padding:12px 14px; border:1px solid #ddd; border-radius:6px; font-size:15px; color:var(--text-dark); transition:0.2s; } .form-control:focus { outline:none; border-color:var(--main-teal); } /* Global Radio Style: 2px space between radio & text + gold checked color */ .check-row { display:flex; gap:14px; flex-wrap:wrap; margin:8px 0; } .check-row label { display:flex; align-items:center; gap:2px; /* 2 letters/px space between radio and text */ letter-spacing:1px; cursor:pointer; } input[type="radio"]:checked { accent-color: var(--muted-gold); } .note-text { font-size:0.88rem; color:#777; } .submit-btn { padding:14px 36px; background:var(--btn-dark); color:#fff; border:none; border-radius:4px; font-size:1rem; cursor:pointer; transition:0.3s; margin-top:12px; } .submit-btn:hover { background:var(--muted-gold); } @media(max-width:768px){ .grid-two-col { grid-template-columns:1fr; } }