/* ════════════════════════════════════════════════════════════════════
   THE REQUEST PAGES — /pacchetto-…/ — 2026-08-21, second pass.

   ⚠ THIS FILE USED TO BE THE SECOND VISUAL LANGUAGE IN THE SITE. It carried
   its own palette (`--pr-ink`, `--pr-panel`, `--pr-accent`), its own ground,
   its own type, its own buttons and its own form: WHITE email-style panels on
   a navy splash, with a deeper pink than the rest of the site because that
   pink had to be read on white. Every one of those was a copy of a decision
   made somewhere else, drifting on its own.

   Nicolas: *"the form I find it horrible really, it's really off when compared
   to the rest of the site... the white background does a lot to make it
   uncomfortable too. Everything more tiley once again, more sober, and way
   more clear."*

   So it is gone, and nothing replaced it: THE GROUND, THE TYPE, THE BAND, THE
   BUTTON and THE FIELD are all `home/css/house.css`, which this shell loads
   first. `--pr-accent` no longer exists — there is one pink in this site and
   it is `--act`.

   WHAT IS LEFT HERE is only what is true of a REQUEST page and of nothing
   else: how the page stacks, the product's own wordmark, the full-screen
   "we are sending" overlay, and the received badge. 320 lines became 90.
   ════════════════════════════════════════════════════════════════════ */

/* The page. The ground, the type and the vignette come from the house — this
   is layout only. There is no top bar to clear any more (that padding outlived
   the bar by months); the bottom room is for the launcher, which is a 6rem
   circle sitting in the bottom-left corner of every page in the site. */
.pr-body {
    min-height: 100vh;
    padding: 0 0 clamp(6rem, 14vw, 9rem);
}
.pr-wrap { width: 100%; }

/* The footer of a request page is deliberately not the site's footer: no
   newsletter, no destinations. Somebody halfway through a form is not being
   asked for a second thing. */
.pr-foot {
    max-width: 52rem;
    margin: clamp(2.6rem, 6vw, 4rem) auto 0;
    padding: 1.5rem clamp(1rem, 4vw, 2rem) 0;
    border-top: 1px solid var(--border-soft);
    text-align: center;
    font-size: 0.78rem;
    font-weight: 300;
    line-height: 1.8;
    color: var(--text-muted);
}
.pr-foot a { color: var(--text-secondary); text-decoration: none; border-bottom: 1px solid rgb(var(--note-rgb) / 0.4); }
.pr-foot a:hover { color: var(--text-primary); border-bottom-color: var(--note); }

/* The product's own wordmark, on the three product request pages. It is the
   only place a per-product mark appears on a request page, and it is the mark
   ONLY — never a lockup, never a tagline. */
.pr-mark { display: block; margin: 0 auto 1.2rem; }

/* ── "We are sending" ─────────────────────────────────────────────────
   Invia is a full-page POST that uploads the materials and processes them for
   a few seconds. Without this the page looks frozen and people press again. */
.pr-splash {
    position: fixed; inset: 0; z-index: 9999;
    display: none; flex-direction: column; align-items: center; justify-content: center;
    gap: 1.4rem; padding: 1.5rem;
    background-color: var(--bg-base);
    background-image: radial-gradient(1200px 720px at 50% 40%, #1a2030 0%, #0c0e13 64%);
    opacity: 0; transition: opacity 0.2s ease;
}
.pr-splash.is-open { display: flex; opacity: 1; }
.pr-splash-logo {
    width: 150px; height: auto; display: block;
    filter: drop-shadow(0 8px 26px rgba(0,0,0,0.45));
    animation: pr-dust 1.4s ease-in-out infinite alternate;
}
@keyframes pr-dust {
    0%   { clip-path: inset(0 100% 0 0); opacity: 0.3; }
    100% { clip-path: inset(0 0% 0 0);   opacity: 1; }
}
.pr-splash-msg { margin: 0; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.02em; color: var(--text-secondary); }
.pr-splash-msg::after { content: ''; animation: pr-splash-dots 1.4s steps(1,end) infinite; }
@keyframes pr-splash-dots {
    0%,20% { content: ''; } 40% { content: '.'; } 60% { content: '..'; } 80%,100% { content: '...'; }
}
@media (prefers-reduced-motion: reduce) {
    .pr-splash-logo { animation: none; }
    .pr-splash-msg::after { animation: none; content: '...'; }
}

/* ── Received ─────────────────────────────────────────────────────────
   The one tick in the site. It wears the ACTION's pink because it is the
   answer to the action that was just taken. */
.pr-done { text-align: center; }
.pr-done-badge {
    display: inline-flex; width: 3.4rem; height: 3.4rem;
    align-items: center; justify-content: center;
    border-radius: 50%;
    margin-bottom: 1.1rem;
    color: var(--act-ink); background: var(--act);
}
.pr-done-badge svg { width: 1.6rem; height: 1.6rem; }