/* ===================================================================== Rayalaseema Cafe — Brand Overlay Loaded AFTER localloom-base.css. Per rayalaseema-brand skill. Overrides the base CSS :root tokens with Rayalaseema's actual palette and font, sourced from the official Brand Manual (2026-05-18). Colors per brand manual: Cashmere #F1E5DA Fresh Acorn #D4683C Forestry #2F4721 Deep Slate Olive #1B2717 Font: Chivo (loaded via Google Fonts in the template ). ===================================================================== */ :root { /* Paper / body / cards */ --paper: #F1E5DA; /* Cashmere */ --paper-deep: #E3D4C2; --paper-rule: #D9C8B3; /* Ink / text */ --ink: #1B2717; /* Deep Slate Olive */ --ink-soft: #3A4733; --ink-muted: #6F7766; /* Primary brand color (header, primary buttons, brand statements) */ --primary: #2F4721; /* Forestry */ --primary-deep: #243619; /* Accent (CTAs, fire tags, italics, the wedge color) */ --accent: #D4683C; /* Fresh Acorn */ --accent-deep: #B5552E; --accent-soft: rgba(212, 104, 60, 0.10); /* Typography — Chivo with system fallback */ --font-body: "Chivo", -apple-system, "Segoe UI", system-ui, sans-serif; } /* ----- Rayalaseema-specific adjustments ----- The hero radial gradient default uses an Acorn-tone — explicitly set here in case the base CSS gradient color needs to match Acorn exactly. (Already does in the base, but documenting for any future tweaks.) */ .hero { background: radial-gradient(ellipse at top right, rgba(212, 104, 60, 0.06), transparent 50%), var(--paper); } /* The .photos section gradients in base use generic dark — Rayalaseema variant tints them slightly with warm undertones to feel more food-y */ .photos .photo:nth-child(1) { background: linear-gradient(135deg, #2F4721, #1B2717); } .photos .photo:nth-child(2) { background: linear-gradient(135deg, #3D5328, #1B2717); } .photos .photo:nth-child(3) { background: linear-gradient(135deg, #5C3A22, #1B2717); } .photos .photo:nth-child(4) { background: linear-gradient(135deg, #4A3220, #1B2717); } .photos .photo:nth-child(5) { background: linear-gradient(135deg, #354A23, #1B2717); } /* ───────────────────────────────────────────────────────── Expanded footer: contact + SMS disclosure (A2P compliance) Added 2026-05-21 for TCR Call-to-Action verification. ───────────────────────────────────────────────────────── */ .site-footer { text-align: left; padding: 28px 16px 16px; font-size: 0.88em; line-height: 1.6; } .site-footer .footer-grid { max-width: 680px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 32px; } .site-footer .footer-h { font-size: 0.95em; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: rgba(255, 255, 255, 0.95); margin-bottom: 8px; } .site-footer .footer-col p { margin-bottom: 6px; } .site-footer .footer-sms-fine-print { font-size: 0.82em; opacity: 0.78; line-height: 1.5; margin-top: 8px; } .site-footer .powered-by { text-align: center; margin-top: 20px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, 0.15); font-size: 0.78em; opacity: 0.55; } /* Stack columns on narrow viewports (mobile) */ @media (max-width: 560px) { .site-footer .footer-grid { grid-template-columns: 1fr; gap: 20px; } } /* ───────────────────────────────────────────────────────── Homepage "Text Us" section (optional, --with-landing) ───────────────────────────────────────────────────────── */ .text-us-section { background: var(--cream); border: 1px solid var(--border); border-radius: 8px; padding: 24px 20px; margin: 32px 0; text-align: center; } .text-us-section h2 { margin-bottom: 8px; } .text-us-section p { margin-bottom: 12px; } .text-us-section .sms-cta { display: inline-block; font-size: 1.3em; font-weight: 700; color: var(--terracotta); text-decoration: none; margin: 6px 0; } .text-us-section .sms-cta:hover { text-decoration: underline; } /* ───────────────────────────────────────────────────────── menu.html footer SMS disclosure (A2P compliance, BEM-styled) Added 2026-05-22 for TCR Call-to-Action verification. menu.html does NOT extend base.html — these styles target its standalone .footer / .footer__sms markup directly. ───────────────────────────────────────────────────────── */ .footer__sms { max-width: 720px; margin: 16px auto 0; padding: 16px 0; border-top: 1px solid rgba(255, 255, 255, 0.12); border-bottom: 1px solid rgba(255, 255, 255, 0.12); line-height: 1.6; } .footer__sms-h { font-size: 0.95em; font-weight: 700; letter-spacing: 0.5px; text-transform: uppercase; color: rgba(255, 255, 255, 0.95); margin-bottom: 8px; } .footer__sms p { font-size: 0.92em; margin-bottom: 6px; } .footer__sms a { color: rgba(255, 255, 255, 0.95); } .footer__sms-fine-print { font-size: 0.82em; opacity: 0.75; line-height: 1.5; margin-top: 6px; }