/* * Sambar Ritual (pId 64296) — brand override styles. * Auto-loaded by base.php for this brand. Ports the CI3 * assets/wla_new/sambarritual/css/about_20250704_1.css + assets/wla_new/css/contact-new.css * (only the classes the about / contact pages use). * * CI3 used --main-bg-color / --secondary-bg-color; CI4 injects --brand-primary * and --brand-secondary at runtime in , so we alias them here instead of * hardcoding a hex. */ :root { --main-bg-color: var(--brand-primary, #c0392b); --secondary-bg-color: var(--brand-secondary, #201c1d); } /* ── Layout / shared ────────────────────────────────────────────── */ .common-spacing { padding: 25px 0; } .common-para { font-size: 15px; color: #201c1d; } .common-p { font-size: 17px; line-height: 27px; } .common-p b { font-weight: 600; } .about-img img { width: 100%; } /* ── Placeholder image card ─────────────────────────────────────── */ .placeholder-img { border-radius: 12px; overflow: hidden; width: 100%; max-width: 100%; height: auto; position: relative; box-shadow: 0 0 15px 0 rgb(0 0 0 / 20%); } .placeholder-img img { width: 100%; max-width: 100%; height: 100%; object-fit: cover; } /* ── Title (about + contact headings) ───────────────────────────── */ .title:after { content: ""; position: absolute; width: 100%; max-width: 130px; background-color: var(--main-bg-color); height: 1px; bottom: -7px; left: 0; } .title .span-two { font-size: 26px; margin: 0 0 1em; line-height: normal; text-transform: uppercase; color: #000; } .text-center.title::after { left: 50%; transform: translate(-50%, 0); } .text-center.text-md-left.title::after { left: 0; transform: translate(0%, 0); } /* ── Inline-styled classes referenced by about.php ──────────────── */ .list-para { color: var(--secondary-bg-color); } .common-heading { color: var(--secondary-bg-color); } .know-more-btn { background-color: var(--secondary-bg-color); color: #fff; } @media only screen and (max-width: 767px) { .common-spacing { padding: 20px 0; } .placeholder-img { height: 100%; } .common-p { font-size: 16px; line-height: 26px; margin-top: 10px; } .title { font-size: 20px; } .title:after { max-width: 100px; } .title .span-two { font-size: 20px; } .text-center.text-md-left.title::after { left: 50%; transform: translate(-50%, 0); } }