:root {
  --infusion-bg: #F4F1EA;
  --infusion-surface: #FFFFFF;
  --infusion-surface-dark: #EBE7DE;
  --infusion-leaf: #3A6345;
  --infusion-earth: #8C6239;
  --infusion-ink: #2C3E2D;
  --infusion-gradient: linear-gradient(135deg, #4A7C59, #2D4A35);
  --infusion-radius: 16px;
  --infusion-shadow: 0 10px 15px -3px rgba(44, 62, 45, 0.1), 0 4px 6px -2px rgba(44, 62, 45, 0.05);
  
  --font-display: 'Oswald', sans-serif;
  --font-body: 'Lato', sans-serif;
}

body {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, .uppercase {
    text-transform: uppercase;
}

/* Gallery Interactivity (CSS Only) */
.slide { 
    opacity: 0; 
    z-index: 1; 
    transition: opacity 0.4s ease-in-out; 
}

#pic1:checked ~ .main-display .s-1,
#pic2:checked ~ .main-display .s-2,
#pic3:checked ~ .main-display .s-3,
#pic4:checked ~ .main-display .s-4 {
    opacity: 1;
    z-index: 10;
}

.t-lbl {
    display: block;
    border: 3px solid transparent;
    border-radius: 8px;
    overflow: hidden;
    cursor: pointer;
    background-color: var(--infusion-surface);
    transition: border-color 0.2s ease, transform 0.2s ease;
}

.t-lbl:hover {
    transform: scale(1.05);
}

.t-lbl img {
    width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    display: block;
}

#pic1:checked ~ .thumb-nav .thumb-1,
#pic2:checked ~ .thumb-nav .thumb-2,
#pic3:checked ~ .thumb-nav .thumb-3,
#pic4:checked ~ .thumb-nav .thumb-4 {
    border-color: var(--infusion-leaf);
}

/* Base utility for hiding radios visually but keeping them accessible if needed */
.hidden {
    display: none;
}