/*
 * RapidClad CSS layer for Avada Classic (child theme).
 *
 * How it works: build the page with normal Avada Builder elements, then put the rc-* class in each
 * element's "CSS Class" field (see wordpress/page-build-sheet.md). Avada puts that class on the
 * element's outer wrapper, so most rules target "wrapper class + Avada's inner markup".
 * Selectors that depend on Avada's internal markup are marked [avada-markup]; if an Avada update
 * changes its markup, those are the lines to check.
 *
 * Breakpoints follow Avada's defaults: small ≤ 640px, medium 641–1024px, large > 1024px.
 * Values come from the Astro build's tokens.css (docs/build-spec.md §2).
 */

/* ------------------------------------------------------------------ Tokens */
:root {
  --rc-black: #000000;
  --rc-charcoal: #232629;
  --rc-ink: #1a1c1e;
  --rc-grey: #656668;
  --rc-copper: #9c583b;
  --rc-copper-deep: #7e4430;
  --rc-copper-light: #c98b6b;
  --rc-white: #ffffff;
  --rc-limewash: #faf8f5;
  --rc-stone-50: #f2eee7;
  --rc-stone-100: #e6e3dd;
  --rc-stone-200: #d9d2c5;
  --rc-stone-300: #c9c3b8;
  --rc-grey-on-dark: #a9abad;
  --rc-error: #b3261e;
  --rc-success: #2e6b45;
  --rc-input-border: #7c7d80;

  --rc-font-display: "Cinzel", "Cinzel Fallback", "Times New Roman", serif;
  --rc-font-body: "Cardo", "Iowan Old Style", "Palatino Linotype", Palatino, Georgia, serif;

  --rc-fs-display: clamp(2.125rem, 1.5833rem + 2.4074vw, 3.75rem); /* 34 → 60px */
  --rc-fs-h2: clamp(1.75rem, 1.4167rem + 1.4815vw, 2.75rem);       /* 28 → 44px */
  --rc-fs-h3: clamp(1.125rem, 1.0625rem + 0.2778vw, 1.3125rem);    /* 18 → 21px */
  --rc-fs-numeral: clamp(2.5rem, 2.1667rem + 1.4815vw, 3.5rem);    /* 40 → 56px */
  --rc-fs-eyebrow: clamp(0.8125rem, 0.7917rem + 0.0926vw, 0.875rem); /* 13 → 14px */
  --rc-fs-button: clamp(0.875rem, 0.8542rem + 0.0926vw, 0.9375rem);  /* 14 → 15px */
  --rc-fs-lead: clamp(1.25rem, 1.1875rem + 0.2778vw, 1.4375rem);   /* 20 → 23px */
  --rc-fs-body: clamp(1.0625rem, 1.0417rem + 0.0926vw, 1.125rem);  /* 17 → 18px */
  --rc-fs-small: clamp(0.9375rem, 0.9167rem + 0.0926vw, 1rem);     /* 15 → 16px */

  --rc-section-y: clamp(3.5rem, 2.3333rem + 5.1852vw, 7rem);       /* 56 → 112px */
  --rc-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ------------------------------------------------------------------ Base typography (site-wide) */
body {
  font-family: var(--rc-font-body);
  font-size: var(--rc-fs-body);
  line-height: 1.65;
  color: var(--rc-charcoal);
  background: var(--rc-limewash);
  font-kerning: normal;
  font-synthesis: none;
}
body p { text-wrap: pretty; }

/* Headings: Cinzel, uppercase, tracked. Author them in sentence case; CSS sets the caps. */
body h1, body h2, body h3,
body .fusion-title-heading { /* [avada-markup] Title element heading */
  font-family: var(--rc-font-display);
  text-transform: uppercase;
  text-wrap: balance;
  color: inherit;
}
body h1 { font-size: var(--rc-fs-display); font-weight: 400; line-height: 1.08; letter-spacing: 0.03em; }
body h2 { font-size: var(--rc-fs-h2); font-weight: 400; line-height: 1.15; letter-spacing: 0.05em; }
body h3 { font-size: var(--rc-fs-h3); font-weight: 600; line-height: 1.3; letter-spacing: 0.08em; }

body a { color: inherit; text-decoration-color: var(--rc-copper); text-underline-offset: 0.22em; }
body a:hover { color: var(--rc-copper); }

/* Square corners everywhere (brand rule). */
.fusion-button, .fusion-imageframe, .fusion-imageframe img,
.fusion-form input, .fusion-form textarea, .fusion-form select { border-radius: 0 !important; }

/* Focus: copper on light, copper-light on dark, white over the hero. */
:focus-visible { outline: 2px solid var(--rc-copper); outline-offset: 3px; }
.rc-band--charcoal :focus-visible, .rc-footer :focus-visible { outline-color: var(--rc-copper-light); }
.rc-hero :focus-visible { outline-color: var(--rc-white); }

/* ------------------------------------------------------------------ Section bands (Containers) */
.rc-section { padding-top: var(--rc-section-y) !important; padding-bottom: var(--rc-section-y) !important; }
.rc-band--limewash { background-color: var(--rc-limewash) !important; }
.rc-band--stone { background-color: var(--rc-stone-50) !important; }
.rc-band--charcoal { background-color: var(--rc-charcoal) !important; color: var(--rc-stone-50); }
.rc-band--charcoal h2, .rc-band--charcoal h3, .rc-band--charcoal .fusion-title-heading { color: var(--rc-stone-50); }
.rc-band--charcoal p { color: var(--rc-stone-300); }

/* Copper hairline across the top of a container (Stone UK strip, footer). */
.rc-stoneuk .fusion-row, .rc-footer { border-top: 1px solid var(--rc-copper); }
.rc-stoneuk .fusion-row { padding-top: var(--rc-section-y); } /* [avada-markup] .fusion-row = inner row */

/* ------------------------------------------------------------------ Eyebrow + copper rule */
/* Put rc-eyebrow on a Text Block (or a Title element set to <p>/div). */
.rc-eyebrow, .rc-eyebrow p, .rc-eyebrow .fusion-title-heading {
  font-family: var(--rc-font-display) !important;
  font-size: var(--rc-fs-eyebrow) !important;
  font-weight: 600 !important;
  letter-spacing: 0.18em !important;
  line-height: 1.3 !important;
  text-transform: uppercase;
  color: var(--rc-copper) !important;
  margin: 0 0 12px !important;
}
.rc-band--charcoal .rc-eyebrow, .rc-band--charcoal .rc-eyebrow p { color: var(--rc-copper-light) !important; }
.rc-hero .rc-eyebrow, .rc-hero .rc-eyebrow p { color: var(--rc-white) !important; }

/* rc-rule: the 40px copper rule. Either add it to the eyebrow element (draws a rule beneath it)
   or to a Separator element on its own. */
.rc-eyebrow::after {
  content: "";
  display: block;
  width: 40px;
  height: 2px;
  margin-top: 12px;
  background: var(--rc-copper);
}
.rc-band--charcoal .rc-eyebrow::after, .rc-hero .rc-eyebrow::after { background: var(--rc-copper-light); }
.fusion-separator.rc-rule, .rc-rule { /* [avada-markup] Separator element */
  width: 40px !important;
  max-width: 40px !important;
  border: 0 !important;
  height: 2px !important;
  background: var(--rc-copper) !important;
  margin: 0 0 16px !important;
}
.rc-rule .fusion-separator-border { display: none; }

/* ------------------------------------------------------------------ Headings & lead */
.rc-display h1, h1.rc-display, .rc-display .fusion-title-heading {
  font-size: var(--rc-fs-display) !important;
  font-weight: 400 !important;
  line-height: 1.08 !important;
  letter-spacing: 0.03em !important;
  margin: 0 0 24px !important;
}
.rc-h2 h2, h2.rc-h2, .rc-h2 .fusion-title-heading {
  font-size: var(--rc-fs-h2) !important;
  font-weight: 400 !important;
  line-height: 1.15 !important;
  letter-spacing: 0.05em !important;
  margin: 0 0 20px !important;
}
.rc-lead, .rc-lead p {
  font-size: var(--rc-fs-lead) !important;
  line-height: 1.5 !important;
  max-width: 34em;
}
.fusion-text p { max-width: 65ch; }

/* ------------------------------------------------------------------ Buttons */
/* Put the class on the Button element; Avada adds it to the <a class="fusion-button …">. [avada-markup] */
.fusion-button.rc-btn--primary,
.fusion-button.rc-btn--secondary,
.fusion-button.rc-btn--on-dark {
  font-family: var(--rc-font-display) !important;
  font-size: var(--rc-fs-button) !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase;
  line-height: 1 !important;
  padding: 18px 28px !important;
  min-height: 52px;
  border-radius: 0 !important;
  border-width: 1px !important;
  border-style: solid !important;
  box-shadow: none !important;
  transition: background-color 160ms var(--rc-ease), color 160ms var(--rc-ease), border-color 160ms var(--rc-ease);
}
.fusion-button.rc-btn--primary { background: var(--rc-copper) !important; border-color: var(--rc-copper) !important; color: var(--rc-white) !important; }
.fusion-button.rc-btn--primary:hover, .fusion-button.rc-btn--primary:focus-visible { background: var(--rc-copper-deep) !important; border-color: var(--rc-copper-deep) !important; }
.fusion-button.rc-btn--primary:active { background: var(--rc-charcoal) !important; border-color: var(--rc-charcoal) !important; }
.fusion-button.rc-btn--secondary { background: transparent !important; border-color: var(--rc-charcoal) !important; color: var(--rc-charcoal) !important; }
.fusion-button.rc-btn--secondary:hover { background: var(--rc-charcoal) !important; color: var(--rc-limewash) !important; }
.fusion-button.rc-btn--on-dark { background: transparent !important; border-color: var(--rc-stone-50) !important; color: var(--rc-stone-50) !important; }
.fusion-button.rc-btn--on-dark:hover { background: var(--rc-stone-50) !important; color: var(--rc-charcoal) !important; }
.fusion-button.rc-btn--primary .fusion-button-text,
.fusion-button.rc-btn--secondary .fusion-button-text,
.fusion-button.rc-btn--on-dark .fusion-button-text { color: inherit !important; }
@media (max-width: 480px) {
  .rc-hero .fusion-button.rc-btn--primary { width: 100%; justify-content: center; padding-inline: 18px !important; }
}

/* Text link with arrow (put rc-link-arrow on a Text Block containing the link). */
.rc-link-arrow a { text-decoration: underline 1px var(--rc-copper); text-underline-offset: 0.22em; }
.rc-link-arrow a::after { content: "\2192"; display: inline-block; margin-left: 10px; text-decoration: none; transition: transform 240ms var(--rc-ease); }
.rc-link-arrow a:hover::after { transform: translateX(4px); }
.rc-hero .rc-link-arrow a { color: var(--rc-white); text-decoration-color: var(--rc-copper-light); }
.rc-band--charcoal .rc-link-arrow a { text-decoration-color: var(--rc-copper-light); }

/* ------------------------------------------------------------------ Hero */
/* Container: 100% width, background image = rc-placeholder-hero.jpg (later the real photo),
   minimum height ~ 100vh, content aligned bottom. The scrim below keeps white text ≥ AA over
   any photo (spec §2.1: every text pixel under α ≥ 0.70). Don't use copper-light text here. */
.rc-hero { position: relative; color: var(--rc-white); isolation: isolate; }
.rc-hero::before { /* left-to-right scrim on desktop */
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(90deg, rgb(26 28 30 / 0.84) 0%, rgb(26 28 30 / 0.72) 60%, rgb(26 28 30 / 0.12) 100%);
}
.rc-hero::after { /* top band for the transparent header */
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 220px;
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, rgb(26 28 30 / 0.72) 0, rgb(26 28 30 / 0.72) 90px, rgb(26 28 30 / 0) 220px);
}
.rc-hero > * { position: relative; z-index: 1; }
@media (max-width: 1024px) { /* tablet/mobile: text stacks full width, so darken bottom-up */
  .rc-hero::before { background: linear-gradient(180deg, rgb(26 28 30 / 0.55) 0%, rgb(26 28 30 / 0.78) 35%, rgb(26 28 30 / 0.86) 100%); }
}
.rc-hero h1, .rc-hero .fusion-title-heading { color: var(--rc-white) !important; }
.rc-hero p, .rc-hero .fusion-text { color: var(--rc-stone-50); }
.rc-hero .rc-contact-line a { color: var(--rc-stone-50); text-decoration-color: var(--rc-copper-light); }

/* ------------------------------------------------------------------ Media (Image elements) */
.rc-media, .rc-media img { display: block; width: 100%; border-radius: 0 !important; }
.rc-media img { object-fit: cover; height: 100%; }

/* ------------------------------------------------------------------ Signature strapline */
/* Text Block, centred, Cardo italic, with copper rules each side. */
.rc-signature, .rc-signature p {
  font-family: var(--rc-font-body);
  font-style: italic;
  font-size: var(--rc-fs-lead) !important;
  text-align: center;
  max-width: none !important;
  margin: 0;
}
.rc-signature p { display: flex; align-items: center; justify-content: center; gap: 24px; }
.rc-signature p::before, .rc-signature p::after { content: ""; flex: 0 0 48px; height: 1px; background: var(--rc-copper); }
@media (max-width: 640px) { .rc-signature p { gap: 14px; } .rc-signature p::before, .rc-signature p::after { flex-basis: 24px; } }

/* ------------------------------------------------------------------ Steps (three Columns) */
/* Each step = a Column with rc-step, containing: Image (rc-media), Text Block (rc-step__num with the
   Roman numeral), Title (H3), Text Block. */
.rc-step__num, .rc-step__num p {
  display: flex;
  align-items: center;
  gap: 20px;
  font-family: var(--rc-font-display);
  font-size: var(--rc-fs-numeral) !important;
  font-weight: 400;
  line-height: 1 !important;
  letter-spacing: 0.02em;
  color: var(--rc-copper);
  margin: 24px 0 20px !important;
  max-width: none !important;
}
.rc-step__num p::after { content: ""; flex: 1; height: 1px; background: var(--rc-stone-200); }
.rc-step h3 { margin: 0 0 8px; }

/* ------------------------------------------------------------------ Benefits (four Columns) */
/* Row of 1/4 columns, each rc-benefit: copper rule on top + vertical hairline divider. */
.rc-benefit { position: relative; padding-top: 32px !important; }
.rc-benefit::before { content: ""; position: absolute; top: 32px; left: 32px; width: 40px; height: 2px; background: var(--rc-copper); }
.rc-benefit > .fusion-column-wrapper { padding: 32px 32px 32px 32px !important; } /* [avada-markup] */
.rc-benefits .fusion-builder-row-inner, .rc-benefits .rc-benefit-row { border-top: 1px solid var(--rc-stone-200); border-bottom: 1px solid var(--rc-stone-200); }
@media (min-width: 1025px) {
  .rc-benefit + .rc-benefit { border-left: 1px solid var(--rc-stone-200); }
  .rc-benefit:first-child::before { left: 0; }
  .rc-benefit:first-child > .fusion-column-wrapper { padding-left: 0 !important; }
}
@media (max-width: 1024px) {
  .rc-benefit { border-bottom: 1px solid var(--rc-stone-200); }
  .rc-benefit::before { left: 0; }
  .rc-benefit > .fusion-column-wrapper { padding-left: 0 !important; padding-right: 0 !important; }
}
.rc-benefit h3 { margin: 16px 0 8px; }

/* ------------------------------------------------------------------ Applications list */
/* Text Block with a plain <ul> (rc-app-list). */
.rc-app-list ul { list-style: none; margin: 32px 0; padding: 0; }
.rc-app-list li {
  position: relative;
  padding: 16px 0 16px 28px;
  border-bottom: 1px solid var(--rc-stone-200);
  font-size: var(--rc-fs-lead);
  line-height: 1.35;
}
.rc-app-list li::before { content: ""; position: absolute; left: 0; top: 1.15em; width: 12px; height: 1px; background: var(--rc-copper); }

/* ------------------------------------------------------------------ Stone UK proof points */
/* Text Block with a <ul> (rc-proof). Side by side on desktop with vertical hairlines. */
.rc-proof ul { list-style: none; margin: 32px 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--rc-stone-200); border-bottom: 1px solid var(--rc-stone-200); }
.rc-proof li { padding: 24px; font-size: var(--rc-fs-small); line-height: 1.55; }
.rc-proof li:first-child { padding-left: 0; }
.rc-proof li + li { border-left: 1px solid var(--rc-stone-200); }
@media (max-width: 640px) {
  .rc-proof ul { grid-template-columns: 1fr; }
  .rc-proof li { padding: 16px 0; }
  .rc-proof li + li { border-left: 0; border-top: 1px solid var(--rc-stone-200); }
}

/* ------------------------------------------------------------------ Enquiry: contact block */
/* Text Block (rc-contact) with <p><span class="rc-contact__label">Email</span><br><a …></a></p> per item. */
.rc-contact p { margin: 0; padding: 20px 0; border-top: 1px solid var(--rc-stone-200); }
.rc-contact p:last-child { border-bottom: 1px solid var(--rc-stone-200); }
.rc-contact__label { display: block; margin-bottom: 6px; font-family: var(--rc-font-display); font-size: 13px; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; color: var(--rc-grey); }
.rc-contact a[href^="mailto:"] { font-size: 22px; overflow-wrap: anywhere; }

/* ------------------------------------------------------------------ Avada Form (rc-form) */
/* [avada-markup] Class names below are Avada Forms' field markup. Check them on first render. */
.rc-form .fusion-form-field { margin-bottom: 24px !important; }
.rc-form label, .rc-form .fusion-form-label-wrapper label {
  font-family: var(--rc-font-body) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: var(--rc-charcoal) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
}
.rc-form input[type="text"], .rc-form input[type="email"], .rc-form input[type="tel"], .rc-form textarea {
  font-family: var(--rc-font-body) !important;
  font-size: 18px !important; /* stops iOS zoom */
  line-height: 1.4 !important;
  color: var(--rc-charcoal) !important;
  background: var(--rc-white) !important;
  border: 1px solid var(--rc-input-border) !important;
  border-radius: 0 !important;
  min-height: 52px;
  padding: 14px 16px !important;
  box-shadow: none !important;
}
.rc-form textarea { min-height: 160px; }
.rc-form input:focus, .rc-form textarea:focus { border-color: var(--rc-charcoal) !important; outline: 2px solid var(--rc-copper); outline-offset: 3px; }
.rc-form [aria-invalid="true"], .rc-form .fusion-form-field-error input, .rc-form .fusion-form-field-error textarea { border: 2px solid var(--rc-error) !important; }
.rc-form .fusion-form-error, .rc-form .error-message { color: var(--rc-error) !important; font-weight: 700; }
.rc-form input[type="checkbox"] { width: 24px; height: 24px; accent-color: var(--rc-copper); margin-right: 12px; flex: 0 0 auto; }
.rc-form .fusion-form-checkbox label, .rc-form .fusion-form-checkbox { font-weight: 400 !important; display: flex; align-items: flex-start; min-height: 44px; }
.rc-form .fusion-button, .rc-form button[type="submit"] {
  font-family: var(--rc-font-display) !important;
  font-size: var(--rc-fs-button) !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase;
  background: var(--rc-copper) !important;
  border: 1px solid var(--rc-copper) !important;
  color: var(--rc-white) !important;
  border-radius: 0 !important;
  padding: 18px 28px !important;
  min-height: 52px;
}
.rc-form .fusion-button:hover, .rc-form button[type="submit"]:hover { background: var(--rc-copper-deep) !important; border-color: var(--rc-copper-deep) !important; }
.rc-form .fusion-alert, .rc-form .fusion-form-response { border-radius: 0 !important; font-family: var(--rc-font-body); }
.rc-form__privacy, .rc-form__privacy p { font-size: var(--rc-fs-small) !important; color: var(--rc-grey) !important; max-width: 40em; }

/* ------------------------------------------------------------------ Footer (Avada Layouts footer) */
.rc-footer { background: var(--rc-charcoal) !important; color: var(--rc-stone-50); }
.rc-footer h2, .rc-footer h3, .rc-footer .rc-eyebrow p { color: var(--rc-copper-light) !important; }
.rc-footer a { color: var(--rc-stone-50); text-decoration-color: var(--rc-copper-light); }
.rc-footer a:hover { color: var(--rc-copper-light); }
.rc-legal, .rc-legal p { font-size: 15px !important; line-height: 1.55; color: var(--rc-stone-300) !important; max-width: 46em; }

/* ------------------------------------------------------------------ Header (Avada Layouts header) */
/* Header container: add rc-header. Avada's sticky options handle position; these fix the look. */
.rc-header .fusion-button.rc-btn--primary { padding: 12px 18px !important; min-height: 44px; }
.rc-header .fusion-menu > li > a, .rc-header .awb-menu__main-a { /* [avada-markup] Menu element */
  font-family: var(--rc-font-display) !important;
  font-size: var(--rc-fs-button) !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
}

/* ------------------------------------------------------------------ Motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

/* ------------------------------------------------------------------ Small screens */
@media (max-width: 640px) {
  .rc-contact a[href^="mailto:"] { font-size: 20px; }
}

/* ------------------------------------------------------------------ Hooks reserved for later tweaks */
/* rc-system, rc-applications, rc-enquiry are set on their containers so section-specific fixes can be
   added here without touching Avada. rc-rule (Separator) and rc-btn--on-dark (buttons on charcoal
   bands, e.g. the future gallery) are available but not used in Phase 1. */

/* ================================================================== Avada overrides (checked on Avada 7.16.2) */

/* Headings: Avada sets text-transform via typography vars; Cinzel's lowercase are small caps, so force caps. */
body h1, body h2, body h3, body .fusion-title-heading { text-transform: uppercase !important; }

/* Links inside body copy are underlined (Avada removes underlines). */
.fusion-text a:not(.fusion-button) { text-decoration: underline 1px var(--rc-copper); text-underline-offset: 0.22em; }
.rc-hero .fusion-text a, .rc-hero .rc-link-arrow a, .rc-hero .rc-link-arrow a::after { color: var(--rc-white) !important; text-decoration-color: var(--rc-copper-light); }
.rc-footer .fusion-text a, .rc-footer .rc-link-arrow a::after { color: var(--rc-stone-50) !important; text-decoration-color: var(--rc-copper-light); }
.rc-footer .fusion-text a:hover { color: var(--rc-copper-light) !important; }
.rc-link-arrow a::after { color: inherit; }

/* Header: menu items spaced, charcoal, Cinzel caps; copper on hover; anchors aren't "current". [avada-markup] */
.rc-header .awb-menu__main-ul { gap: 32px; }
.rc-header .awb-menu__main-a, .rc-header .awb-menu__main-a span {
  color: var(--rc-charcoal) !important;
  font-family: var(--rc-font-display) !important;
  font-size: var(--rc-fs-button) !important;
  font-weight: 600 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase;
}
.rc-header .awb-menu__main-a:hover, .rc-header .awb-menu__main-a:hover span { color: var(--rc-copper) !important; }
.rc-header .awb-menu__main-background-active, .rc-header .awb-menu__main-background-default { display: none !important; }
.rc-header .fusion-button { white-space: nowrap; padding: 13px 20px !important; min-height: 44px; }
/* (v1 header column sizing removed – superseded by "Header v3" below) */

/* Steps: numeral followed by a hairline. */
.rc-step__num { display: block !important; }
.rc-step__num p { display: flex !important; width: 100%; margin: 0 !important; }
.rc-step__num { margin: 24px 0 16px !important; }
.rc-step h3 { margin-top: 0 !important; }

/* Benefits: keep the hairline grid inside the gutters (Avada rows have negative side margins). */
.rc-benefit-row .fusion-builder-row-inner, .rc-benefit-row .fusion-builder-row { margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; }
.rc-benefit { align-self: stretch !important; }
.rc-benefit > .fusion-column-wrapper { height: 100%; }

/* Stone UK strip: copper rule at the top of the content, then the section padding. */
.rc-stoneuk.rc-section { padding-top: 0 !important; }
.rc-stoneuk .fusion-row, .rc-stoneuk .fusion-builder-row { border-top: 0 !important; }
.rc-stoneuk > .fusion-builder-row, .rc-stoneuk .fusion-builder-row:first-child { position: relative; padding-top: var(--rc-section-y) !important; }
.rc-stoneuk > .fusion-builder-row::before, .rc-stoneuk .fusion-builder-row:first-child::before {
  content: ""; position: absolute; top: 0; left: 24px; right: 24px; height: 1px; background: var(--rc-copper);
}

/* Avada Forms: no asterisks (optional fields say "(optional)"), larger checkbox, field spacing. [avada-markup] */
.rc-form .fusion-form-element-required { display: none !important; }
.rc-form .fusion-form-checkbox input[type="checkbox"] { width: 24px !important; height: 24px !important; min-width: 24px; accent-color: var(--rc-copper); margin: 2px 14px 0 0 !important; }
.rc-form .fusion-form-checkbox { display: flex; align-items: flex-start; }
.rc-form .fusion-form-checkbox label { font-weight: 400 !important; font-size: var(--rc-fs-body) !important; line-height: 1.5 !important; }
.rc-form legend.fusion-form-label-wrapper .label { font-weight: 700; font-size: 17px; }
.rc-form .rc-form__privacy a { color: var(--rc-charcoal); }

/* Footer: headings without the copper rule. */
.rc-footer .rc-eyebrow::after { display: none; }
.rc-footer .fusion-text p { margin: 0 0 12px; }

/* Benefits grid, take 2: the borders live on the inner row only; columns get no Avada spacing. */
.rc-benefits .rc-benefit-row { border: 0 !important; }
.rc-benefits .fusion-builder-row-inner { border-top: 1px solid var(--rc-stone-200); border-bottom: 1px solid var(--rc-stone-200); }
.rc-benefit {
  --awb-spacing-left-large: 0px !important; --awb-spacing-right-large: 0px !important;
  --awb-spacing-left-medium: 0px !important; --awb-spacing-right-medium: 0px !important;
  --awb-spacing-left-small: 0px !important; --awb-spacing-right-small: 0px !important;
  padding-top: 0 !important;
}
.rc-benefit::before { top: 32px; left: 32px; }
.rc-benefit > .fusion-column-wrapper { padding: 64px 32px 32px !important; }
@media (min-width: 1025px) {
  .rc-benefit:first-child::before { left: 0; }
  .rc-benefit:first-child > .fusion-column-wrapper { padding-left: 0 !important; }
}
@media (max-width: 1024px) {
  .rc-benefit::before { left: 0; }
  .rc-benefit > .fusion-column-wrapper { padding: 56px 0 28px !important; }
  .rc-benefits .fusion-builder-row-inner { border-bottom: 0; }
}

/* Checkbox: Avada hides the native box and draws a 14px one; show a native 24px box instead. [avada-markup] */
.rc-form .fusion-form-checkbox input[type="checkbox"] { position: static !important; opacity: 1 !important; appearance: auto !important; }
.rc-form .fusion-form-checkbox label::before, .rc-form .fusion-form-checkbox label::after { display: none !important; }
.rc-form .fusion-form-checkbox label { padding-left: 0 !important; }
.rc-form__hint p { font-size: var(--rc-fs-small) !important; color: var(--rc-grey) !important; margin: -12px 0 24px !important; }

/* Benefits grid, take 3: let the inner row stretch to the column (no 100% width). */
.rc-benefits .fusion-builder-row-inner { width: auto !important; }
@media (min-width: 641px) and (max-width: 1024px) {
  .rc-benefit > .fusion-column-wrapper { padding: 56px 32px 28px 0 !important; }
}

/* Legal pages: smaller section headings. */
.rc-legal-page h2 { font-size: var(--rc-fs-h3) !important; font-weight: 600 !important; letter-spacing: 0.08em !important; margin: 40px 0 12px !important; scroll-margin-top: 100px; }
.rc-legal-page .rc-display .fusion-title-heading, .rc-legal-page h1 { font-size: var(--rc-fs-h2) !important; }

/* ================================================================== v2: FutureScape pivot sections */

/* Speed comparison table */
.rc-compare-wrap { overflow-x: auto; }
.rc-compare { width: 100%; border-collapse: collapse; font-size: var(--rc-fs-body); background: transparent; }
.rc-compare th, .rc-compare td { text-align: left; padding: 18px 20px; border-bottom: 1px solid var(--rc-stone-200); vertical-align: top; }
.rc-compare thead th { font-family: var(--rc-font-display); font-size: 13px; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--rc-grey); border-bottom: 2px solid var(--rc-charcoal); }
.rc-compare tbody th { font-weight: 700; width: 28%; }
.rc-compare .rc-compare__us { background: rgb(156 88 59 / 0.07); color: var(--rc-charcoal); font-weight: 700; }
.rc-compare thead .rc-compare__us { color: var(--rc-copper); }
@media (max-width: 640px) { .rc-compare th, .rc-compare td { padding: 14px 10px; font-size: 15px; } .rc-compare tbody th { width: 34%; } }
.rc-footnote p, .rc-caption p { font-size: var(--rc-fs-small) !important; color: var(--rc-grey) !important; font-style: italic; }

/* Calculator */
.rc-calc { margin-top: 24px; border: 1px solid var(--rc-stone-200); background: var(--rc-white); padding: 32px; }
.rc-calc__inputs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; margin-bottom: 32px; }
.rc-calc__label { display: block; font-weight: 700; font-size: 17px; margin-bottom: 8px; }
.rc-calc__opt { font-weight: 400; color: var(--rc-grey); }
.rc-calc input { width: 100%; min-height: 52px; padding: 12px 16px; font-family: var(--rc-font-body); font-size: 20px; border: 1px solid var(--rc-input-border); border-radius: 0; background: var(--rc-white); color: var(--rc-charcoal); }
.rc-calc__results { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--rc-stone-200); }
.rc-calc__col { padding: 24px 24px 8px 0; }
.rc-calc__col--us { padding-left: 24px; border-left: 1px solid var(--rc-stone-200); background: rgb(156 88 59 / 0.07); }
.rc-calc__head { font-family: var(--rc-font-display); font-size: 13px !important; font-weight: 600; letter-spacing: 0.14em; text-transform: uppercase; color: var(--rc-grey); margin: 0 0 8px !important; }
.rc-calc__col--us .rc-calc__head { color: var(--rc-copper); }
.rc-calc__big { font-family: var(--rc-font-display); font-size: var(--rc-fs-numeral) !important; line-height: 1.1 !important; margin: 0 0 8px !important; color: var(--rc-charcoal); }
.rc-calc__cost { font-size: var(--rc-fs-body); margin: 0 0 16px !important; min-height: 1.6em; }
.rc-calc__note { font-size: var(--rc-fs-small) !important; color: var(--rc-grey); font-style: italic; margin: 16px 0 0 !important; }
@media (max-width: 640px) {
  .rc-calc { padding: 20px; }
  .rc-calc__inputs, .rc-calc__results { grid-template-columns: 1fr; }
  .rc-calc__col--us { border-left: 0; border-top: 1px solid var(--rc-stone-200); padding-left: 16px; }
  .rc-calc__col { padding-right: 16px; }
}

/* Vertical cards */
.rc-card .fusion-title-heading a { color: inherit; text-decoration: none; }
.rc-card .fusion-title-heading a:hover { color: var(--rc-copper); }
.rc-card .rc-media img { aspect-ratio: 4 / 3; object-fit: cover; transition: transform 600ms var(--rc-ease); }
.rc-card .rc-media { overflow: hidden; }
.rc-card:hover .rc-media img { transform: scale(1.03); }

/* Before/after sliders [avada-markup] */
.rc-before-after, .rc-before-after img { border-radius: 0 !important; }
.rc-before-after .fusion-image-before-after-before-label::before, .rc-before-after .fusion-image-before-after-after-label::before { font-family: var(--rc-font-display) !important; letter-spacing: 0.14em; text-transform: uppercase; font-size: 13px !important; border-radius: 0 !important; }

/* Form v2: radios inline, range sliders */
.rc-form .fusion-form-radio { display: inline-flex; align-items: center; margin-right: 24px; min-height: 44px; }
.rc-form .fusion-form-radio input[type="radio"] { position: static !important; opacity: 1 !important; appearance: auto !important; width: 22px !important; height: 22px !important; accent-color: var(--rc-copper); margin: 0 10px 0 0 !important; }
.rc-form .fusion-form-radio label::before, .rc-form .fusion-form-radio label::after { display: none !important; }
.rc-form .fusion-form-radio label { padding-left: 0 !important; font-weight: 400 !important; }
.rc-form input[type="range"] { accent-color: var(--rc-copper); width: 100%; min-height: 32px; }
.rc-form select { font-family: var(--rc-font-body) !important; font-size: 18px !important; min-height: 52px; border: 1px solid var(--rc-input-border) !important; border-radius: 0 !important; background-color: var(--rc-white) !important; color: var(--rc-charcoal) !important; }

/* Time-lapse band */
.rc-timelapse video, .rc-video { border-radius: 0 !important; }

/* Header logo: the supplied full lockup (wordmark, copper rule, tagline). */
.rc-header .rc-logo, .rc-header .rc-logo img { width: 240px; max-width: 240px !important; height: auto; }
@media (max-width: 640px) { .rc-header .rc-logo, .rc-header .rc-logo img { width: 180px; max-width: 180px !important; } }

/* ================================================================== Header v3: compact CTA + menu, nav always available */
/* Columns size to their content at every width; the nav column takes the remaining space. */
.rc-header .fusion-layout-column { width: auto !important; max-width: none !important; }
.rc-header .rc-header__logo, .rc-header .rc-header__cta { flex: 0 0 auto !important; }
.rc-header .rc-header__nav { flex: 1 1 auto !important; min-width: 0; }
.rc-header .rc-header__cta .fusion-column-wrapper { flex-direction: row !important; justify-content: flex-end; align-items: center; }

/* Smaller inline menu. [avada-markup] */
.rc-header .awb-menu__main-ul { gap: 24px !important; }
.rc-header .awb-menu__main-a, .rc-header .awb-menu__main-a span { font-size: 13px !important; letter-spacing: 0.1em !important; }

/* Smaller callback button. */
.rc-header .fusion-button { font-size: 13px !important; letter-spacing: 0.12em !important; padding: 10px 16px !important; min-height: 40px; line-height: 1 !important; }
.rc-header .fusion-button .awb-button__icon, .rc-header .fusion-button i { font-size: 12px !important; }

/* Below the menu breakpoint (1200px): logo · callback · menu button (menu button last, far right). */
@media (max-width: 1200px) {
  .rc-header .rc-header__nav { order: 3; flex: 0 0 auto !important; }
  .rc-header .rc-header__cta { order: 2; margin-left: auto !important; }
}
/* Menu button: 44px target, charcoal icon, visible focus. [avada-markup] */
.rc-header .awb-menu__m-toggle { min-width: 44px; min-height: 44px; padding: 0 !important; justify-content: center; color: var(--rc-charcoal) !important; background: transparent !important; border: 1px solid var(--rc-stone-200) !important; border-radius: 0 !important; }
.rc-header .awb-menu__m-toggle:focus-visible { outline: 2px solid var(--rc-copper); outline-offset: 2px; }
/* Dropdown panel: full width under the header, Cinzel caps, comfortable targets. [avada-markup] */
.rc-header .awb-menu__main-ul_column, .rc-header .awb-menu_expanded .awb-menu__main-ul { background: var(--rc-limewash) !important; border-top: 1px solid var(--rc-stone-200); box-shadow: 0 12px 24px rgb(35 38 41 / 0.08); }
.rc-header .awb-menu_expanded .awb-menu__main-a, .rc-header .awb-menu_expanded .awb-menu__main-a span { font-size: 15px !important; }

/* Logo steps down on small screens so everything fits on one row (down to 320px). */
@media (max-width: 640px) {
  .rc-header .rc-logo, .rc-header .rc-logo img { width: 160px !important; max-width: 160px !important; }
  .rc-header .fusion-button { padding: 9px 12px !important; font-size: 12px !important; }
}
@media (max-width: 360px) {
  .rc-header .rc-logo, .rc-header .rc-logo img { width: 128px !important; max-width: 128px !important; }
  .rc-header .fusion-button { padding: 8px 10px !important; letter-spacing: 0.08em !important; }
  .rc-header .fusion-button .awb-button__icon, .rc-header .fusion-button i { display: none !important; }
}
/* Header v3 fixes: keep one row; callback sits next to the menu button on the right. */
.rc-header .fusion-builder-row { flex-wrap: nowrap !important; }
@media (max-width: 1200px) {
  .rc-header .rc-header__nav { width: 46px !important; flex: 0 0 46px !important; }
  .rc-header .rc-header__cta { flex: 1 1 auto !important; margin-left: 0 !important; }
  .rc-header .rc-header__cta .fusion-column-wrapper { justify-content: flex-end !important; }
}
@media (max-width: 640px) {
  .rc-header .fusion-builder-row { gap: 8px; }
  .rc-header .fusion-layout-column {
    --awb-spacing-left-small: 0px !important; --awb-spacing-right-small: 0px !important;
    padding-left: 0 !important; padding-right: 0 !important; margin-left: 0 !important; margin-right: 0 !important;
  }
  .rc-header .rc-logo, .rc-header .rc-logo img { width: 140px !important; max-width: 140px !important; }
}
@media (max-width: 360px) {
  .rc-header .rc-logo, .rc-header .rc-logo img { width: 112px !important; max-width: 112px !important; }
  .rc-header .fusion-button { padding: 8px 9px !important; font-size: 11.5px !important; }
}
/* Header v3 polish: logo pushes the rest right; 12px between callback and menu button; 20px page edge on phones. */
@media (max-width: 1200px) {
  .rc-header .rc-header__logo { margin-right: auto !important; }
  .rc-header .rc-header__cta { flex: 0 0 auto !important; margin-right: 12px !important; }
}
@media (max-width: 640px) {
  .rc-header .rc-header__logo { padding-left: 12px !important; }
  .rc-header .rc-header__nav { padding-right: 12px !important; width: 58px !important; flex: 0 0 58px !important; }
  .rc-header .rc-header__cta { margin-right: 0 !important; }
}
@media (max-width: 340px) {
  .rc-header .rc-logo, .rc-header .rc-logo img { width: 104px !important; max-width: 104px !important; }
}
/* Open menu panel: drop from the bottom edge of the header, full width. [avada-markup] */
@media (max-width: 1200px) {
  .rc-header .fusion-builder-row, .rc-header .fusion-layout-column, .rc-header .fusion-column-wrapper, .rc-header .awb-menu, .rc-header nav { position: static !important; }
  .rc-header.fusion-fullwidth { position: sticky; }
  .rc-header .awb-menu__main-ul_column, .rc-header .awb-menu_expanded .awb-menu__main-ul { position: absolute !important; top: 100% !important; left: 0 !important; right: 0 !important; width: 100% !important; margin: 0 !important; z-index: 120; }
}
/* Menu button (burger): only below the 1200px menu breakpoint. Wider screens show the full menu, so the button stays hidden. [avada-markup] */
@media (max-width: 1200px) {
  .rc-header .awb-menu__m-toggle, .rc-header .awb-menu__m-toggle-inner, .rc-header .awb-menu__m-collapse-icon { display: flex !important; align-items: center; justify-content: center; }
}
@media (min-width: 1201px) {
  .rc-header .awb-menu__m-toggle { display: none !important; }
  /* Extra space between the last menu link and the callback button. */
  .rc-header .rc-header__cta { margin-left: 16px !important; }
}
.rc-header .awb-menu__m-toggle { width: 44px; }

/* ------------------------------------------------------------------ Comparison table on phones */
/* Fit all three columns at phone width, so the RapidClad column is visible without sideways scrolling. */
@media (max-width: 640px) {
  .rc-compare { table-layout: fixed; }
  .rc-compare th, .rc-compare td { padding: 12px 6px; font-size: 14px; overflow-wrap: anywhere; hyphens: auto; }
  .rc-compare thead th { font-size: 11px; letter-spacing: 0.04em; }
  .rc-compare tbody th { width: 34%; font-size: 13px; }
}

/* ------------------------------------------------------------------ Cookie banner (CookieYes plugin) */
/* Brand colours and fonts. Accept and Reject get equal weight. !important overrides the plugin's inline styles. */
.cky-consent-container .cky-consent-bar, .cky-preference-center { background: var(--rc-limewash) !important; border: 1px solid var(--rc-stone-200) !important; border-radius: 0 !important; box-shadow: 0 12px 24px rgba(35, 38, 41, 0.12) !important; }
.cky-consent-container .cky-title, .cky-preference-title { font-family: var(--rc-font-display) !important; color: var(--rc-charcoal) !important; letter-spacing: 0.06em; }
.cky-consent-container .cky-notice-des, .cky-consent-container .cky-notice-des p { font-family: var(--rc-font-body) !important; color: var(--rc-charcoal) !important; font-size: 15px !important; line-height: 1.5 !important; }
.cky-btn { border-radius: 0 !important; font-family: var(--rc-font-display) !important; font-weight: 600 !important; letter-spacing: 0.08em; }
.cky-btn.cky-btn-accept, .cky-btn.cky-btn-reject, .cky-btn.cky-btn-preferences { background: var(--rc-copper) !important; border-color: var(--rc-copper) !important; color: #ffffff !important; }
.cky-btn.cky-btn-customize { background: transparent !important; border-color: var(--rc-charcoal) !important; color: var(--rc-charcoal) !important; }
.cky-btn-revisit-wrapper { background: var(--rc-copper) !important; }

/* ------------------------------------------------------------------ Charcoal band headings */
/* Avada's title colour rule (#wrapper) outranks the band rule above, so headings on charcoal need this. */
.fusion-body #wrapper .rc-band--charcoal .fusion-title .fusion-title-heading, .fusion-body #wrapper .rc-band--charcoal h2, .fusion-body #wrapper .rc-band--charcoal h3 { color: var(--rc-stone-50) !important; }