/* Theme Name: Websly Child — Rosita Construction Ltd Template: websly-parent Theme URI: https://websly.co.uk Author: Websly Description: Bespoke child theme for Rosita Construction Ltd (Notting Hill, W11), transplanted from the gallery-editorial design mirror at clients/rosita-london/design/Rosita/. White canvas, ink black and the logo's gold, Marcellus over Archivo, hairline rules, numbered index rows, museum plate captions, zero border radius. The design's own stylesheet and script ship byte-identical as assets/css/x-rosita.css and assets/js/child.js — this file carries only the theme header, the self-hosted webfonts, and the handful of declarations that stop the parent's own chrome and section wrapper from fighting the design. Version: 1.0.6 Requires at least: 6.4 Requires PHP: 8.0 License: GPL v2 or later License URI: https://www.gnu.org/licenses/gpl-2.0.html Text Domain: websly-child-rosita-london */ /* ============================================================ Self-hosted webfonts (D45-C.4, D17-P3: zero external origins at runtime). The design loads Marcellus + Archivo from the Google Fonts CDN; a live client site may not, so both are vendored as woff2 with the same subsets Google serves. Archivo ships as ONE variable file per subset covering the whole 100-900 axis — the CDN returns the identical file for weights 400/500/600/700, so it is declared with a weight RANGE, not four times. Acquisition + source URLs: vendor.md. ============================================================ */ @font-face { font-family: 'Archivo'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('assets/fonts/Archivo-Variable-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Archivo'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('assets/fonts/Archivo-Variable-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } @font-face { font-family: 'Marcellus'; font-style: normal; font-weight: 400; font-display: swap; src: url('assets/fonts/Marcellus-400-latin.woff2') format('woff2'); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; } @font-face { font-family: 'Marcellus'; font-style: normal; font-weight: 400; font-display: swap; src: url('assets/fonts/Marcellus-400-latin-ext.woff2') format('woff2'); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; } /* ============================================================ Parent-seam glue. Nothing aesthetic lives here — every visual decision is in assets/css/x-rosita.css, which is a byte-for- byte copy of the design's own stylesheet. These rules exist only because the parent theme wraps each section in its own
and ships a base stylesheet that would otherwise double the design's spacing. ============================================================ */ /* The parent's wrapper supplies `padding-block` and, more importantly, `position: relative` — the positioning context content-types' front-end "Edit this section" link is pinned to. Keep the class (and the link), drop the padding: .r-section brings its own. */ .websly-section { padding-block: 0; } /* The parent's skip link is the only piece of its chrome still rendering on this site (the header and footer are supplied by websly-chrome/). Give it the design's focus treatment rather than the platform's. */ .websly-skip-link:focus { outline: 2px solid var(--r-gold); outline-offset: 3px; } /* The design's
has no chrome of its own; the parent's .websly-main must not introduce any. */ .websly-main { margin: 0; padding: 0; max-width: none; } /* #page is a bare pass-through wrapper here — the fixed header and the sticky call bar both position against the viewport, not against it. */ .websly-page { overflow-x: clip; } /* ---------- Scroll-reveal safety net ---------- x-rosita.css hides every `.r-rise` element (`opacity: 0`) and reveals it when the script adds `.is-in`, with `.no-js .r-rise` as the escape hatch for a visitor with JavaScript blocked. That escape hatch is not enough here, and the reason is specific to the live site rather than the design mirror. On the mirror, rosita.js was the only script on the page and it removed `no-js` itself, so "no-js is gone" and "the reveal script is running" were the same fact. On WordPress the PARENT theme's main.js also removes `no-js` — so if child.js ever fails to load (a bad deploy, a cache miss, a JS error earlier in the page), `no-js` is removed, nothing ever adds `.is-in`, and every section on the site stays at opacity 0: a blank white page with a full and correct DOM underneath it. So the hidden state is scoped to a class only child.js sets. If that file does not run, this rule never engages and the site renders complete and unanimated — which is the failure mode a client's website should have. */ html:not(.r-js) .r-rise { opacity: 1 !important; transform: none !important; } /* ---------- Quote form glue ---------- The design mirror's form had no backend, so each field was written as `` and styled through `.r-field > span`. The live form posts to the platform's contact endpoint so every enquiry is stored as a lead and emailed, and the platform emits a slightly different — and more accessible — tree: `

`, with a real `for`/`id` association the design's version never had. These four rules give that tree the design's exact appearance. The inputs themselves already match: x-rosita.css styles them by element, not by class. */ .r-field > .r-field__label { display: block; margin-bottom: 8px; font-size: 11px; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--r-ink-40); } p.r-field { margin: 0 0 22px; } .r-form__note { margin-top: 14px; font-size: 13px; color: var(--r-ink-40); } .websly-form__error, .websly-form__success { margin-top: 14px; font-size: 14px; } /* Composer/admin surfaces render inside the page on an editor's session. Keep them legible against the design's own type scale rather than inheriting Marcellus into a WordPress UI string. */ .websly-ct-edit-section-link, .websly-ct-inline-toolbar { font-family: 'Archivo', system-ui, sans-serif; letter-spacing: 0; text-transform: none; }