/* ========================================================================
   coming-soon.css -- ScribeHold "launching soon" modal dialog

   Component layer of the modular CSS bundle. Consumes tokens from
   tokens.css. One instance lives in _Layout and is shared by every CTA
   whose destination is not live yet.

     .coming-soon           -- fixed overlay root (holds backdrop + panel)
     .coming-soon__backdrop -- click-to-dismiss scrim
     .coming-soon__panel    -- the dialog surface
     .coming-soon__title    -- dialog heading (labels the dialog)
     .coming-soon__body     -- paragraph copy
     .coming-soon__close    -- close control

   All color, type, spacing, radius, and motion values come from
   tokens.css. No hard-coded hex values in this file.

   Bundle order: tokens -> base -> layout -> components/* -> pages/*
   ======================================================================== */

.coming-soon {
    position: fixed;
    inset: 0;
    z-index: var(--z-modal);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-5);
}

.coming-soon[hidden] {
    display: none;
}

.coming-soon__backdrop {
    position: absolute;
    inset: 0;
    background: var(--color-ink);
    opacity: 0.5;
}

.coming-soon__panel {
    position: relative;
    width: 100%;
    max-width: var(--measure-narrow);
    padding: var(--space-6);
    border: 1px solid var(--color-border-strong);
    border-radius: var(--radius-md);
    background: var(--color-bg-parchment);
    color: var(--color-ink);
    box-shadow: var(--shadow-lg);
}

.coming-soon__title {
    margin-top: 0;
    margin-bottom: var(--space-4);
    font-size: var(--font-size-xl);
    line-height: var(--line-height-snug);
}

.coming-soon__body {
    margin: 0 0 var(--space-4);
    font-size: var(--font-size-md);
    line-height: var(--line-height-normal);
}

.coming-soon__close {
    margin-top: var(--space-2);
}