/* =============================================
   DØVIKEN HAGE & VANN — graphics.css
   Farger, skygger og visuelle elementer
   ============================================= */

:root {

  /* ----- FARGEPALETT ----- */

  /* Grønt — natur, hage */
  --color-green-dark:   #2C4A2E; /* Dyp skoggrønn — primærfarge */
  --color-green-mid:    #4A7C59; /* Middels grønn — knapper, aksenter */
  --color-green-light:  #A8C5A0; /* Lys grønn — hover, bakgrunner */
  --color-green-pale:   #EAF2E8; /* Veldig lys grønn — seksjonsbakgrunn */

  /* Brunt/jord — stein, vann, natur */
  --color-earth-dark:   #5C3D2E; /* Mørk jord — kontrast */
  --color-earth-mid:    #8B6355; /* Varm brun — detaljer */
  --color-earth-light:  #D4B8A8; /* Sandbeige — myke flater */

  /* Blått — vann, dammer */
  --color-water:        #4A7FA5; /* Vannblå — aksent for vann-tjenester */
  --color-water-light:  #D6EAF5; /* Lys vannblå — bakgrunner */

  /* Nøytrale */
  --color-white:        #FFFFFF;
  --color-off-white:    #F8F6F2; /* Varm hvit — sidebakgrunn */
  --color-text:         #1E2A1F; /* Nesten svart grønn — all tekst */
  --color-text-muted:   #6B7C6D; /* Dempet grønn-grå — undertekst */
  --color-border:       #D5E0D3; /* Lys grønn — skillelinjer */

  /* ----- SKYGGER ----- */
  --shadow-sm:  0 1px 3px rgba(44, 74, 46, 0.08);
  --shadow-md:  0 4px 16px rgba(44, 74, 46, 0.12);
  --shadow-lg:  0 8px 32px rgba(44, 74, 46, 0.16);

  /* ----- KANTRADIUS ----- */
  --radius-sm:  4px;
  --radius-md:  8px;
  --radius-lg:  16px;
  --radius-full: 9999px;

  /* ----- OVERGANGER ----- */
  --transition-fast:   150ms ease;
  --transition-normal: 250ms ease;

  /* ----- SPACING ----- */
  --space-xs:  0.5rem;
  --space-sm:  1rem;
  --space-md:  2rem;
  --space-lg:  4rem;
  --space-xl:  8rem;

  /* ----- DEKORATIVT ----- */

  /* Bladmønster som SVG-bakgrunn (enkel stilisert stilk) */
  --graphic-leaf: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='60' viewBox='0 0 60 60'%3E%3Cpath d='M30 55 C15 40 5 25 10 10 C20 5 40 10 50 25 C45 42 35 52 30 55Z' fill='none' stroke='%234A7C59' stroke-width='1' opacity='0.15'/%3E%3C/svg%3E");
}