/*
Theme Name:   Quorvex
Theme URI:    https://quorvexbio.com
Description:  Child theme for Quorvex. Holds the design system, patterns and custom behaviour for the Quorvex homepage rebuild. Built on Twenty Twenty-Five so that parent updates never overwrite this work. The palette below is intentionally minimal: only the three fixed logo colours are set, because the rest of the design system depends on which direction the client approves.
Author:       Claire
Template:     twentytwentyfive
Version:      0.1.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
Text Domain:  quorvex
*/

/* ─────────────────────────────────────────────────────────────
   Almost nothing belongs in this file.

   In a block theme the design system lives in theme.json, and
   layout lives in patterns and templates. Only put CSS here when
   theme.json genuinely cannot express it, which is rarer than it
   sounds. Anything you add here is invisible to the Site Editor,
   so the client will not be able to change it themselves. That is
   the opposite of the goal.
   ───────────────────────────────────────────────────────────── */

/* ── qv-arch ───────────────────────────────────────────────────
   The arched media shape from the D5 mockup: semicircular top,
   straight sides, square bottom.

   The block editor's border-radius control only does all four
   corners at once, so this is one of the few things theme.json
   genuinely cannot express.

   HOW TO USE
   Select an Image, Cover or Group block, open the Settings tab in
   the right sidebar, scroll to "Advanced", and type  qv-arch  into
   ADDITIONAL CSS CLASS(ES).

   The 999em radius is intentional. When top corners exceed the
   element's width the browser scales them down proportionally, so
   the arch stays a true semicircle at any size, with no fixed
   pixel value to maintain.
   ────────────────────────────────────────────────────────────── */
.qv-arch img,
.qv-arch .wp-block-cover__image-background{
  border-radius:999em 999em 0 0;
  display:block;
}
.qv-arch.wp-block-image,
.qv-arch.wp-block-cover,
.qv-arch.wp-block-group{
  border-radius:999em 999em 0 0;
  overflow:hidden;
}

/* Placeholder frames, used wherever real photography is still
   missing. Add  qv-placeholder  as an Additional CSS class on an
   empty Group, and combine with qv-arch for the arched version.
   Replace all of these with real images before launch. */
.qv-placeholder{
  display:flex; align-items:center; justify-content:center;
  min-height:260px; padding:12px; text-align:center;
  background:var(--wp--preset--color--section-blue,#D1E8F0);
  border:1px dashed var(--wp--preset--color--border-strong,#748686);
  color:var(--wp--preset--color--ink-muted,#4A5568);
  font-size:11px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
}
