/* Unified Brand Color Same As Trinity Art System */ :root { --main-teal: #006180; --muted-gold: #b89a46; --btn-teal: #017D8B; --bg-warm-grey: #f7f5f0; --bg-card-white: #ffffff; --hover-light-grey: #f6f6f6; --text-muted: #666666; --text-dark: #292929; --text-canvas-grey: #D7D7D7; --btn-dark: #515151; } * { margin: 0; padding: 0; box-sizing: border-box; font-family: Arial, Helvetica, sans-serif !important; } body { background-color: #ffffff; color: var(--text-muted); line-height: 1.7; } h1, h2, h3 { font-weight: bold !important; text-align: center; } .container { width: 90%; max-width: 1200px; margin: 0 auto; padding: 0 15px; } .section-divider { height: 1px; background: linear-gradient(to right, transparent, var(--muted-gold), transparent); width: 120px; margin: 30px auto; } /* Card Style Same As Original Trinity Design */ .trinity-top-card { background: var(--bg-card-white); border-radius: 16px; box-shadow: 0 4px 12px rgba(0,0,0,0.07); overflow: hidden; transition: all 0.3s ease; } .trinity-top-card:hover { background-color: var(--hover-light-grey); transform: translateY(-4px); box-shadow: 0 8px 22px rgba(0,0,0,0.09); } .card-full-img { width: 100%; height: 260px; object-fit: cover; display:block; } .card-inner-content { padding: 24px 28px 32px; } .card-inner-content h2, .card-inner-content h3 { margin-top: 0 !important; margin-bottom: 1rem; } .common-card { background: var(--bg-card-white); border-radius:16px; box-shadow:0 3px 10px rgba(0,0,0,0.05); padding:32px 28px; transition:all 0.3s ease; } .common-card:hover { background-color: var(--hover-light-grey); transform: translateY(-3px); box-shadow:0 7px 18px rgba(0,0,0,0.07); } .text-main-teal { color: var(--main-teal); } .text-muted-gold { color: var(--muted-gold); } .text-warm-bg { color: var(--bg-warm-grey); } .text-dark { color: var(--text-dark); } .text-canvas-grey { color: var(--text-canvas-grey); } .py-16 { padding: 4rem 0; } .py-20 { padding: 5rem 0; } .mb-4 { margin-bottom: 1rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-8 { margin-bottom: 2rem; } .mb-12 { margin-bottom: 3rem; } .mb-16 { margin-bottom: 4rem; } .mr-3 { margin-right: 0.75rem; } .flex { display: flex; } .grid { display: grid; } .grid-cols-3 { grid-template-columns: repeat(3,1fr); gap:3rem; } .grid-cols-2 { grid-template-columns: repeat(2,1fr); gap:3rem; } .text-center { text-align: center; } .leading-relaxed { line-height:1.65; } /* Fixed indent bullet style same as finished Trinity page */ .bullet-item { padding-left:26px; position:relative; margin-bottom:8px; } .bullet-item::before { content:"●"; color:var(--muted-gold); position:absolute; left:0; top:0; } /* Button Style Inherit Original */ .cta-btn { background:var(--btn-dark); color:var(--bg-warm-grey); border:none; padding:15px 32px; border-radius:3px; font-size:14px; cursor:pointer; text-decoration: none !important; transition: all 0.3s ease; } .cta-btn:hover { background:var(--muted-gold); color:var(--bg-warm-grey); } @media(max-width:768px){ .grid-cols-3,.grid-cols-2 {grid-template-columns:1fr;} }