﻿/* Purple and gold homepage trial campaign. */
.trial-offer { display: grid; grid-template-columns: minmax(0, 1fr) 110px; align-items: center; gap: 18px; margin: 24px 0; padding: 28px; border: 1px solid rgba(251,191,36,.65); border-radius: 22px; background: linear-gradient(125deg,#4C1D95,#7C3AED); color: #fff; box-shadow: 0 18px 40px rgba(76,29,149,.25),0 0 22px rgba(251,191,36,.16); }
.trial-offer-copy { min-width: 0; }
.trial-offer-label { display: inline-block; padding: 7px 12px; border: 1px solid #FBBF24; border-radius: 999px; background: #FBBF24; color: #4C1D95; font-size: .7rem; font-weight: 800; letter-spacing: .12em; box-shadow: 0 0 20px rgba(251,191,36,.35); }
.trial-offer h2 { margin: 14px 0 10px; color: #fff; font-size: clamp(2rem,3.5vw,3rem); font-weight: 800; line-height: 1.08; letter-spacing: -.04em; }
.trial-offer p { margin: 0 0 18px; font-size: .875rem; line-height: 1.7; color: #fff; }
.trial-offer .btn, .trial-dialog .btn { min-height: 50px; background: #FBBF24; border: 1px solid #FBBF24; color: #4C1D95; font-weight: 700; box-shadow: 0 8px 22px rgba(251,191,36,.22); }
.trial-offer .btn:hover, .trial-dialog .btn:hover { background: #fcd34d; border-color: #fcd34d; color: #4C1D95; }
.trial-offer-art { position: relative; display: grid; place-items: center; min-height: 140px; color: #FBBF24; }
.trial-gift { width: 100px; height: 100px; filter: drop-shadow(0 0 16px rgba(251,191,36,.5)); }
.trial-sparkle { position: absolute; font-size: 24px; animation: trial-sparkle 3.5s ease-in-out infinite; }
.trial-sparkle-one { top: 0; right: 0; }
.trial-sparkle-two { bottom: 0; left: 0; animation-delay: 1.2s; }
.trial-sparkle-three { top: 20px; left: 0; font-size: 14px; animation-delay: 2.3s; }
.trial-sparkle-three svg { width: 14px; height: 14px; }
.trial-launcher { position: fixed; left: 24px; bottom: max(88px, calc(env(safe-area-inset-bottom) + 88px)); z-index: 1000; width: 60px; height: 60px; border: 2px solid #FBBF24; border-radius: 50%; background: linear-gradient(135deg,#4C1D95,#7C3AED); color: #FBBF24; display: grid; place-items: center; cursor: pointer; box-shadow: 0 8px 24px rgba(76,29,149,.3),0 0 18px rgba(251,191,36,.3); animation: trial-pulse 4s ease-in-out infinite; }
.trial-launcher[hidden] { display: none; }
.trial-launcher svg { width: 28px; height: 28px; }
.trial-launcher-label { position: absolute; top: -7px; right: -9px; padding: 3px 6px; border-radius: 8px; background: #FBBF24; color: #4C1D95; font-size: .6rem; font-weight: 800; letter-spacing: .04em; }
.trial-tooltip { position: absolute; left: 0; bottom: 74px; width: max-content; padding: 8px 12px; border-radius: 8px; background: #4C1D95; color: white; font-size: .75rem; opacity: 0; visibility: hidden; transition: opacity .2s; pointer-events: none; }
.trial-launcher:hover .trial-tooltip, .trial-launcher:focus-visible .trial-tooltip { opacity: 1; visibility: visible; }
.trial-dialog { margin: auto; width: min(560px, calc(100% - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid rgba(251,191,36,.6); border-radius: 22px; background: #4C1D95; color: #fff; box-shadow: 0 24px 80px rgba(76,29,149,.4),0 0 24px rgba(251,191,36,.15); overflow-y: auto; overscroll-behavior: contain; }
.trial-dialog::backdrop { background: rgba(28,12,55,.74); backdrop-filter: blur(5px); }
.trial-dialog-header { padding: 32px 32px 24px; background: linear-gradient(125deg,#4C1D95,#7C3AED); text-align: center; }
.trial-dialog-header .trial-gift { display: block; width: 76px; height: 76px; margin: 0 auto 18px; color: #FBBF24; }
.trial-dialog h2 { margin: 16px 0 12px; font-size: clamp(1.65rem,4vw,2.2rem); font-weight: 800; line-height: 1.2; color: #fff; }
.trial-dialog-description { color: #fff; font-size: .9375rem; line-height: 1.6; }
.trial-dialog-content { padding: 8px 32px 32px; }
.trial-close { position: absolute; top: 12px; right: 12px; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(251,191,36,.6); border-radius: 50%; background: #4C1D95; color: #fff; cursor: pointer; }
.trial-close svg { width: 20px; height: 20px; }
.trial-features { list-style: none; margin: 20px 0 24px; padding: 0; }
.trial-features li { display: flex; gap: 12px; align-items: flex-start; margin: 12px 0; font-size: .9375rem; line-height: 1.6; color: #fff; }
.trial-features svg { flex: 0 0 20px; width: 20px; height: 20px; margin-top: 2px; color: #FBBF24; }
.trial-dialog .btn { width: 100%; }
.trial-launcher:focus-visible, .trial-close:focus-visible, .trial-offer .btn:focus-visible, .trial-dialog .btn:focus-visible { outline: 3px solid #FBBF24; outline-offset: 4px; }
body:has(.trial-dialog[open]) .site-whatsapp, body:has(.trial-dialog[open]) .assessment-popup, body:has(.is-menu-open) .trial-launcher, body:has(.assessment-modal[style*="flex"]) .trial-launcher { display: none !important; }
@keyframes trial-pulse { 0%,100% { box-shadow: 0 8px 24px rgba(76,29,149,.3),0 0 18px rgba(251,191,36,.25); } 50% { box-shadow: 0 8px 24px rgba(76,29,149,.3),0 0 25px rgba(251,191,36,.45),0 0 0 6px rgba(251,191,36,.08); } }
@keyframes trial-sparkle { 0%,100% { opacity: .4; transform: scale(.85) rotate(0deg); } 50% { opacity: 1; transform: scale(1.15) rotate(15deg); } }
@media (max-width: 600px) { .trial-offer { grid-template-columns: 1fr; padding: 24px 20px; text-align: center; gap: 8px; } .trial-offer-art { grid-row: 1; min-height: 100px; width: 130px; margin: 0 auto; } .trial-offer-art .trial-gift { width: 76px; height: 76px; } .trial-offer h2 { font-size: 2.1rem; } .trial-offer .btn { width: 100%; } .trial-launcher { left: 16px; bottom: max(80px, calc(env(safe-area-inset-bottom) + 80px)); width: 52px; height: 52px; } .trial-dialog-header { padding: 24px 20px 20px; } .trial-dialog-content { padding: 4px 20px 24px; } }
@media (prefers-reduced-motion: reduce) { .trial-launcher,.trial-sparkle { animation: none; } .trial-tooltip { transition: none; } }

.trial-offer-pricing { grid-template-columns: minmax(0, 1fr); }

/* The card CTA provides trial access without a floating overlay on phones. */
@media (max-width: 600px) { .trial-launcher { display: none; } }

body.trial-card-in-view .site-whatsapp { display: none !important; }
