:root {
    /* Theme: SOFT */
    --osteo-base-bg: #F7F7F7;
    --osteo-surface: #FFFFFF;
    --osteo-accent-soft: #A3D9C9; /* Pastel mint accent */
    --osteo-text-main: #333333;
    --osteo-text-muted: #555555;
    
    /* Random Parameters */
    --font-display: 'Montserrat', sans-serif;
    --font-body: 'Lato', sans-serif;
    --osteo-radius: 3px; /* sharp */
    --osteo-shadow-raised: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05); /* raised */
}

/* Gallery Logic */
.osteo-slide {
    display: none;
    transition: opacity 0.3s ease;
}

#osteo-pic-1:checked ~ .osteo-view-area .osteo-slide-1,
#osteo-pic-2:checked ~ .osteo-view-area .osteo-slide-2,
#osteo-pic-3:checked ~ .osteo-view-area .osteo-slide-3,
#osteo-pic-4:checked ~ .osteo-view-area .osteo-slide-4 {
    display: block;
    animation: fadeIn 0.4s ease-in-out;
}

@keyframes fadeIn {
    from { opacity: 0.5; }
    to { opacity: 1; }
}

/* Thumbnails Active State visually hinted, though not strict without JS, we use opacity */
.osteo-thumb-label img {
    opacity: 0.6;
    transition: opacity 0.2s ease, transform 0.2s ease;
    border: 1px solid transparent;
}

.osteo-thumb-label:hover img {
    opacity: 0.9;
    transform: scale(1.05);
}

#osteo-pic-1:checked ~ .osteo-thumb-col label[for="osteo-pic-1"] img,
#osteo-pic-2:checked ~ .osteo-thumb-col label[for="osteo-pic-2"] img,
#osteo-pic-3:checked ~ .osteo-thumb-col label[for="osteo-pic-3"] img,
#osteo-pic-4:checked ~ .osteo-thumb-col label[for="osteo-pic-4"] img {
    opacity: 1;
    border-color: #A3D9C9;
}

/* CTA Styles Preset D */
.osteo-purchase-link {
    display: block;
    width: 100%;
    padding: 1.25rem 2rem;
    text-decoration: none;
    box-shadow: none; /* Wide, no shadow */
}

.osteo-purchase-link:hover {
    text-decoration: underline;
    opacity: 0.95;
}

/* Base Typography tweaks */
h1, h2, h3, h4, h5, h6 {
    text-transform: uppercase; /* Enforced by parameter */
}