/* * CIZELE — shared enquiry dialog (.cze). Centered luxury modal, deep-plum surface to match the * browser's Refine drawer. Portaled to ; reduced-motion aware. No price anywhere. */ .cze[hidden] { display: none; } .cze { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; padding: 1.4rem; } .cze__scrim { position: absolute; inset: 0; background: rgba(20, 12, 16, .58); opacity: 0; transition: opacity .3s var(--e, ease); } .cze.is-open .cze__scrim { opacity: 1; } .cze__panel { position: relative; width: min(460px, 100%); background: var(--plum-deep, #2e1726); color: var(--ivory, #f7f3ed); border-radius: var(--r-xl, 22px); padding: clamp(1.8rem, 4vw, 2.6rem); box-shadow: 0 30px 80px rgba(20, 12, 16, .5); transform: translateY(14px) scale(.98); opacity: 0; transition: transform .34s var(--e2, cubic-bezier(.62, .05, .01, .99)), opacity .34s var(--e, ease); } .cze.is-open .cze__panel { transform: none; opacity: 1; } .cze__close { position: absolute; top: 1rem; right: 1rem; display: inline-flex; align-items: center; justify-content: center; width: 2.3rem; height: 2.3rem; background: transparent; border: 1px solid rgba(255, 255, 255, .22); border-radius: 50%; color: inherit; cursor: pointer; transition: border-color .25s var(--e, ease); } .cze__close:hover { border-color: var(--champ, #e7d6b6); } .cze__eyebrow { color: var(--champ, #e7d6b6); } .cze__title { font-family: var(--serif, Georgia, serif); font-size: clamp(1.6rem, 4vw, 2.1rem); line-height: 1.1; margin: .5rem 0 .3rem; } .cze__ctx { font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; color: var(--champ, #e7d6b6); margin: 0 0 .7rem; } .cze__say { color: rgba(247, 243, 237, .78); font-size: .95rem; line-height: 1.55; margin: 0 0 1.5rem; } .cze__actions { display: flex; flex-direction: column; gap: .7rem; } .cze__actions .cz-btn { width: 100%; justify-content: space-between; } /* WhatsApp action reads as the warm primary; email as the quiet secondary. */ .cze__wa.cz-btn--solid { background: #E7D6B6; } @media (prefers-reduced-motion: reduce) { .cze__scrim, .cze__panel { transition: none; } .cze__panel { transform: none; } } .cze__close:focus-visible, .cze__wa:focus-visible, .cze__email:focus-visible { outline: 2px solid var(--champ, #e7d6b6); outline-offset: 3px; }