:root {
    /* Theme: HEALTH (Clean, fresh green/teal accent, light background) */
    --cnmn-bg: #f0fdf4; /* Tailwind Green 50 */
    --cnmn-surface: #ffffff;
    --cnmn-tone: #10b981; /* Tailwind Emerald 500 */
    --cnmn-tone-hover: #059669; /* Tailwind Emerald 600 */
    --cnmn-ink: #1e293b; /* Slate 800 */
    --cnmn-ink-light: #475569; /* Slate 600 */
    
    /* Random Parameters Chosen */
    --font-display: 'Oswald', sans-serif;
    --font-body: 'Lato', sans-serif;
    --cnmn-radius: 16px; /* soft */
    --cnmn-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* raised */
}

/* Base resets & typography */
body {
    margin: 0;
    padding: 0;
    -webkit-font-smoothing: antialiased;
}

/* Preset C: Header Logo */
.cinnamon-logo-char {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    font-size: 28px;
    line-height: 1;
}

/* Gallery Logic (No JS) */
.cinnamon-slide-item {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.4s ease-in-out;
    z-index: 1;
}

#pic1:checked ~ .cinnamon-view-frame .slide1,
#pic2:checked ~ .cinnamon-view-frame .slide2,
#pic3:checked ~ .cinnamon-view-frame .slide3,
#pic4:checked ~ .cinnamon-view-frame .slide4 {
    opacity: 1;
    visibility: visible;
    z-index: 10;
}

/* Preset C Thumbnail Logic */
.cinnamon-thumb-trigger {
    opacity: 0.5;
    transition: all 0.2s ease;
    cursor: pointer;
    border: 2px solid transparent;
}

.cinnamon-thumb-trigger:hover {
    opacity: 0.8;
}

#pic1:checked ~ .cinnamon-thumb-row [for="pic1"],
#pic2:checked ~ .cinnamon-thumb-row [for="pic2"],
#pic3:checked ~ .cinnamon-thumb-row [for="pic3"],
#pic4:checked ~ .cinnamon-thumb-row [for="pic4"] {
    opacity: 1;
    border-color: var(--cnmn-tone);
    box-shadow: 0 0 0 1px var(--cnmn-tone);
}

/* Preset C: CTA Button */
.cinnamon-action-btn {
    border-left: 6px solid var(--cnmn-tone-hover);
    border-radius: 4px 12px 12px 4px;
    box-shadow: var(--cnmn-shadow);
}

.cinnamon-action-btn:hover {
    background-color: var(--cnmn-tone-hover) !important;
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

/* Preset C: Reviews */
.cinnamon-buyer-note {
    transition: transform 0.2s ease;
}
.cinnamon-buyer-note:hover {
    transform: translateY(-2px);
}