/* ============================================================ COLOR CONFIGURATION — Godavari / Coastal Heritage Theme Theme: Warm Ivory / Sand dominant · Deep Palm Green & Golden Sunset Ochre accents Designed and Code written by Pusala Arun Kumar ✦ THIS is the ONLY file you change per restaurant. ✦ Load this BEFORE restaurant-core.css in your HTML. ============================================================ */ :root { /* ──────────────────────────────────── TYPOGRAPHY ──────────────────────────────────── */ --font-display: 'Cormorant Garamond', Georgia, serif; --font-body: 'DM Sans', system-ui, sans-serif; --font-label: 'DM Sans', system-ui, sans-serif; /* ──────────────────────────────────── LAYOUT TOKENS ──────────────────────────────────── */ --nav-h: 76px; --ease: cubic-bezier(0.16, 1, 0.3, 1); --ease-back: cubic-bezier(0.34, 1.56, 0.64, 1); /* ──────────────────────────────────── SHADOWS (deep green tint & warm sunset glow) ──────────────────────────────────── */ --shadow-xs: 0 1px 4px rgba(38, 56, 32, 0.06); --shadow-sm: 0 3px 14px rgba(38, 56, 32, 0.08); --shadow-md: 0 8px 32px rgba(38, 56, 32, 0.12); --shadow-lg: 0 20px 60px rgba(38, 56, 32, 0.16); --shadow-accent: 0 6px 24px rgba(206, 143, 44, 0.20); /* ════════════════════════════════════ ★ BRAND PALETTE ★ ════════════════════════════════════ */ /* ── PALM FOREST GREEN (used for CTAs, ribbon, hero badges & brand anchors) ─── */ --brand-green: #2A5934; /* ← lush coastal palm green from artwork */ --brand-green-mid: #346E41; /* ← slightly richer green highlight */ --brand-green-light: #4A8C5A; /* ← lighter herbal tint hover */ --brand-green-pale: #EEF5F0; /* ← faint coastal breeze sage tint */ --brand-green-mist: #F6FAF7; /* ← whisper tint */ --brand-green-dark: #183B20; /* ← deepest palm green (footer & CTA dark) */ /* ── SUNSET OCHRE / GOLDEN AMBER (used for secondary accents, icons, labels) ─── */ --brand-gold: #CE8F2C; /* ← warm golden amber extracted from the sun & boat */ --brand-gold-mid: #E0A13D; /* ← brighter radiant sun highlight */ --brand-gold-pale: #FDF7ED; /* ← faint warm sunset glow tint */ --brand-gold-deep: #A96F19; /* ← deeper bronze ochre for hover & contrast */ --brand-gold-dark: #7A4D0B; /* ← deepest roasted amber */ /* ── WARM IVORY / SAND FAMILY (dominant — 70%+ of page) ── */ --brand-beige: #FAF7F2; /* ← main page background, coastal warm ivory */ --brand-beige-light: #FFFFFF; /* ← pure white cards & panels */ --brand-beige-mid: #F3EDE2; /* ← alternating section background */ --brand-beige-deep: #E7DDCF; /* ← deeper warm sand section background */ --brand-beige-border: #DACDBA; /* ← delicate warm borders */ /* ──────────────────────────────────── BACKGROUNDS (warm ivory / soft sand dominant) ──────────────────────────────────── */ --color-bg: #FFFFFF; /* pure white — hero, cards */ --color-bg-off: #FAF7F2; /* warm ivory — alternating sections */ --color-bg-cream: #F3EDE2; /* deeper warm sand tint */ /* ──────────────────────────────────── TEXT (deep coastal dark — warm & readable) ──────────────────────────────────── */ --color-text-ink: #18261B; /* deep palm charcoal headings */ --color-text-body: #323F34; /* dark muted olive-gray body text */ --color-text-muted: #6B796E; /* mid slate-sage muted */ --color-text-faint: #9FAEA2; /* faint slate for labels */ /* Text on dark backgrounds */ --color-text-on-dark: #FAF7F2; --color-text-on-dark-muted: rgba(250, 247, 242, 0.70); --color-text-on-dark-faint: rgba(250, 247, 242, 0.40); /* ──────────────────────────────────── ACCENT COLORS ───────────────────────────────────── Sunset Gold = section labels, icons, underlines (warm radiance) Palm Green = CTA buttons, ribbon, badges (grounded & fresh) ──────────────────────────────────── */ --color-accent: var(--brand-gold-deep); /* nav underline, section labels */ --color-accent-deep: var(--brand-gold-dark); /* hover darken */ --color-accent-dark: var(--brand-green-dark); /* deep green on light badges */ /* Golden Ochre gradient — thin lines, underlines, left-border accents */ --color-accent-gradient: linear-gradient(135deg, #A96F19, #CE8F2C); --color-accent-gradient-soft: linear-gradient(135deg, #FDF7ED, #E0A13D); --color-accent-gradient-rich: linear-gradient(135deg, #7A4D0B, #A96F19, #CE8F2C); /* Palm Green gradient — CTA buttons, ribbon, promise section */ --color-green-gradient: linear-gradient(135deg, #183B20, #2A5934); --color-green-gradient-rich: linear-gradient(160deg, #102B16, #183B20, #2A5934); /* Brand signature — palm green to sunset gold */ --color-brand-gradient: linear-gradient(135deg, #2A5934, #CE8F2C); /* ──────────────────────────────────── BORDERS (warm sand with subtle gold/green accents) ──────────────────────────────────── */ --color-border-light: rgba(42, 89, 52, 0.08); /* default card borders */ --color-border: rgba(42, 89, 52, 0.18); /* stronger border */ --color-border-strong: rgba(42, 89, 52, 0.35); --color-border-accent: rgba(206, 143, 44, 0.38); /* golden ochre border */ --color-border-cream: rgba(42, 89, 52, 0.06); /* On dark sections */ --color-border-on-dark: rgba(250, 247, 242, 0.15); /* ──────────────────────────────────── HERO RADIAL GLOWS (sunset warmth & palm freshness) ──────────────────────────────────── */ --color-hero-glow-1: rgba(206, 143, 44, 0.08); /* faint sunset warmth */ --color-hero-glow-2: rgba(42, 89, 52, 0.06); /* faint palm depth */ --color-grid-line: rgba(42, 89, 52, 0.04); /* subtle warm grid */ /* ──────────────────────────────────── BADGE / OFFER BOX ──────────────────────────────────── */ --color-badge-bg: #F3EDE2; /* warm sand badge background */ --color-badge-green: var(--brand-green-pale); /* ──────────────────────────────────── PULSE RING (hero badge dot) ──────────────────────────────────── */ --color-pulse-ring: rgba(206, 143, 44, 0.30); /* ──────────────────────────────────── INK (dark) SURFACES ───────────────────────────────────── Ribbon → Palm Forest Green (#2A5934) Promise → Deep Coastal Green Ink (#183B20) CTA → Deep Forest Dark (#183B20) Footer → Deepest Riverbank Charcoal (#102214) ──────────────────────────────────── */ --color-ink: #183B20; /* deep palm green — promise section */ --color-on-ink: #FAF7F2; /* warm sand ivory text on dark */ --color-ink-mid: #234E2C; /* mid palm dark */ /* ──────────────────────────────────── INK SECTION GLOWS ──────────────────────────────────── */ --color-ink-glow-1: rgba(206, 143, 44, 0.14); /* faint sunset warmth on dark */ --color-ink-glow-2: rgba(42, 89, 52, 0.22); /* deep green shadow */ /* ──────────────────────────────────── RIBBON (palm forest green) ──────────────────────────────────── */ --color-ribbon-border: rgba(250, 247, 242, 0.15); --color-ribbon-text: #FAF7F2; /* ──────────────────────────────────── FOOTER (deepest riverbank dark) ──────────────────────────────────── */ --color-footer-bg: #102214; /* deep riverbank charcoal — calm & rich */ } /* ════════════════════════════════════════════════════════════ SECTION OVERRIDES Navbar CTA button, Ribbon, and CTA section flip to Palm Green (#2A5934). Sunset Ochre (#CE8F2C) accents secondary labels, borders, and rings. ════════════════════════════════════════════════════════════ */ /* Navbar CTA button → palm forest green */ .btn-nav-order { background: var(--brand-green) !important; color: #FFFFFF !important; } .btn-nav-order::before { background: linear-gradient(135deg, #183B20, #2A5934) !important; } /* Ribbon → palm forest green */ .ribbon { background: var(--brand-green) !important; color: #FFFFFF !important; border-top-color: rgba(250, 247, 242, 0.15) !important; border-bottom-color: rgba(250, 247, 242, 0.15) !important; } /* CTA section → deep palm forest green */ .cta-section { background: var(--brand-green-dark) !important; } /* Promise section → deep palm green ink (--color-ink set above) */ /* Why, Menu, Testimonials, Hero → warm ivory / coastal sand ✓ */