/* =====================================================================
 * R84 Consortium page. Everything shared with the Remaining 84 page
 * (nav, reveals, contact tabs, newsletter, footer) comes from r84.css;
 * this file only holds what is new here.
 * ===================================================================== */

/* Hero film: the paicon.com About Us story card (about.css .a-story), poster
 * + play button; a click swaps in the YouTube player (consortium.js). */
.r84c-video { position:relative; width:min(100%,680px); }
.r84c-story {
  position:relative; aspect-ratio:16/10; border-radius:14px; overflow:hidden;
  background:#0E1633; border:1px solid #2A3155; box-shadow:0 30px 80px rgba(14,22,51,.28);
  transition:border-color .3s ease;
}
.r84c-story:hover { border-color:#E87A16; }
.r84c-story.is-playing { aspect-ratio:16/9; }
.r84c-story__thumb { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.r84c-story__scrim { position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg, rgba(14,22,51,.34), rgba(14,22,51,.52)); }
.r84c-story__dots { position:absolute; inset:0; z-index:1; pointer-events:none; background-image:radial-gradient(circle, rgba(184,189,212,.18) 1.2px, transparent 1.2px); background-size:20px 20px; }
.r84c-story__glow { position:absolute; pointer-events:none; right:-8%; bottom:-26%; width:70%; height:75%; background:radial-gradient(closest-side, rgba(232,122,22,.22), transparent); }
.r84c-story__mark { z-index:1; pointer-events:none; position:absolute; right:6%; top:9%; width:min(9%,64px); height:auto; opacity:.9; }
.r84c-story.is-playing .r84c-story__thumb, .r84c-story.is-playing .r84c-story__scrim,
.r84c-story.is-playing .r84c-story__dots, .r84c-story.is-playing .r84c-story__glow,
.r84c-story.is-playing .r84c-story__mark, .r84c-story.is-playing .r84c-story__face { display:none; }
.r84c-story__face { position:absolute; inset:0; z-index:2; display:flex; align-items:center; justify-content:center; padding:0; border:0; background:none; font:inherit; cursor:pointer; }
.r84c-story__play {
  display:grid; place-items:center; width:clamp(64px,7vw,84px); height:clamp(64px,7vw,84px); border-radius:50%;
  background:#E87A16; color:#fff; font-size:clamp(20px,2.2vw,26px); box-shadow:0 14px 40px rgba(232,122,22,.45); transition:transform .25s ease;
}
.r84c-story__face:hover .r84c-story__play { transform:scale(1.07); }
.r84c-story iframe { position:absolute; inset:0; z-index:1; width:100%; height:100%; border:0; }
.r84c-story__close {
  position:absolute; top:10px; right:10px; z-index:2; width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(255,255,255,.4); background:rgba(14,22,51,.72); color:#fff; font-size:14px; line-height:1;
  cursor:pointer; display:grid; place-items:center; transition:background .25s ease;
}
.r84c-story__close:hover { background:#E87A16; border-color:#E87A16; }

/* Frontiers: one row of round flags, no names (alt/title carry them).
 * Each flag shares the row equally and caps at 76px; phones wrap. */
.r84c-flags { list-style:none; margin:0; padding:0; display:flex; flex-wrap:nowrap; justify-content:space-between; gap:clamp(6px,1.2vw,20px); }
.r84c-flags li { flex:1 1 0; min-width:0; max-width:76px; }
.r84c-flags img {
  display:block; width:100%; height:auto; aspect-ratio:1; border-radius:50%; object-fit:cover;
  box-shadow:0 0 0 1px rgba(14,22,51,.12), 0 12px 28px rgba(51,59,88,.14); transition:transform .3s ease;
}
.r84c-flags img:hover { transform:translateY(-4px); }
@media (max-width:600px) {
  .r84c-flags { flex-wrap:wrap; justify-content:center; gap:12px; }
  .r84c-flags li { flex:0 0 48px; }
}

/* Frontier countries: region label on the left, country chips on the right. */
.r84c-regions { display:grid; }
.r84c-region { display:grid; grid-template-columns:110px 1fr; gap:14px; align-items:baseline; padding:14px 0; border-bottom:1px solid #EBE2D0; }
.r84c-region__h { font-size:12.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#B4620F; }
.r84c-chips { margin:0; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.r84c-chips li {
  display:inline-flex; align-items:center; gap:8px; padding:6px 13px 6px 7px;
  background:#FFFFFF; border:1px solid #EBE2D0; border-radius:999px;
  font-size:14.5px; font-weight:700; letter-spacing:-.005em; color:#0E1633;
}
.r84c-chips img { width:20px; height:20px; border-radius:50%; object-fit:cover; box-shadow:0 0 0 1px rgba(14,22,51,.14); }
@media (max-width:480px) { .r84c-region { grid-template-columns:1fr; gap:10px; } }

/* Frontier map: dot grid in the middle, country pills around it. */
.r84c-fmap__stage { position:relative; }
.r84c-fmap__stage svg { display:block; width:100%; height:auto; overflow:visible; }
.r84c-fmap__country { transition:stroke .25s ease; }
.r84c-fmap__country.is-on { stroke:#B4620F; }
.r84c-fmap__line { stroke:#B4620F; stroke-width:1; opacity:.45; transition:opacity .25s ease, stroke-width .25s ease; }
.r84c-fmap__line.is-on { opacity:1; stroke-width:1.6; }
.r84c-fmap__label { cursor:default; }
.r84c-fmap__label rect { fill:#FFFFFF; stroke:#EBE2D0; transition:stroke .25s ease; }
.r84c-fmap__label.is-on rect { stroke:#E87A16; }
.r84c-fmap__label text { font-family:Inter,sans-serif; font-size:15px; font-weight:700; letter-spacing:-.005em; fill:#0E1633; }
.r84c-fmap__list { display:none; }
@media (max-width:900px) {
  /* labels get too small on a phone: keep the map, list the countries below */
  .r84c-fmap__label, .r84c-fmap__line { display:none; }
  .r84c-fmap__list { display:block; margin-top:8px; }
}

@media (max-width:1100px) {
  #top .r84c-video { width:min(100%,640px); }
}
@media (max-width:900px) {
}


/* ---------------------------------------------------------------------
 * How to join: who/gain/ask cards.
 * Card and number styles follow the cause cards on the Remaining 84 page.
 * ------------------------------------------------------------------- */
.r84c-card {
  box-sizing:border-box; display:flex; flex-direction:column; background:#FFFFFF;
  border:1px solid #EBE2D0; border-radius:14px; padding:clamp(22px,2.4vw,32px);
  box-shadow:0 18px 44px rgba(51,59,88,.06);
}
.r84c-card__eyebrow { font-size:13.5px; font-weight:800; letter-spacing:.13em; text-transform:uppercase; color:#B4620F; margin-bottom:12px; }
.r84c-card__h { margin:0 0 10px; font-weight:800; font-size:clamp(19px,1.7vw,26px); line-height:1.16; letter-spacing:-.02em; color:#0E1633; text-wrap:pretty; }
.r84c-card__p { margin:0; font-size:15.5px; line-height:1.62; color:#333B58; text-wrap:pretty; }
.r84c-list { margin:0; padding:0; list-style:none; display:grid; gap:10px; }
.r84c-list li { position:relative; padding-left:20px; font-size:15.5px; line-height:1.55; color:#48506E; text-wrap:pretty; }
.r84c-list li::before { content:"•"; position:absolute; left:2px; top:0; color:#E87A16; }
.r84c-list strong { font-weight:700; color:#0E1633; }

/* How to join cards use the section eyebrow size (r84.css shrinks [data-eyebrow] on phones) */
[data-hcols] .r84c-card__eyebrow { font-size:16.5px; letter-spacing:.14em; }
@media (max-width:900px) {
  [data-hcols] { grid-template-columns:1fr !important; }
}

/* Principles: six cards in three aligned columns. Illustration, title and a one-line
 * commitment, left-aligned and centred vertically. */
.r84c-principles { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2vw,28px); align-items:start; }
.r84c-pcol { display:grid; gap:clamp(16px,2vw,28px); }
.r84c-pcard {
  box-sizing:border-box; display:flex; flex-direction:column; justify-content:center;
  min-height:clamp(230px,18vw,256px); padding:clamp(20px,1.8vw,26px);
  background:#1A2347; border:1px solid #2A3155; border-radius:16px;
  transition:border-color .3s ease, transform .3s ease;
}
.r84c-pcard:hover { border-color:#E87A16; }
.r84c-pcard__main { display:flex; flex-direction:column; align-items:flex-start; }
.r84c-pcard__art {
  width:clamp(76px,6.4vw,96px); height:auto; overflow:visible;
  filter:drop-shadow(0 10px 22px rgba(232,122,22,.22));
}
.r84c-pcard h3 { margin:16px 0 0; font-weight:800; font-size:clamp(19px,1.7vw,26px); line-height:1.16; letter-spacing:-.02em; color:#FFFFFF; text-wrap:balance; }
.r84c-pcard__desc { margin:8px 0 0; font-size:15.5px; line-height:1.62; color:#B8BDD4; text-wrap:pretty; }
@media (max-width:900px) {
  .r84c-principles { grid-template-columns:1fr 1fr; }
  .r84c-pcol { display:contents; }
}
@media (max-width:600px) { .r84c-principles { grid-template-columns:1fr; } }

/* Patient journey (Mission): inputs -> digital twin -> outputs on navy. */
.r84c-journey { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:clamp(12px,1.6vw,22px); align-items:center; }
.r84c-journey__h { font-size:13px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#F19A3E; margin-bottom:4px; }
.r84c-journey__in { display:grid; gap:3px; align-content:start; background:#1A2347; border:1px solid #2A3155; border-radius:12px; padding:14px 18px; }
.r84c-journey__in strong { font-size:16px; font-weight:800; letter-spacing:-.01em; color:#FFFFFF; }
.r84c-journey__in span { font-size:14px; line-height:1.5; color:#B8BDD4; }
.r84c-journey__twin { background:#FAF5EC; border-radius:14px; padding:clamp(22px,2.4vw,32px); box-shadow:0 0 0 1px #E87A16, 0 30px 70px rgba(5,10,32,.45); }
.r84c-journey__twin .r84c-journey__h { color:#B4620F; display:block; margin-bottom:14px; }
.r84c-journey__twin h3 { margin:6px 0 16px; font-weight:800; font-size:clamp(22px,2.1vw,30px); line-height:1.1; letter-spacing:-.02em; color:#0E1633; }
.r84c-journey__twin ul { margin:0; padding:0; list-style:none; display:grid; gap:9px; }
.r84c-journey__twin li { display:flex; align-items:center; gap:10px; font-size:15.5px; font-weight:600; color:#333B58; }
.r84c-journey__list { display:grid; gap:10px; }
/* lift the right box so the arrow (centred on the row) lines up with the gap
 * between its 2nd and 3rd item: the label above the list pushes the list's
 * centre down by half the label's height; a negative margin-top shifts a
 * centred grid item up by half its value */
.r84c-journey > .r84c-journey__unlocks { margin-top:-30px; margin-right:clamp(0px,8vw,116px); }
.r84c-journey__layers { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.r84c-journey__twin .r84c-journey__in { background:#FFFFFF; border-color:#EBE2D0; }
.r84c-journey__twin .r84c-journey__in strong { color:#0E1633; }
.r84c-journey__twin .r84c-journey__in span { color:#48506E; }
.r84c-journey__twin li::before { content:""; width:8px; height:8px; border-radius:50%; background:#E87A16; flex-shrink:0; }
.r84c-journey__arrow { font-size:26px; color:#F19A3E; }
@media (max-width:1000px) {
  .r84c-journey { grid-template-columns:1fr; }
  .r84c-journey > .r84c-journey__unlocks { margin-top:0; margin-right:0; }
  .r84c-journey__layers { grid-template-columns:1fr; }
  .r84c-journey__arrow { justify-self:center; transform:rotate(90deg); }
}


/* "What we are building" visual: the patient at the centre, the data layers
 * around it flowing in, outputs below. Desktop only; the boxed journey above
 * is the mobile / tablet fallback. */
.r84c-viz { display:block; }
.r84c-viz__svg { display:block; width:100%; height:auto; overflow:visible; }
.r84c-viz__flow { animation:r84vFlow 1.1s linear infinite; }
@keyframes r84vFlow { to { stroke-dashoffset:-12; } }
.r84c-viz__pulse { transform-box:fill-box; transform-origin:center; animation:r84vPulse 2.8s ease-out infinite; }
@keyframes r84vPulse { 0% { transform:scale(.94); opacity:.9; } 100% { transform:scale(1.14); opacity:0; } }
@media (prefers-reduced-motion: reduce) { .r84c-viz__flow, .r84c-viz__pulse { animation:none; } }
@media (max-width:1000px) { .r84c-viz { display:none; } }

/* Why it matters: two headline stats and four population examples */
.r84c-whystats { display:grid; grid-template-columns:1fr 1fr; gap:clamp(14px,1.8vw,24px); }
.r84c-big { justify-content:flex-start; }
/* stat value: paicon.com home.css .h-stat__value */
.r84c-big__n { font-weight:800; font-size:clamp(46px,4.2vw,70px); line-height:.9; letter-spacing:-.045em; color:#0E1633; }
.r84c-big p { margin:12px 0 0; max-width:30em; font-size:clamp(16px,1.3vw,19px); line-height:1.5; color:#333B58; text-wrap:pretty; }
.r84c-whypop { margin-top:clamp(14px,1.8vw,24px); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(14px,1.8vw,24px); }
/* secondary stat: paicon.com satsight.css .ss-stat__v */
.r84c-pop__n { font-weight:800; font-size:clamp(30px,2.8vw,44px); line-height:1; letter-spacing:-.02em; color:#E87A16; }
.r84c-pop__h { margin:10px 0 0; font-weight:800; font-size:clamp(19px,1.7vw,26px); line-height:1.16; letter-spacing:-.02em; color:#0E1633; text-wrap:balance; }
.r84c-pop__vs { margin:8px 0 0; font-size:15.5px; line-height:1.55; color:#48506E; text-wrap:pretty; } /* brand card body text: the reference each stat is compared with */
/* closing line at the brand card-title size, the same as the card titles above it */
.r84c-whyclose { margin:clamp(28px,3.6vw,44px) 0 0; max-width:none; font-size:clamp(19px,1.7vw,26px); line-height:1.3; color:#333B58; text-wrap:pretty; }
.r84c-whyclose strong { font-weight:700; color:#0E1633; }
.r84c-whysrc { margin:18px 0 0; max-width:none; font-size:13px; line-height:1.6; color:#6E6857; }
@media (max-width:1000px) { .r84c-whypop { grid-template-columns:1fr 1fr; } }
@media (max-width:600px) { .r84c-whypop { grid-template-columns:1fr; } }
@media (max-width:600px) { .r84c-whystats { grid-template-columns:1fr; } }

/* Tighter vertical rhythm than the Remaining 84 page: the consortium page has
 * more, shorter sections, so the 80-150px bands read as empty gaps. The hero
 * also drops the full-viewport height so the film is not followed by a void. */
body #top { min-height:0 !important; padding-bottom:clamp(40px,5vh,64px) !important; }
#why, #mission, #members, #principles, #how, #quote, #join {
  padding-top:clamp(56px,6vw,96px) !important;
  padding-bottom:clamp(56px,6vw,96px) !important;
}
/* the founder quote sits between two full sections; a shorter band */
#quote { padding-top:clamp(36px,3.5vw,56px) !important; padding-bottom:clamp(36px,3.5vw,56px) !important; }

/* One gap between every section heading and the content under it, the same
 * as paicon.com (home.css .h-voices__title): clamp(28px, 4.5vh, 52px). The
 * frontiers heading shares a row with its button, so the row carries it. */
[data-h2] { margin-bottom:clamp(28px,4.5vh,52px) !important; }
[data-frhead] { margin-bottom:clamp(28px,4.5vh,52px) !important; }
[data-frhead] [data-h2] { margin-bottom:0 !important; }

/* One gap between every eyebrow and what follows it, the same as paicon.com
 * (home.css .h-*__eyebrow-row): 10px. The eyebrow sits in its own wrapper. */
section[id] div:has(> [data-eyebrow]) { margin-bottom:10px !important; }

/* Founder quote: the same layout as paicon.com home (.h-founder__grid /
 * .h-founder__photo): .8fr photo column, the photo takes the quote column's
 * height (size containment keeps it out of the row height), and below 900px
 * it drops to a 160px portrait above the quote. */
[data-qgrid] { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:clamp(40px,6vw,90px); align-items:center; }
.r84c-founder__photo { display:flex; flex-direction:column; align-items:center; align-self:stretch; contain:size; }
.r84c-founder__photo img { height:100%; width:auto; max-width:100%; object-fit:cover; display:block; border-radius:14px; }
@media (max-width:900px) {
  [data-qgrid] { grid-template-columns:minmax(0,1fr); gap:26px; }
  .r84c-founder__photo { align-self:auto; contain:none; align-items:flex-start; }
  .r84c-founder__photo img { width:min(45%,160px); height:auto; }
}
/* signature line: paicon.com home .h-founder__by (15px, strong name), in the
 * light-section colours */
.r84c-founder__by { margin:26px 0 0; font-size:15px; line-height:1.6; color:#333B58; }
.r84c-founder__by strong { font-weight:700; color:#0E1633; }
/* the photo takes the quote column's height; give that column the height
 * paicon.com's founder text has (385px at 1440px) so the photo matches it */
@media (min-width:901px) {
  [data-qgrid] > div:last-child { min-height:clamp(280px,26.75vw,385px); display:flex; flex-direction:column; justify-content:center; }
  /* smaller portrait: a fixed height instead of the quote column's height,
   * and the photo column shrinks to the photo */
  [data-qgrid] { grid-template-columns:auto fit-content(880px); justify-content:center; }
  .r84c-founder__photo { contain:none; align-self:center; }
  .r84c-founder__photo img { height:clamp(240px,22vw,320px); width:auto; }
}

/* "What we are building" on phones and tablets: the desktop artwork, cut into
 * pieces (consortium.js clones the SVG with a new viewBox per piece), around
 * real text so nothing drops below readable size. */
.r84c-vizm { display:none; }
@media (max-width:1000px) { .r84c-vizm { display:block; } }
.r84c-vizm__grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.r84c-vizm__card { background:#1A2347; border:1px solid #2A3155; border-radius:14px; padding:10px 10px 14px; }
.r84c-vizm__art svg { display:block; width:100%; height:auto; overflow:hidden; border-radius:14px; }
.r84c-vizm__card h3 { margin:12px 4px 2px; font-weight:800; font-size:16px; letter-spacing:-.01em; color:#FFFFFF; }
.r84c-vizm__card p { margin:0 4px; font-size:13px; line-height:1.45; color:#B8BDD4; }
.r84c-vizm__arrow { display:block; width:24px; height:56px; margin:14px auto; }
.r84c-vizm__hub { width:min(100%,460px); margin:0 auto; }
.r84c-vizm__hub svg { display:block; width:100%; height:auto; overflow:hidden; }
.r84c-vizm__label { margin:10px 0 0; text-align:center; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color:#F19A3E; }
.r84c-vizm__outs { display:grid; grid-template-columns:1fr; gap:10px; width:min(100%,290px); margin:0 auto; } /* narrower than the cards above, centred under the arrow */
.r84c-vizm__out { display:grid; gap:3px; background:#FAF5EC; border:1px solid #EBE2D0; border-radius:14px; padding:14px 16px; }
.r84c-vizm__out strong { font-size:16px; font-weight:800; letter-spacing:-.01em; color:#0E1633; }
.r84c-vizm__out span { font-size:13.5px; line-height:1.45; color:#48506E; }
@media (min-width:601px) and (max-width:1000px) { .r84c-vizm__outs { grid-template-columns:1fr 1fr; width:100%; } }

/* Hero below 1100px: the paicon.com About Us order and gaps (about.css
 * .a-hero__copy): eyebrow, title, film, lede, buttons. The copy column
 * dissolves into the grid, so its row gap sits between every item; margins
 * subtract it where paicon.com does, leaving 32px between lede and buttons
 * and our 10px between eyebrow and title. */
@media (max-width:1100px) {
  #top [data-herogrid] { grid-template-columns:1fr !important; }
  #top [data-herogrid] > div:first-child { display:contents; }
  #top [data-herogrid] > div:first-child > div:first-child { order:1 !important; margin-bottom:calc(10px - clamp(30px,4.5vw,70px)) !important; }
  #top [data-herogrid] > div:first-child > h1 { order:2 !important; margin-bottom:0 !important; }
  #top [data-herogrid] > div:nth-child(2) { order:3 !important; margin:0 !important; justify-content:flex-start !important; }
  #top [data-herogrid] > div:first-child > p { order:4 !important; margin-top:6px !important; }
  #top [data-herogrid] > div:first-child > div:last-child { order:5 !important; margin-top:calc(32px - clamp(30px,4.5vw,70px)) !important; }
  #top .r84c-video { width:100%; }
}

/* Principles on phones: compact rows instead of tall cards, illustration on
 * the left, title and line on the right. */
@media (max-width:600px) {
  .r84c-principles { gap:10px; }
  .r84c-pcard { min-height:0; padding:14px 16px; border-radius:14px; }
  .r84c-pcard__main { display:grid; grid-template-columns:52px 1fr; column-gap:14px; align-items:center; }
  .r84c-pcard__art { grid-row:1 / span 2; width:52px; }
  .r84c-pcard h3 { margin:0; font-size:17px; align-self:end; }
  .r84c-pcard__desc { margin:3px 0 0; font-size:14px; line-height:1.45; align-self:start; }
}

/* Why it matters on phones: the two headline stats side by side, and the
 * country cards as compact rows (figure left; region, title, comparison right). */
@media (max-width:600px) {
  .r84c-whystats { grid-template-columns:1fr 1fr !important; gap:10px; }
  .r84c-big { padding:16px 14px !important; }
  .r84c-big__n { font-size:36px; }
  .r84c-big p { margin-top:8px; font-size:13px; line-height:1.45; }
  .r84c-whypop { gap:10px; margin-top:10px; }
  .r84c-pop { display:grid !important; grid-template-columns:100px 1fr; column-gap:12px; align-items:start; padding:14px 16px !important; }
  .r84c-pop .r84c-card__eyebrow { grid-column:2; grid-row:1; margin:0 0 2px; font-size:11px; letter-spacing:.12em; }
  .r84c-pop__n { grid-column:1; grid-row:1 / span 3; align-self:center; font-size:26px; white-space:nowrap; }
  .r84c-pop__h { grid-column:2; grid-row:2; margin:0; font-size:15px; }
  .r84c-pop__vs { grid-column:2; grid-row:3; margin:3px 0 0; font-size:13px; line-height:1.4; }
}

/* How to join on phones: tighter cards and lists, smaller CTA box. */
@media (max-width:600px) {
  [data-hcols] { gap:10px !important; margin-bottom:10px !important; }
  #how .r84c-card { padding:16px 16px 18px; }
  #how .r84c-card__eyebrow { margin-bottom:8px; }
  #how .r84c-card__h { margin-bottom:6px; font-size:18px; }
  #how .r84c-card__p { font-size:14px; line-height:1.5; }
  #how .r84c-list { gap:7px; }
  #how .r84c-list li { padding-left:16px; font-size:14px; line-height:1.45; }
  [data-hcta] { gap:14px !important; padding:16px !important; }
  [data-hcta] p { font-size:15px !important; line-height:1.5 !important; }
}

/* Founder quote below 900px: eyebrow, then the photo, then the quote. The
 * text column dissolves into the grid so the photo can sit between its
 * eyebrow and the rest. */
@media (max-width:900px) {
  #quote [data-qgrid] { row-gap:0 !important; }
  #quote [data-qgrid] > div:last-child { display:contents; }
  #quote [data-qgrid] > div:last-child > * { order:3; }
  #quote [data-qgrid] > div:last-child > div:first-child { order:1; margin-bottom:14px !important; }
  #quote .r84c-founder__photo { order:2; margin-bottom:20px; }
}