:root {
  --visine-bg: #f0fdfa; /* Light teal/mint background, health theme */
  --visine-surface: #ffffff;
  --visine-tone: #0d9488; /* Strong teal accent */
  --visine-tone-hover: #0f766e;
  --visine-ink: #1e293b;
  --visine-gradient: linear-gradient(135deg, #ccfbf1 0%, #f0fdfa 100%);
  --font-display: 'Oswald', sans-serif;
  --font-body: 'Inter', sans-serif;
}

/* Gallery Logic */
.visine-slide {
    opacity: 0;
    z-index: 1;
}

#visine-pic-1:checked ~ .visine-main-pic-box .visine-slide-1,
#visine-pic-2:checked ~ .visine-main-pic-box .visine-slide-2,
#visine-pic-3:checked ~ .visine-main-pic-box .visine-slide-3,
#visine-pic-4:checked ~ .visine-main-pic-box .visine-slide-4 {
    opacity: 1;
    z-index: 10;
}

.visine-thumb-label {
    border: 2px solid transparent;
    transition: border-color 0.2s ease, transform 0.2s ease;
    border-radius: 8px; /* Soft radius for thumbnails */
}

#visine-pic-1:checked ~ .visine-thumb-row label[for="visine-pic-1"],
#visine-pic-2:checked ~ .visine-thumb-row label[for="visine-pic-2"],
#visine-pic-3:checked ~ .visine-thumb-row label[for="visine-pic-3"],
#visine-pic-4:checked ~ .visine-thumb-row label[for="visine-pic-4"] {
    border-color: var(--visine-tone);
    transform: scale(1.05);
}

/* Preset A Specifics */

/* Header: accent bar bottom */
.visine-top-banner {
    border-bottom: 4px solid var(--visine-tone);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05);
}

/* CTA: pill shape (999px) + hover shadow (raised shadow depth base) */
.visine-purchase-trigger {
    border-radius: 999px; /* Pill */
    box-shadow: 0 4px 6px -1px rgba(13, 148, 136, 0.3), 0 2px 4px -1px rgba(13, 148, 136, 0.2);
}

.visine-purchase-trigger:hover {
    background-color: var(--visine-tone-hover) !important;
    box-shadow: 0 10px 15px -3px rgba(13, 148, 136, 0.4), 0 4px 6px -2px rgba(13, 148, 136, 0.2);
    transform: translateY(-2px);
}

/* Reviews: left colored border 4px */
.visine-buyer-comment {
    border-left: 4px solid var(--visine-tone);
    border-radius: 0 12px 12px 0; /* Soft radius on other corners */
    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06); /* Raised depth */
}

/* Global specific resets based on theme */
.visine-content-hub::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 400px;
    background: var(--visine-gradient);
    z-index: -1;
    clip-path: polygon(0 0, 100% 0, 100% 80%, 0 100%);
}

.visine-page-body {
    position: relative;
    overflow-x: hidden;
}