
:root {
  
  --color-primary:        #033F3C; 
  --color-primary-accent: #005450; 
  --color-primary-bright: #1C7672; 
  --color-filter-hover:   #064B47; 
  --color-green-dark:     #2C4C35; 
  --color-green:          #456952; 
  --color-green-muted:    #698364; 
  --color-green-pale:     #9EBB9A; 

  
  --color-bg:             #FFFFFF; 
  --color-cream:          #F3F1E7; 
  --color-cream-light:    #F8F6EE; 

  
  --color-gold:           #F0B95B; 
  --color-gold-muted:     #DEC280; 
  --color-gold-soft:      #E5C177; 
  --color-gold-deep:      #C8982E; 

  
  --color-berry:          #92223C; 
  --color-danger:         #C2453B; 
  --color-coral:          #E87F6F; 
  --color-orange:         #FF9A21; 
  --color-orange-hover:   #D9831C; 
  --color-blue:           #0094F5; 
  --color-primary-mid:    #135A53; 
  --color-primary-deep:   #076560; 
  --color-whatsapp:       #25D366;
  --color-whatsapp-hover: #1FB357; 
  
  --color-brand-fb:       #1877F2; 
  --color-brand-li:       #0A66C2; 
  --color-brand-ig:       #E4405F; 
  --color-green-bright:   #00D757; 
  --color-mist:           #EFF4F5; 

  
  --color-text:           #393939; 
  --color-text-strong:    #171717; 
  --color-text-secondary: #4A5552; 
  --color-text-muted:     #737373; 
  --color-text-soft:      rgba(0, 0, 0, 0.62); 
  --color-border:         #C6C7C7; 
  --color-border-soft:    #D4D4D4; 
  --color-border-light:   #DADCE0; 
  --color-border-pale:    #EDEFEE; 
  --color-border-cool:    #E2E7E5; 
  --color-border-faint:   #F0F0F0; 
  --color-border-subtle:  #ECECEC; 
  --color-border-dim:     rgba(198, 199, 199, 0.40); 
  --color-surface:        #F6F6F6; 
  --color-surface-light:  #F8F8F8; 
  --color-primary-pale:   #E5F0ED; 
  --color-white:          #FFFFFF;
  --color-white-92:       rgba(255, 255, 255, 0.92); 
  --color-white-outline:  rgba(255, 255, 255, 0.10); 

  
  --font-family-base: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;

  
  --space-3xs: 2px;
  --space-2xs: 4px;
  --space-xs:  8px;
  --space-sm:  12px;
  --space-md:  16px;
  --space-lg:  24px;
  --space-xl:  32px;
  --space-2xl: 48px;
  --space-3xl: 64px;

  
  --radius-xs:   4px;
  --radius-sm:   8px;
  --radius-md:   12px;
  --radius-lg:   16px; 
  --radius-xl:   20px; 
  --radius-full: 9999px;

  
  --gradient-green: linear-gradient(166deg, #456952 6%, #033F3C 94%); 
  --gradient-banner: linear-gradient(180deg, #135A53 0%, #033F3C 100%); 
  --gradient-filter-head: linear-gradient(90deg, #064B47 0%, rgba(7, 101, 96, 0.9) 100%); 
  --gradient-hero-page: linear-gradient(255deg, rgba(246, 246, 246, 0.4) 3%, #FFFFFF 83%); 
  --gradient-receipt: linear-gradient(90deg, #033F3C 0%, #1A5A50 100%); 
  
  --gradient-gold:      linear-gradient(135deg, #C9992F 0%, #FFF0C2 50%, #F0CE7E 100%); 
  --gradient-gold-edge: linear-gradient(135deg, #FFF0C2 0%, #F0CE7E 45%, #C9992F 100%); 

  
  --shadow-xs:      0 1px 2px 0 rgba(0, 0, 0, 0.05);
  --shadow-soft:    0 2px 12px 0 rgba(0, 0, 0, 0.06);          
  --shadow-btn:     0 2px 4px -2px rgba(0, 0, 0, 0.10),
                    0 4px 6px -1px rgba(0, 0, 0, 0.10);        
  --shadow-card:    0 2px 4px -2px rgba(0, 0, 0, 0.06),
                    0 4px 6px -1px rgba(0, 0, 0, 0.06);        
  --shadow-card-lg: 0 10px 26px 0 rgba(0, 31, 28, 0.09);       
  --shadow-icon:    0 1px 3px 0 rgba(200, 166, 89, 0.20),
                    0 4px 14px 0 rgba(222, 194, 128, 0.30);    
  --shadow-header:  0 2px 6px 0 rgba(0, 0, 0, 0.06);           
  --shadow-nav:     0 4px 16px 0 rgba(0, 31, 28, 0.12);        
  --shadow-btn-hover: 0 4px 3px 0 rgba(0, 0, 0, 0.10),
                      0 2px 2px 0 rgba(0, 0, 0, 0.10);         
  --shadow-card-hover: 0 4px 3px 0 rgba(0, 0, 0, 0.06),
                       0 2px 2px 0 rgba(0, 0, 0, 0.06);        
  --shadow-review:  0 4px 24px 0 rgba(0, 84, 80, 0.06);        
  --shadow-like:    0 4px 6px 0 rgba(118, 118, 118, 0.40),
                    0 2px 4px 0 rgba(0, 0, 0, 0.10);           
  --shadow-panel:   0 2px 8px 0 rgba(0, 31, 28, 0.05);         
  --shadow-menu:    0 8px 24px 0 rgba(0, 0, 0, 0.08);          
  --shadow-badge:   0 1px 1px rgba(0, 0, 0, 0.18);             

  
  --container-max: 1440px; 
  --container-pad: 72px;   
  
  --bleed-edge: max(0px, (100vw - var(--container-max)) / 2);
}
