#clarity-details { box-sizing:border-box; width:min(640px,calc(100% - 32px)); max-height:calc(100dvh - 32px); margin:auto; padding:52px; border:1px solid #b39a67; border-radius:4px; background:#f7f5ee; color:#30332e; box-shadow:0 28px 100px #001c1770; overflow:auto; }
#clarity-details::backdrop { background:#082f29b8; backdrop-filter:blur(6px); }
#clarity-details .clarity-close { position:absolute; top:14px; right:14px; width:44px; height:44px; border:1px solid #b39a67; border-radius:50%; background:transparent; color:#163e34; font:28px/1 Arial,sans-serif; cursor:pointer; }
#clarity-details .clarity-kicker { margin:0 40px 24px 0; color:#8d703e; font-size:11px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }
#clarity-details h2 { margin:0 0 24px; padding-bottom:24px; border-bottom:1px solid #c9b891; font-family:var(--font-serif,Georgia,serif); font-size:clamp(30px,4vw,42px); font-weight:400; line-height:1.15; color:#123f34; }
#clarity-details .clarity-description { margin:0; font-size:18px; line-height:1.8; }
#clarity-details button:focus-visible { outline:3px solid #92723e; outline-offset:4px; }
body.clarity-dialog-open { overflow:hidden; }
@media(max-width:600px){#clarity-details{padding:60px 26px 32px;}#clarity-details .clarity-description{font-size:17px;}}