/* ==========================================================================
   RS Society — page sections, v3

   The co-working template's section language, applied to the widgets that were
   already here. Class names are untouched: hero, strip, services, process, why,
   reviews, mission, contact, cta. Colours come from the theme's tokens, so this
   file states no hex of its own beyond the icons.
   ========================================================================== */

/* Elementor wraps each widget in a container; sections that must reach the
   window edge break out of it here rather than in the markup. */
.rs-hero,.rs-cta{ width:100vw; margin-left:calc(50% - 50vw) }

.rs-sec-head{ max-width:640px }
.rs-sec-head h2{ margin-bottom:14px }
.rs-sec-head p{ color:var(--rs-ink-2); margin:0 }
.rs-sec-head--center{ margin-inline:auto; text-align:center }
.rs-sec-head--center .rs-kicker{ justify-content:center }

.rs-kicker{
  display:inline-flex; align-items:center; gap:8px;
  font-size:var(--rs-t-xs); font-weight:600; letter-spacing:.14em;
  text-transform:uppercase; color:var(--rs-brand); margin-bottom:14px;
}
.rs-kicker::before{ content:''; width:18px; height:2px; background:var(--rs-brand); border-radius:2px }

.rs-empty{
  background:var(--rs-sunk); border:1px dashed var(--rs-line-2); border-radius:var(--rs-r);
  padding:22px 24px; color:var(--rs-ink-2);
}

/* ==========================================================================
   HERO
   ========================================================================== */
.rs-hero{ position:relative }
.rs-hero__stage{
  position:relative; min-height:min(88vh,700px); display:flex; align-items:center;
  border-bottom-right-radius:90px; overflow:hidden; isolation:isolate;
}
/* The selector is doubled up deliberately. Elementor ships `.elementor img{
   height:auto }`, which is more specific than a single class and loads after
   this file, so a plain `.rs-hero__bg{ height:100% }` lost — the photograph
   fell back to its own 16:9 shape. On a phone that is 211px of picture in a
   520px hero, and the 309px underneath it were bare gradient with nothing in
   them. Two classes outrank one class and one tag. */
.rs-hero .rs-hero__bg{
  position:absolute; inset:0; width:100%; height:100%;
  /* Centred, and a touch below the middle. Pushed off to 62%/30% it cropped
     to the right-hand third: on a photograph of people round a table that
     threw away everyone on the left and most of the table with them, which
     read as half a picture rather than as a composition. */
  object-fit:cover; object-position:50% 45%; z-index:0;
}
/* Enough to keep white text safe on any photograph somebody uploads, and no
   more. At .92 indigo it repainted the whole hero — every image put behind it
   came out the same violet, which is why swapping the photograph appeared to
   change nothing at all. Neutral navy rather than indigo, so it darkens the
   picture instead of tinting it. */
.rs-hero__scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(90deg, rgba(12,20,34,.62) 0%, rgba(12,20,34,.34) 42%, rgba(12,20,34,.06) 76%, rgba(12,20,34,0) 100%),
    linear-gradient(180deg, rgba(10,16,28,.34) 0%, rgba(10,16,28,0) 30%);
}
.rs-hero__inner{
  position:relative; z-index:2;
  width:100%; max-width:var(--rs-wrap); margin-inline:auto;
  padding:calc(var(--rs-header-h) + clamp(48px,7vw,86px)) var(--rs-gut) clamp(56px,7vw,96px);
}
.rs-hero__eyebrow{
  display:inline-flex; align-items:center; gap:9px;
  color:rgba(255,255,255,.86); font-size:var(--rs-t-xs); font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:18px;
}
.rs-hero__eyebrow::before{ content:''; width:18px; height:2px; background:#fff; border-radius:2px; opacity:.8 }
.rs-hero__title{ color:#fff; max-width:17ch; margin:0 }
.rs-hero .rs-em{ color:#fff; font-weight:700 }
.rs-hero__text{
  color:rgba(255,255,255,.86); max-width:56ch; margin:20px 0 32px; font-size:var(--rs-t-md);
}
.rs-hero__actions{ display:flex; flex-wrap:wrap; gap:14px }
.rs-hero .rs-btn--on-deep,
.rs-hero .rs-btn--primary{ background:var(--rs-brand); color:#fff; box-shadow:var(--rs-shadow-brand) }
.rs-hero .rs-btn--on-deep:hover,
.rs-hero .rs-btn--primary:hover{ background:var(--rs-brand-dark); color:#fff }
.rs-hero .rs-btn--ghost{
  background:rgba(255,255,255,.10); color:#fff; border:1px solid rgba(255,255,255,.34); box-shadow:none;
}
.rs-hero .rs-btn--ghost:hover{ background:rgba(255,255,255,.18); color:#fff; border-color:rgba(255,255,255,.5) }
.rs-hero__foot{
  position:absolute; z-index:2; left:0; right:0; bottom:0;
  max-width:var(--rs-wrap); margin-inline:auto;
  padding:0 var(--rs-gut) 26px;
  display:flex; justify-content:space-between; gap:16px;
  color:rgba(255,255,255,.62); font-size:var(--rs-t-xs); letter-spacing:.04em;
}
.rs-hero__foot i{ font-style:normal }

@media (max-width:1000px){
  /* the header is solid and in the flow below this width, so the hero no longer
     has to leave room for it */
  .rs-hero__inner{ padding-top:clamp(48px,9vw,72px) }
}
@media (max-width:900px){
  .rs-hero__stage{ min-height:520px; border-bottom-right-radius:52px }
  /* Narrow screens crop hard, so favour the middle of the group. */
  .rs-hero__bg{ object-position:56% 40% }
  .rs-hero__foot{ display:none }
}

/* ==========================================================================
   PROMISE STRIP — the reference's solid blue panel, carrying the four promises
   ========================================================================== */
.rs-strip{ padding:clamp(36px,5vw,64px) 0 0 }
.rs-strip__list{
  list-style:none; display:grid; gap:26px 34px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  background:var(--rs-brand); color:#fff; border-radius:var(--rs-r);
  padding:clamp(30px,4vw,44px) clamp(26px,4vw,48px);
  box-shadow:0 18px 44px rgba(var(--rs-brand-rgb),.26);
  max-width:var(--rs-wrap); margin-inline:auto;
}
.rs-strip__list li{ display:block }
.rs-strip__list strong{
  display:block; font-size:clamp(1.5rem,2.6vw,2rem); font-weight:700; line-height:1.1; color:#fff;
}
.rs-strip__list span{
  display:block; margin-top:6px; color:rgba(255,255,255,.78); font-size:var(--rs-t-sm);
}

/* ==========================================================================
   SERVICES — white cards with a tinted icon chip
   ========================================================================== */
.rs-services{ padding:clamp(56px,7vw,100px) 0 }
.rs-services .rs-sec-head{ margin-inline:auto; text-align:center }
.rs-services .rs-sec-head .rs-kicker{ justify-content:center }

/* Flex rather than grid, so a row that is not full centres itself.
   With six cards in a four-column layout, grid left-aligned the last two and
   the section looked broken; this centres the remainder instead. */
.rs-cards{
  --gap:26px; --cols:4;
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:var(--gap); margin-top:48px;
}
.rs-cards > *{
  flex:0 1 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));
  min-width:230px;
}
.rs-cards--2{ --cols:2 }
.rs-cards--3{ --cols:3 }
.rs-cards--4{ --cols:4 }

/* A single card should not stretch across the whole page. */
.rs-cards > *{ max-width:460px }

/* ---- the row length picks itself from how many cards there are ------------
   Six cards in a four-wide row leaves a lopsided pair underneath; six in a
   three-wide row is two clean rows. These count-based rules override the
   widget's column setting only where an even split exists, and everything
   else falls back to centring the remainder.

   Browsers without :has() simply keep the widget's setting, which is the old
   behaviour rather than a broken one. */
.rs-cards:has(> :nth-child(2):last-child){ --cols:2 }
.rs-cards:has(> :nth-child(3):last-child){ --cols:3 }
.rs-cards:has(> :nth-child(4):last-child){ --cols:4 }
.rs-cards:has(> :nth-child(5):last-child){ --cols:3 }   /* 3 + 2 centred */
.rs-cards:has(> :nth-child(6):last-child){ --cols:3 }   /* 3 + 3 */
.rs-cards:has(> :nth-child(7):last-child){ --cols:4 }   /* 4 + 3 centred */
.rs-cards:has(> :nth-child(8):last-child){ --cols:4 }   /* 4 + 4 */
.rs-cards:has(> :nth-child(9):last-child){ --cols:3 }   /* 3 + 3 + 3 */
.rs-cards:has(> :nth-child(10):last-child){ --cols:4 }  /* 4 + 4 + 2 centred */
.rs-cards:has(> :nth-child(12):last-child){ --cols:4 }  /* 4 + 4 + 4 */

.rs-card-item{
  position:relative; background:var(--rs-surface); border-radius:var(--rs-r);
  padding:30px 26px 32px; box-shadow:var(--rs-shadow-2);
  transition:transform .2s ease, box-shadow .2s ease;
}
.rs-card-item:hover{ transform:translateY(-4px); box-shadow:var(--rs-shadow-3) }

/* The icon chip. The glyphs are inline SVG data URIs so the design needs no
   icon font and no extra request; they cycle, so a fifth card starts again at
   the first. */
.rs-card-item::before{
  content:''; display:block; width:48px; height:48px; margin-bottom:20px;
  /* A circle, as on the reference. The card keeps its own soft corners; the
     chip does not echo them. */
  border-radius:50%; background-color:var(--rs-brand-soft);
  background-repeat:no-repeat; background-position:center; background-size:24px 24px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6 2h7l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z' fill-rule='evenodd'/%3E%3Cpath d='M13 2v5h5z' fill='%23fff' opacity='.45'/%3E%3Crect x='7.5' y='12' width='9' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='7.5' y='15.6' width='6' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E");
  transition:background-color .2s ease;
}
.rs-card-item:nth-child(5n+2)::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M3 8.4h18v1.7H3zM9.3 9h1.7v11H9.3z' fill='%23fff'/%3E%3Crect x='12.6' y='12' width='5.6' height='1.5' rx='.75' fill='%23fff'/%3E%3Crect x='12.6' y='15.4' width='3.4' height='1.5' rx='.75' fill='%23fff'/%3E%3C/svg%3E");
}
.rs-card-item:nth-child(5n+3)::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='3' y='13' width='4' height='8' rx='1.2'/%3E%3Crect x='10' y='6.5' width='4' height='14.5' rx='1.2'/%3E%3Crect x='17' y='10' width='4' height='11' rx='1.2'/%3E%3C/svg%3E");
}
.rs-card-item:nth-child(5n+4)::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M21.6 2.4a1.1 1.1 0 0 1 .2 1.2l-7 17.6a1.1 1.1 0 0 1-2-.1l-2.9-6.5 4.6-5.5-6.3 3.9L2.5 10a1.1 1.1 0 0 1 .1-2l17.8-5.8a1.1 1.1 0 0 1 1.2.2z'/%3E%3C/svg%3E");
}
.rs-card-item:nth-child(5n+5)::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.2 4 5.7v5.6c0 5 3.6 9.3 8 10.5 4.4-1.2 8-5.5 8-10.5V5.7z'/%3E%3Cpath d='m10.9 14.8-3-3 1.5-1.5 1.5 1.5 3.7-3.7 1.5 1.5z' fill='%23fff'/%3E%3C/svg%3E");
}
.rs-card-item:hover::before{ background-color:#E0E4FC }

/* The service's own name. At the theme's 1.05rem it sat only a whisker above
   the 0.95rem description under it, so a card read as one block of text with no
   obvious title. Raised until the two are plainly different things. */
.rs-card-item h3{
  margin:0 0 9px;
  font-size:1.24rem;
  line-height:1.26;
  letter-spacing:-.005em;
  color:var(--rs-ink);
}
.rs-card-item p{ font-size:var(--rs-t-sm); color:var(--rs-ink-2); margin:0 }
.rs-card-item__n{
  position:absolute; top:24px; right:26px; font-size:var(--rs-t-xs);
  font-weight:700; color:var(--rs-ink-3);
}
.rs-card-item__link{
  display:inline-flex; align-items:center; gap:7px; margin-top:18px;
  font-size:var(--rs-t-sm); font-weight:600; color:var(--rs-brand);
}
.rs-card-item__link span{ transition:transform .18s ease }
.rs-card-item:hover .rs-card-item__link span{ transform:translateX(3px) }
.rs-card-item__link:hover{ color:var(--rs-brand-dark) }

/* ==========================================================================
   PROCESS — numbered steps
   ========================================================================== */
.rs-process{ padding:clamp(40px,6vw,80px) 0 }
.rs-steps-list{
  list-style:none; display:grid; gap:26px; margin-top:48px;
  grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  counter-reset:none;
}
.rs-steps-list__item{
  position:relative; background:var(--rs-surface); border-radius:var(--rs-r);
  padding:28px 24px 30px; box-shadow:var(--rs-shadow-2);
}
.rs-steps-list__num{
  display:grid; place-items:center; width:44px; height:44px; border-radius:10px;
  background:var(--rs-brand); color:#fff; font-size:.85rem; font-weight:700;
  box-shadow:0 10px 22px rgba(var(--rs-brand-rgb),.28); margin-bottom:18px;
}
.rs-steps-list__item h3{ margin:0 0 8px; font-size:1rem }
.rs-steps-list__item p{ margin:0; font-size:var(--rs-t-sm); color:var(--rs-ink-2) }

/* ==========================================================================
   WHY — photograph on one side, copy on the other, chips floating on the frame
   ========================================================================== */
.rs-why{ position:relative; padding:clamp(56px,7vw,96px) 0 }
.rs-why::before{
  content:''; position:absolute; z-index:-1; left:-8%; top:8%;
  width:min(520px,60vw); aspect-ratio:1; border-radius:50%; background:var(--rs-sunk);
}
.rs-why__grid{ display:grid; gap:44px; align-items:center }
@media (min-width:980px){ .rs-why__grid{ grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:64px } }

.rs-why__media{ position:relative }
.rs-why__frame{ border-radius:var(--rs-r); overflow:hidden; box-shadow:0 20px 50px rgba(22,25,59,.16) }
.rs-why__frame img{ width:100%; aspect-ratio:4/3; object-fit:cover }
.rs-why__frame--empty{
  display:grid; place-items:center; aspect-ratio:4/3; background:var(--rs-sunk);
  border:1px dashed var(--rs-line-2);
}
.rs-why__frame--empty span{ color:var(--rs-ink-3); font-size:var(--rs-t-sm) }

/* the two floating cards over the photograph, as the reference does */
.rs-why__chip{
  position:absolute; width:min(250px,72%); border-radius:10px; padding:18px 20px 20px;
}
.rs-why__chip b{ display:block; font-size:1.06rem; font-weight:700; line-height:1.2 }
.rs-why__chip span{ display:block; margin-top:4px; font-size:var(--rs-t-xs); line-height:1.6 }
.rs-why__chip--ink{
  left:-26px; bottom:-24px; background:var(--rs-brand); color:#fff;
  box-shadow:0 20px 44px rgba(var(--rs-brand-rgb),.34);
}
.rs-why__chip--ink span{ color:rgba(255,255,255,.82) }
.rs-why__chip--light{
  right:-22px; top:-22px; background:#fff; color:var(--rs-ink);
  box-shadow:var(--rs-shadow-3); width:min(210px,60%);
}
.rs-why__chip--light span{ color:var(--rs-ink-2) }
@media (max-width:640px){
  .rs-why__chip--ink{ left:10px; bottom:-18px; width:min(230px,84%) }
  .rs-why__chip--light{ right:8px; top:-14px; width:min(190px,64%) }
}

.rs-why__copy h2{ margin-bottom:16px }
.rs-why__lede{ color:var(--rs-ink-2); margin:0 0 22px }
.rs-tags{ display:flex; flex-wrap:wrap; gap:9px; margin-bottom:24px }
.rs-tags span{
  background:var(--rs-brand-soft); color:var(--rs-brand); border-radius:var(--rs-pill);
  padding:7px 14px; font-size:var(--rs-t-xs); font-weight:600;
}
.rs-points{ margin:0 0 28px; display:grid; gap:18px }
.rs-points__item{ padding-left:30px; position:relative }
.rs-points dt{ color:var(--rs-ink); font-weight:600; font-size:.95rem; margin-bottom:4px }
.rs-points dt::before{
  content:''; position:absolute; left:0; top:4px; width:20px; height:20px; border-radius:6px;
  background:var(--rs-brand-soft) no-repeat center/12px 12px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233B4EE3' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12 5 5L19 7'/%3E%3C/svg%3E");
}
.rs-points dd{ margin:0; font-size:var(--rs-t-sm); color:var(--rs-ink-2) }

/* ==========================================================================
   REVIEWS
   ========================================================================== */
.rs-reviews{
  padding:clamp(56px,7vw,96px) 0; background:var(--rs-sunk);
  width:100vw; margin-left:calc(50% - 50vw);
}
.rs-reviews > *{ max-width:var(--rs-wrap); margin-inline:auto; padding-inline:var(--rs-gut) }
.rs-reviews__list{
  list-style:none; display:grid; gap:26px; margin-top:46px;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
}
.rs-review{
  background:#fff; border-radius:var(--rs-r); padding:30px 28px; box-shadow:var(--rs-shadow-2);
}
/* The stars sit above the quote, so the card reads rating-first the way a
   review is scanned. Amber rather than the brand blue: a star that is not
   gold reads as a decoration instead of a score. */
.rs-review__stars{ display:flex; gap:3px; margin-bottom:16px }
.rs-review__stars svg{ width:17px; height:17px; fill:#E3E5EF }
.rs-review__stars svg.is-on{ fill:#F5B301 }

/* The oversized quote glyph went with the stars: two openers on one small
   card is one too many, and the stars are the thing being read first. */
.rs-review__quote{
  margin:0; font-size:var(--rs-t-md); color:var(--rs-ink-2);
}
.rs-review__who{
  display:flex; align-items:center; gap:12px; margin-top:22px; padding-top:18px;
  border-top:1px solid var(--rs-line);
}
.rs-review__pic{ width:44px; height:44px; border-radius:50%; object-fit:cover }
.rs-review__who strong{ display:block; color:var(--rs-ink); font-size:.9rem }
.rs-review__who span{ display:block; font-size:var(--rs-t-xs); color:var(--rs-ink-3) }

/* ==========================================================================
   MISSION
   ========================================================================== */
/* ------------------------------------------------------------- the panel */
/* A block sitting on its own soft ground, rounded off, so it reads as a thing
   on the page rather than as more of the white above it. The cards stay white
   on top of it, which is what gives them their edge — on white ground they
   were only a shadow.

   Three places use it. Written once, so they cannot drift apart:

     .rs-mission     the About page's "who we are"
     .rs-services    "what we do"
     .rs-why         "why us"

   All three, on every page. Why us was held back to the home page while it sat
   directly against the already-panelled "who we are" on About — two of them
   touching read as one flat slab with a seam across it. With the story block
   between them there is white ground in between, so each reads as its own. */
.rs-mission,
.rs-services,
.rs-why{
  position:relative;
  /* Edge to edge, by the same move the hero and the closing band already use:
     step out of Elementor's container and take the window's width. Sitting
     inside that container left a white gutter down each side while the hero
     above ran to the edges, and the panel read as a narrow slab floating in
     the middle of the page.

     The padding then does the work the container used to: max() keeps the
     words on the same 1140px column as every other section, and never lets the
     inset fall below a thumb's width on a phone. */
  width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
  padding-block:clamp(40px,5vw,72px) clamp(48px,6vw,80px);
  padding-inline:max(clamp(16px,4vw,24px), calc(50vw - (var(--rs-wrap, 1140px) / 2)));
  border-radius:0;
  background:linear-gradient(168deg, #EEF1F9 0%, #E7ECF7 46%, #EFF2FA 100%);
}

/* A negative margin can push a panel wider than the window on a narrow screen,
   which gives the whole page a sideways scrollbar. Below the point where the
   layout stacks, it sits flush instead. */
@media (max-width:640px){
  .rs-mission,
  .rs-services,
  .rs-why{
    padding-inline:clamp(14px,4vw,20px);
  }
}

/* Why us draws a pale circle of its own to hint at a panel. With a real one
   under it, that is only a smudge on top. */
.rs-why::before{ display:none }
.rs-mission__grid{
  display:grid; gap:26px; margin-top:46px;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
}
.rs-mission__card{
  position:relative; background:#fff; border-radius:var(--rs-r);
  padding:30px 26px 32px; box-shadow:var(--rs-shadow-2);
}
.rs-mission__n{
  display:grid; place-items:center; width:52px; height:52px; border-radius:50%;
  background:var(--rs-brand-soft); color:var(--rs-brand);
  font-size:.85rem; font-weight:700; margin-bottom:18px;
}
/* With an icon there is nothing to centre and no number to read: the chip is
   the drawing. The number stays for a card whose heading says nothing any of
   the rules recognise. */
.rs-mission__n--icon{
  background:var(--rs-brand-soft) no-repeat center/26px 26px;
  font-size:0;
}
.rs-mission__card h3{ margin:0 0 10px }
.rs-mission__card p{ margin:0; font-size:var(--rs-t-sm); color:var(--rs-ink-2) }

/* ==========================================================================
   CONTACT
   ========================================================================== */
.rs-contact{ padding:clamp(56px,7vw,96px) 0 }
.rs-contact__intro{ max-width:640px; margin-inline:auto; text-align:center }
.rs-contact h2{ margin-bottom:14px }
.rs-contact__lede{ color:var(--rs-ink-2) }
.rs-contact__main{ display:grid; gap:26px; margin-top:44px; align-items:start }
@media (min-width:980px){ .rs-contact__main{ grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr); gap:32px } }
.rs-contact__grid{ display:grid; gap:26px; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)) }

.rs-contact__card{
  background:var(--rs-deep); color:var(--rs-on-deep); border-radius:var(--rs-r);
  padding:32px 30px; box-shadow:var(--rs-shadow-3);
}
.rs-contact__card-title{ color:#fff; margin:0 0 22px; font-size:1.05rem }
.rs-contact__ways{ list-style:none; margin:0 0 26px }
.rs-contact__ways li{
  padding:16px 0; border-bottom:1px solid rgba(255,255,255,.10);
  display:flex; align-items:flex-start; gap:14px;
}
.rs-contact__ways li:last-child{ border-bottom:0 }
/* each way to reach a person gets its own mark, so the eye can jump to the
   one it wants instead of reading four labels */
.rs-contact__ic{
  flex:none; width:36px; height:36px; border-radius:9px;
  background:rgba(255,255,255,.10); display:grid; place-items:center;
}
.rs-contact__ic svg{
  width:17px; height:17px; fill:none; stroke:#fff; stroke-width:1.7;
  stroke-linecap:round; stroke-linejoin:round;
}
.rs-contact__body{ display:grid; gap:2px; min-width:0 }
.rs-contact__k{
  font-size:var(--rs-t-xs); text-transform:uppercase; letter-spacing:.12em;
  color:var(--rs-on-deep-2);
}
.rs-contact__body a,
.rs-contact__body > span:last-child{ color:#fff; font-weight:500; overflow-wrap:anywhere }
.rs-contact__body a:hover{ color:var(--rs-em-on-dark) }
.rs-contact__empty{ color:var(--rs-on-deep); font-size:var(--rs-t-sm); margin-bottom:26px }

/* The spam trap. Its hide rule used to live only in the portal stylesheet,
   which the contact page does not load — so the honeypot was on display as a
   field called "Leave this field empty". */
.rs-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden }
.rs-contact__card-cta{ width:100%; background:#fff; color:var(--rs-brand); border:0 }
.rs-contact__card-cta:hover{ background:#fff; color:var(--rs-brand-dark) }

/* the enquiry form */
.rs-cform__box{
  background:#fff; border-radius:var(--rs-r); padding:32px 30px; box-shadow:var(--rs-shadow-2);
}
.rs-cform__title{ margin:0 0 6px; font-size:1.1rem }
.rs-cform__note{ color:var(--rs-ink-2); font-size:var(--rs-t-sm); margin:0 0 22px }
.rs-cform__grid{ display:grid; gap:16px; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)) }
.rs-cform .rs-field--wide{ grid-column:1/-1 }
.rs-cform .rs-field label{
  display:block; font-size:var(--rs-t-xs); font-weight:600; color:var(--rs-ink);
  margin-bottom:7px; letter-spacing:.02em;
}
.rs-cform input[type="text"],
.rs-cform input[type="email"],
.rs-cform input[type="tel"],
.rs-cform select,
.rs-cform textarea{
  width:100%; font:inherit; font-size:16px; padding:13px 15px; color:var(--rs-ink);
  background:#fff; border:1px solid var(--rs-line-2); border-radius:var(--rs-r-sm);
}
.rs-cform input:focus,
.rs-cform select:focus,
.rs-cform textarea:focus{
  outline:none; border-color:var(--rs-brand); box-shadow:0 0 0 3px rgba(var(--rs-brand-rgb),.14);
}
.rs-cform textarea{ min-height:130px; resize:vertical }
.rs-cform .rs-req{ color:var(--rs-brand) }
.rs-cform .rs-optional{ color:var(--rs-ink-3); font-weight:500 }
.rs-cform .rs-help{ font-size:var(--rs-t-xs); color:var(--rs-ink-3); margin-top:6px }
.rs-cform .rs-error{ font-size:var(--rs-t-xs); color:var(--rs-bad); margin-top:6px }
.rs-cform .rs-error--form{
  background:var(--rs-bad-soft); border-radius:var(--rs-r-sm); padding:12px 14px; margin-bottom:16px;
}
.rs-cform .is-invalid input,
.rs-cform .is-invalid textarea{ border-color:var(--rs-bad) }
.rs-cform__tick{ display:flex; gap:10px; align-items:flex-start; margin-top:18px; font-size:var(--rs-t-sm) }
.rs-cform__foot{ margin-top:22px }
.rs-cform__foot .rs-btn[disabled]{ opacity:.6; cursor:default; transform:none }
.rs-cform__done{
  background:var(--rs-brand-soft); border-radius:var(--rs-r); padding:30px 28px;
}
.rs-cform__done h3{ margin:0 0 8px; color:var(--rs-brand) }
.rs-cform__done p{ margin:0; color:var(--rs-ink-2) }

/* ==========================================================================
   CALL TO ACTION — the solid blue band before the footer
   ========================================================================== */
.rs-cta{ background:var(--rs-brand); color:#fff; text-align:center }
.rs-cta__inner{
  position:relative; max-width:var(--rs-wrap); margin-inline:auto;
  padding:clamp(56px,7vw,92px) var(--rs-gut);
}
.rs-cta__inner::before{ content:none }
.rs-cta h2{ color:#fff; margin:0 auto 16px; max-width:20ch }
.rs-cta .rs-em{ color:#fff }
.rs-cta p{ color:rgba(255,255,255,.85); max-width:54ch; margin:0 auto 30px }
.rs-cta .rs-btn--on-deep{ background:#fff; color:var(--rs-brand); box-shadow:0 10px 26px rgba(0,0,0,.16) }
.rs-cta .rs-btn--on-deep:hover{ background:#fff; color:var(--rs-brand-dark) }
/* the ghosted wordmark belonged to the previous design */
.rs-cta__wordmark{ display:none }

.rs-portal-editnote{
  background:var(--rs-brand-soft); border-radius:var(--rs-r-sm); padding:12px 14px;
  font-size:var(--rs-t-sm); color:var(--rs-ink-2);
}

/* ==========================================================================
   POINTER EFFECTS
   --------------------------------------------------------------------------
   Carried over from the NRCSF site: cards that lean towards the pointer,
   buttons that reach for it.

   Only the surfaces are here. Whether any of it runs at all is decided in
   liquid.js, which switches the whole thing off on touchscreens and for
   anybody whose system asks for less motion — so every rule below is behind
   .rs-liquid, a class that script adds and nothing else does.
   ========================================================================== */

/* Cards. The transition is only on the way out: going in, the transform is
   rewritten every frame from the pointer, and a transition there would make
   the card lag behind the cursor it is supposed to be following. */
.rs-liquid .rs-card-item,
.rs-liquid .rs-steps-list__item,
.rs-liquid .rs-review,
.rs-liquid .rs-promise,
.rs-liquid .rs-mission__item,
.rs-liquid .rs-contact__card,
.rs-liquid .rs-why__frame{
  transition:transform .42s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease;
  transform-style:preserve-3d;
  will-change:transform;
}
.rs-liquid .rs-card-item:hover,
.rs-liquid .rs-steps-list__item:hover,
.rs-liquid .rs-review:hover,
.rs-liquid .rs-promise:hover,
.rs-liquid .rs-mission__item:hover,
.rs-liquid .rs-contact__card:hover,
.rs-liquid .rs-why__frame:hover{
  transition:box-shadow .3s ease;
  box-shadow:0 26px 60px rgba(22,25,59,.15);
}

/* A line that draws itself across the top of a card, left to right. Two
   pixels of movement that tell you which card you are on. */
.rs-liquid .rs-card-item,
.rs-liquid .rs-steps-list__item,
.rs-liquid .rs-review,
.rs-liquid .rs-promise,
.rs-liquid .rs-mission__item{ position:relative; overflow:hidden }

.rs-liquid .rs-card-item::after,
.rs-liquid .rs-steps-list__item::after,
.rs-liquid .rs-review::after,
.rs-liquid .rs-promise::after,
.rs-liquid .rs-mission__item::after{
  content:''; position:absolute; left:0; right:0; top:0; height:3px;
  background:linear-gradient(90deg, var(--rs-brand), var(--rs-brand-lift));
  transform:scaleX(0); transform-origin:left center;
  transition:transform .42s cubic-bezier(.22,.61,.36,1);
}
.rs-liquid .rs-card-item:hover::after,
.rs-liquid .rs-steps-list__item:hover::after,
.rs-liquid .rs-review:hover::after,
.rs-liquid .rs-promise:hover::after,
.rs-liquid .rs-mission__item:hover::after{ transform:scaleX(1) }

/* The icon chip turns a little as the card lifts. */
.rs-liquid .rs-card-item::before{
  transition:background-color .2s ease, transform .42s cubic-bezier(.22,.61,.36,1);
}
.rs-liquid .rs-card-item:hover::before{ transform:rotate(-8deg) scale(1.08) }

/* The step number does the same. */
.rs-liquid .rs-steps-list__num{
  transition:transform .42s cubic-bezier(.22,.61,.36,1);
}
.rs-liquid .rs-steps-list__item:hover .rs-steps-list__num{ transform:rotate(-8deg) scale(1.08) }

/* Buttons that reach for the cursor. Same reasoning on the transition: out
   only, or the button trails the pointer instead of meeting it. */
.rs-liquid .rs-hero__actions .rs-btn,
.rs-liquid .rs-cta .rs-btn,
.rs-liquid .rs-why__copy .rs-btn{
  transition:transform .4s cubic-bezier(.22,.61,.36,1), background-color .2s ease, box-shadow .2s ease;
  will-change:transform;
}
.rs-liquid .rs-hero__actions .rs-btn:hover,
.rs-liquid .rs-cta .rs-btn:hover,
.rs-liquid .rs-why__copy .rs-btn:hover{
  transition:background-color .2s ease, box-shadow .2s ease;
}

/* The photograph in Why us sits in a frame that lifts with everything else,
   and the picture inside it drifts in a touch. */
.rs-liquid .rs-why__frame{ overflow:hidden }
.rs-liquid .rs-why__frame img{ transition:transform .6s cubic-bezier(.22,.61,.36,1) }
.rs-liquid .rs-why__frame:hover img{ transform:scale(1.045) }

/* Last word to the person, not to us. */
@media (prefers-reduced-motion:reduce){
  .rs-liquid .rs-card-item,
  .rs-liquid .rs-steps-list__item,
  .rs-liquid .rs-review,
  .rs-liquid .rs-promise,
  .rs-liquid .rs-mission__item,
  .rs-liquid .rs-contact__card,
  .rs-liquid .rs-why__frame,
  .rs-liquid .rs-why__frame img,
  .rs-liquid .rs-btn{ transition:none !important; transform:none !important }
}


/* A point can carry its own icon instead of the shared tick. The drawings are
   the same ones the service cards use — one set, named once — so the two
   sections cannot end up with different pictures for the same idea.

   The chip itself keeps the size and colour the tick had: this is a change of
   picture, not a change of layout, and a point that chose nothing still gets
   the tick exactly as before. */
.rs-points__item[data-icon="document"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6 2h7l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z' fill-rule='evenodd'/%3E%3Cpath d='M13 2v5h5z' fill='%23fff' opacity='.45'/%3E%3Crect x='7.5' y='12' width='9' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='7.5' y='15.6' width='6' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="clipboard"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 4h2.2a2.8 2.8 0 0 1 5.6 0H17a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3Crect x='9.6' y='1.6' width='4.8' height='3.4' rx='1.2' fill='%23fff' opacity='.55'/%3E%3Crect x='8' y='11' width='8' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='8' y='14.8' width='5.5' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="table"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M3 8.4h18v1.7H3zM9.3 9h1.7v11H9.3z' fill='%23fff'/%3E%3Crect x='12.6' y='12' width='5.6' height='1.5' rx='.75' fill='%23fff'/%3E%3Crect x='12.6' y='15.4' width='3.4' height='1.5' rx='.75' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="chart"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='3' y='13' width='4' height='8' rx='1.2'/%3E%3Crect x='10' y='6.5' width='4' height='14.5' rx='1.2'/%3E%3Crect x='17' y='10' width='4' height='11' rx='1.2'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="trend"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M3 3.2a1.1 1.1 0 0 1 1.1 1.1v15.4h15.7a1.1 1.1 0 0 1 0 2.2H3.6A1.6 1.6 0 0 1 2 20.3V4.3A1.1 1.1 0 0 1 3 3.2z'/%3E%3Cpath d='m8.3 15.6 3.2-4.1 2.7 2.6 4.2-6a1.1 1.1 0 1 1 1.8 1.3l-5 7.1-2.8-2.7-2.9 3.7a1.1 1.1 0 0 1-1.8-1.3z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="microscope"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='5' y='20' width='14' height='2.1' rx='1.05'/%3E%3Crect x='8.2' y='16.6' width='2.1' height='4' rx='1'/%3E%3Cpath d='M10.6 8.2a5.9 5.9 0 0 0-3 10.4h5a1 1 0 0 0 0-2H9.3a3.9 3.9 0 0 1 2.2-6.6z'/%3E%3Cpath d='M13.3 2.6a2.2 2.2 0 0 1 3 .8l1.7 3a2.2 2.2 0 0 1-.8 3l-3 1.7-3.9-6.8z'/%3E%3Crect x='10' y='10.1' width='3.6' height='1.7' rx='.85' transform='rotate(-30 10 10.1)'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="flask"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9 2h6a1 1 0 0 1 0 2h-.4v5.3l5.3 9.9A2.1 2.1 0 0 1 18 22.3H6a2.1 2.1 0 0 1-1.9-3.1L9.4 9.3V4H9a1 1 0 0 1 0-2z'/%3E%3Cpath d='M7.4 15h9.2l1.1 2H6.3z' fill='%23fff' opacity='.5'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="book"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.4 2H20a1 1 0 0 1 1 1v14.3H6.4a2.6 2.6 0 0 0-2.6 2.6V4.6A2.6 2.6 0 0 1 6.4 2z'/%3E%3Cpath d='M6.4 19.3H21V22H6.4a1.35 1.35 0 0 1 0-2.7z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="pen"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M16.1 2.6a2.6 2.6 0 0 1 3.7 0l1.6 1.6a2.6 2.6 0 0 1 0 3.7l-1.5 1.5-5.3-5.3z'/%3E%3Cpath d='m13.2 5.5 5.3 5.3L8.2 21H4a1 1 0 0 1-1-1v-4.2z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="search"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M11 3a8 8 0 1 0 4.9 14.3l3.4 3.4a1.3 1.3 0 0 0 1.9-1.9l-3.4-3.4A8 8 0 0 0 11 3zm0 2.4A5.6 5.6 0 1 1 11 16.6 5.6 5.6 0 0 1 11 5.4z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="shield"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.2 4 5.7v5.6c0 5 3.6 9.3 8 10.5 4.4-1.2 8-5.5 8-10.5V5.7z'/%3E%3Cpath d='m10.9 14.8-3-3 1.5-1.5 1.5 1.5 3.7-3.7 1.5 1.5z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="people"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='9' cy='7.6' r='3.7'/%3E%3Cpath d='M9 13.2c-3.6 0-6.6 2.4-6.6 5.4V21h13.2v-2.4c0-3-3-5.4-6.6-5.4z'/%3E%3Ccircle cx='17.4' cy='8.8' r='2.9'/%3E%3Cpath d='M17.4 13.4c-1 0-1.9.2-2.7.5a7.8 7.8 0 0 1 2.9 4.7V21H22v-2.6c0-2.7-2.1-5-4.6-5z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="chat"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M5 3h14a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3H9.4L4.6 20.9A1 1 0 0 1 3 20.1V6a3 3 0 0 1 2-3z'/%3E%3Crect x='7' y='7.6' width='10' height='1.8' rx='.9' fill='%23fff'/%3E%3Crect x='7' y='11.2' width='6.4' height='1.8' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="send"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M21.6 2.4a1.1 1.1 0 0 1 .2 1.2l-7 17.6a1.1 1.1 0 0 1-2-.1l-2.9-6.5 4.6-5.5-6.3 3.9L2.5 10a1.1 1.1 0 0 1 .1-2l17.8-5.8a1.1 1.1 0 0 1 1.2.2z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="award"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='12' cy='8.6' r='6.1'/%3E%3Cpath d='m7.4 14.3-1.8 7.2a.8.8 0 0 0 1.2.9L12 19.4l5.2 3a.8.8 0 0 0 1.2-.9l-1.8-7.2a8 8 0 0 1-9.2 0z'/%3E%3Cpath d='m10.9 11.5-2.2-2.2 1.4-1.4 1.4 1.4 2.9-2.9 1.4 1.4z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="globe"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2.2c1.3 0 2.8 2.1 3.4 5.2H8.6C9.2 6.3 10.7 4.2 12 4.2zM4.4 11h2.3c.1-2 .4-3.8 1-5.2A7.9 7.9 0 0 0 4.4 11zm0 2h2.3c.1 2 .4 3.8 1 5.2A7.9 7.9 0 0 1 4.4 13zm4.2 0h6.8c-.6 3.1-2.1 5.2-3.4 5.2S9.2 16.1 8.6 13zM17.3 11c-.1-2-.4-3.8-1-5.2a7.9 7.9 0 0 1 3.3 5.2zm0 2h2.3a7.9 7.9 0 0 1-3.3 5.2c.6-1.4.9-3.2 1-5.2z' fill-rule='evenodd'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="calendar"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 2a1 1 0 0 1 1 1v1.4h8V3a1 1 0 1 1 2 0v1.4h1a3 3 0 0 1 3 3v.7H2v-.7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1z'/%3E%3Cpath d='M2 10.1h20V19a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3z'/%3E%3Crect x='6.4' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3Crect x='11.6' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="briefcase"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9.6 3h4.8a2.6 2.6 0 0 1 2.6 2.6v1.3h-2.2V5.6a.4.4 0 0 0-.4-.4H9.6a.4.4 0 0 0-.4.4v1.3H7V5.6A2.6 2.6 0 0 1 9.6 3z'/%3E%3Cpath d='M3 8.9h18a2 2 0 0 1 2 2V12H1v-1.1a2 2 0 0 1 2-2z'/%3E%3Cpath d='M1 14h9v1a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-1h9v4.4a2.6 2.6 0 0 1-2.6 2.6H3.6A2.6 2.6 0 0 1 1 18.4z'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="graduation"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.6 1.4 7.6 12 12.6l10.6-5z'/%3E%3Cpath d='M5.6 11.2v4.3c0 1.9 2.9 3.4 6.4 3.4s6.4-1.5 6.4-3.4v-4.3L12 14.4z'/%3E%3Cpath d='M21.6 8.6a.9.9 0 0 1 .9.9v5.3a.9.9 0 0 1-1.8 0V9.5a.9.9 0 0 1 .9-.9z'/%3E%3Ccircle cx='21.6' cy='16.3' r='1.5'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="passport"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.6 1.8h10.8a2.4 2.4 0 0 1 2.4 2.4v15.6a2.4 2.4 0 0 1-2.4 2.4H6.6a2.4 2.4 0 0 1-2.4-2.4V4.2a2.4 2.4 0 0 1 2.4-2.4z'/%3E%3Cpath d='M12 5.4a4.3 4.3 0 1 0 0 8.6 4.3 4.3 0 0 0 0-8.6zm0 1.5c.5 0 1.2.8 1.5 2.1h-3c.3-1.3 1-2.1 1.5-2.1zM8.1 9h1.2c.1-.8.2-1.5.4-2.1A2.9 2.9 0 0 0 8.1 9zm0 1.4h1.2c.1.8.2 1.5.4 2.1a2.9 2.9 0 0 1-1.6-2.1zm2.6 0h2.6c-.3 1.3-1 2.1-1.3 2.1s-1-.8-1.3-2.1zm4-1.4h1.2a2.9 2.9 0 0 0-1.6-2.1c.2.6.3 1.3.4 2.1zm0 1.4h1.2a2.9 2.9 0 0 1-1.6 2.1c.2-.6.3-1.3.4-2.1z' fill='%23fff' fill-rule='evenodd'/%3E%3Crect x='8.4' y='16.4' width='7.2' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-points__item[data-icon="plane"] dt::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M13.6 2.6a1.7 1.7 0 0 0-3.2 0v5.1L1.1 13a1 1 0 0 0-.5.9v1.7a.8.8 0 0 0 1 .8l8.8-2.5v3.9l-2.6 1.9a1 1 0 0 0-.4.8v.8a.7.7 0 0 0 .9.7l3.3-1 3.3 1a.7.7 0 0 0 .9-.7v-.8a1 1 0 0 0-.4-.8l-2.6-1.9v-3.9l8.8 2.5a.8.8 0 0 0 1-.8v-1.7a1 1 0 0 0-.5-.9l-9.3-5.3z'/%3E%3C/svg%3E") }

.rs-points__item[data-icon] dt::before{ background-size:13px 13px }

/* ==========================================================================
   SERVICE ICONS
   --------------------------------------------------------------------------
   A card with no icon chosen keeps the cycling set it has always had. Name one
   on the service (Applications -> Settings) and it wins; upload a picture and
   that wins over both, through a custom property set on the card itself.

   Drawn here rather than stored with the service, so the whole set changes
   colour with the brand and an option holds a readable word instead of a blob
   of SVG.
   ========================================================================== */

.rs-card-item[data-icon="document"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6 2h7l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z' fill-rule='evenodd'/%3E%3Cpath d='M13 2v5h5z' fill='%23fff' opacity='.45'/%3E%3Crect x='7.5' y='12' width='9' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='7.5' y='15.6' width='6' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="clipboard"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 4h2.2a2.8 2.8 0 0 1 5.6 0H17a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3Crect x='9.6' y='1.6' width='4.8' height='3.4' rx='1.2' fill='%23fff' opacity='.55'/%3E%3Crect x='8' y='11' width='8' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='8' y='14.8' width='5.5' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="table"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M3 8.4h18v1.7H3zM9.3 9h1.7v11H9.3z' fill='%23fff'/%3E%3Crect x='12.6' y='12' width='5.6' height='1.5' rx='.75' fill='%23fff'/%3E%3Crect x='12.6' y='15.4' width='3.4' height='1.5' rx='.75' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="chart"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='3' y='13' width='4' height='8' rx='1.2'/%3E%3Crect x='10' y='6.5' width='4' height='14.5' rx='1.2'/%3E%3Crect x='17' y='10' width='4' height='11' rx='1.2'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="trend"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M3 3.2a1.1 1.1 0 0 1 1.1 1.1v15.4h15.7a1.1 1.1 0 0 1 0 2.2H3.6A1.6 1.6 0 0 1 2 20.3V4.3A1.1 1.1 0 0 1 3 3.2z'/%3E%3Cpath d='m8.3 15.6 3.2-4.1 2.7 2.6 4.2-6a1.1 1.1 0 1 1 1.8 1.3l-5 7.1-2.8-2.7-2.9 3.7a1.1 1.1 0 0 1-1.8-1.3z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="microscope"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='5' y='20' width='14' height='2.1' rx='1.05'/%3E%3Crect x='8.2' y='16.6' width='2.1' height='4' rx='1'/%3E%3Cpath d='M10.6 8.2a5.9 5.9 0 0 0-3 10.4h5a1 1 0 0 0 0-2H9.3a3.9 3.9 0 0 1 2.2-6.6z'/%3E%3Cpath d='M13.3 2.6a2.2 2.2 0 0 1 3 .8l1.7 3a2.2 2.2 0 0 1-.8 3l-3 1.7-3.9-6.8z'/%3E%3Crect x='10' y='10.1' width='3.6' height='1.7' rx='.85' transform='rotate(-30 10 10.1)'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="flask"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9 2h6a1 1 0 0 1 0 2h-.4v5.3l5.3 9.9A2.1 2.1 0 0 1 18 22.3H6a2.1 2.1 0 0 1-1.9-3.1L9.4 9.3V4H9a1 1 0 0 1 0-2z'/%3E%3Cpath d='M7.4 15h9.2l1.1 2H6.3z' fill='%23fff' opacity='.5'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="book"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.4 2H20a1 1 0 0 1 1 1v14.3H6.4a2.6 2.6 0 0 0-2.6 2.6V4.6A2.6 2.6 0 0 1 6.4 2z'/%3E%3Cpath d='M6.4 19.3H21V22H6.4a1.35 1.35 0 0 1 0-2.7z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="pen"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M16.1 2.6a2.6 2.6 0 0 1 3.7 0l1.6 1.6a2.6 2.6 0 0 1 0 3.7l-1.5 1.5-5.3-5.3z'/%3E%3Cpath d='m13.2 5.5 5.3 5.3L8.2 21H4a1 1 0 0 1-1-1v-4.2z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="search"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M11 3a8 8 0 1 0 4.9 14.3l3.4 3.4a1.3 1.3 0 0 0 1.9-1.9l-3.4-3.4A8 8 0 0 0 11 3zm0 2.4A5.6 5.6 0 1 1 11 16.6 5.6 5.6 0 0 1 11 5.4z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="shield"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.2 4 5.7v5.6c0 5 3.6 9.3 8 10.5 4.4-1.2 8-5.5 8-10.5V5.7z'/%3E%3Cpath d='m10.9 14.8-3-3 1.5-1.5 1.5 1.5 3.7-3.7 1.5 1.5z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="people"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='9' cy='7.6' r='3.7'/%3E%3Cpath d='M9 13.2c-3.6 0-6.6 2.4-6.6 5.4V21h13.2v-2.4c0-3-3-5.4-6.6-5.4z'/%3E%3Ccircle cx='17.4' cy='8.8' r='2.9'/%3E%3Cpath d='M17.4 13.4c-1 0-1.9.2-2.7.5a7.8 7.8 0 0 1 2.9 4.7V21H22v-2.6c0-2.7-2.1-5-4.6-5z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="chat"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M5 3h14a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3H9.4L4.6 20.9A1 1 0 0 1 3 20.1V6a3 3 0 0 1 2-3z'/%3E%3Crect x='7' y='7.6' width='10' height='1.8' rx='.9' fill='%23fff'/%3E%3Crect x='7' y='11.2' width='6.4' height='1.8' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="send"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M21.6 2.4a1.1 1.1 0 0 1 .2 1.2l-7 17.6a1.1 1.1 0 0 1-2-.1l-2.9-6.5 4.6-5.5-6.3 3.9L2.5 10a1.1 1.1 0 0 1 .1-2l17.8-5.8a1.1 1.1 0 0 1 1.2.2z'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="award"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='12' cy='8.6' r='6.1'/%3E%3Cpath d='m7.4 14.3-1.8 7.2a.8.8 0 0 0 1.2.9L12 19.4l5.2 3a.8.8 0 0 0 1.2-.9l-1.8-7.2a8 8 0 0 1-9.2 0z'/%3E%3Cpath d='m10.9 11.5-2.2-2.2 1.4-1.4 1.4 1.4 2.9-2.9 1.4 1.4z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="globe"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2.2c1.3 0 2.8 2.1 3.4 5.2H8.6C9.2 6.3 10.7 4.2 12 4.2zM4.4 11h2.3c.1-2 .4-3.8 1-5.2A7.9 7.9 0 0 0 4.4 11zm0 2h2.3c.1 2 .4 3.8 1 5.2A7.9 7.9 0 0 1 4.4 13zm4.2 0h6.8c-.6 3.1-2.1 5.2-3.4 5.2S9.2 16.1 8.6 13zM17.3 11c-.1-2-.4-3.8-1-5.2a7.9 7.9 0 0 1 3.3 5.2zm0 2h2.3a7.9 7.9 0 0 1-3.3 5.2c.6-1.4.9-3.2 1-5.2z' fill-rule='evenodd'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="calendar"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 2a1 1 0 0 1 1 1v1.4h8V3a1 1 0 1 1 2 0v1.4h1a3 3 0 0 1 3 3v.7H2v-.7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1z'/%3E%3Cpath d='M2 10.1h20V19a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3z'/%3E%3Crect x='6.4' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3Crect x='11.6' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="briefcase"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9.6 3h4.8a2.6 2.6 0 0 1 2.6 2.6v1.3h-2.2V5.6a.4.4 0 0 0-.4-.4H9.6a.4.4 0 0 0-.4.4v1.3H7V5.6A2.6 2.6 0 0 1 9.6 3z'/%3E%3Cpath d='M3 8.9h18a2 2 0 0 1 2 2V12H1v-1.1a2 2 0 0 1 2-2z'/%3E%3Cpath d='M1 14h9v1a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-1h9v4.4a2.6 2.6 0 0 1-2.6 2.6H3.6A2.6 2.6 0 0 1 1 18.4z'/%3E%3C/svg%3E") }

.rs-card-item[data-icon="graduation"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.6 1.4 7.6 12 12.6l10.6-5z'/%3E%3Cpath d='M5.6 11.2v4.3c0 1.9 2.9 3.4 6.4 3.4s6.4-1.5 6.4-3.4v-4.3L12 14.4z'/%3E%3Cpath d='M21.6 8.6a.9.9 0 0 1 .9.9v5.3a.9.9 0 0 1-1.8 0V9.5a.9.9 0 0 1 .9-.9z'/%3E%3Ccircle cx='21.6' cy='16.3' r='1.5'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="passport"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.6 1.8h10.8a2.4 2.4 0 0 1 2.4 2.4v15.6a2.4 2.4 0 0 1-2.4 2.4H6.6a2.4 2.4 0 0 1-2.4-2.4V4.2a2.4 2.4 0 0 1 2.4-2.4z'/%3E%3Cpath d='M12 5.4a4.3 4.3 0 1 0 0 8.6 4.3 4.3 0 0 0 0-8.6zm0 1.5c.5 0 1.2.8 1.5 2.1h-3c.3-1.3 1-2.1 1.5-2.1zM8.1 9h1.2c.1-.8.2-1.5.4-2.1A2.9 2.9 0 0 0 8.1 9zm0 1.4h1.2c.1.8.2 1.5.4 2.1a2.9 2.9 0 0 1-1.6-2.1zm2.6 0h2.6c-.3 1.3-1 2.1-1.3 2.1s-1-.8-1.3-2.1zm4-1.4h1.2a2.9 2.9 0 0 0-1.6-2.1c.2.6.3 1.3.4 2.1zm0 1.4h1.2a2.9 2.9 0 0 1-1.6 2.1c.2-.6.3-1.3.4-2.1z' fill='%23fff' fill-rule='evenodd'/%3E%3Crect x='8.4' y='16.4' width='7.2' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-card-item[data-icon="plane"]::before{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M13.6 2.6a1.7 1.7 0 0 0-3.2 0v5.1L1.1 13a1 1 0 0 0-.5.9v1.7a.8.8 0 0 0 1 .8l8.8-2.5v3.9l-2.6 1.9a1 1 0 0 0-.4.8v.8a.7.7 0 0 0 .9.7l3.3-1 3.3 1a.7.7 0 0 0 .9-.7v-.8a1 1 0 0 0-.4-.8l-2.6-1.9v-3.9l8.8 2.5a.8.8 0 0 0 1-.8v-1.7a1 1 0 0 0-.5-.9l-9.3-5.3z'/%3E%3C/svg%3E") }

/* An uploaded picture. Set inline on the card as --rs-card-icon, so it beats
   every rule above without needing one selector per service. */
.rs-card-item[style*="--rs-card-icon"]::before{
  background-image:var(--rs-card-icon);
  background-size:24px 24px;
}


/* The same drawings again, on the mission chip. */
.rs-mission__card[data-icon="document"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6 2h7l5 5v13a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2z' fill-rule='evenodd'/%3E%3Cpath d='M13 2v5h5z' fill='%23fff' opacity='.45'/%3E%3Crect x='7.5' y='12' width='9' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='7.5' y='15.6' width='6' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="clipboard"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 4h2.2a2.8 2.8 0 0 1 5.6 0H17a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2z'/%3E%3Crect x='9.6' y='1.6' width='4.8' height='3.4' rx='1.2' fill='%23fff' opacity='.55'/%3E%3Crect x='8' y='11' width='8' height='1.7' rx='.85' fill='%23fff'/%3E%3Crect x='8' y='14.8' width='5.5' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="table"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V5a1 1 0 0 1 1-1z'/%3E%3Cpath d='M3 8.4h18v1.7H3zM9.3 9h1.7v11H9.3z' fill='%23fff'/%3E%3Crect x='12.6' y='12' width='5.6' height='1.5' rx='.75' fill='%23fff'/%3E%3Crect x='12.6' y='15.4' width='3.4' height='1.5' rx='.75' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="chart"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='3' y='13' width='4' height='8' rx='1.2'/%3E%3Crect x='10' y='6.5' width='4' height='14.5' rx='1.2'/%3E%3Crect x='17' y='10' width='4' height='11' rx='1.2'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="trend"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M3 3.2a1.1 1.1 0 0 1 1.1 1.1v15.4h15.7a1.1 1.1 0 0 1 0 2.2H3.6A1.6 1.6 0 0 1 2 20.3V4.3A1.1 1.1 0 0 1 3 3.2z'/%3E%3Cpath d='m8.3 15.6 3.2-4.1 2.7 2.6 4.2-6a1.1 1.1 0 1 1 1.8 1.3l-5 7.1-2.8-2.7-2.9 3.7a1.1 1.1 0 0 1-1.8-1.3z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="microscope"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Crect x='5' y='20' width='14' height='2.1' rx='1.05'/%3E%3Crect x='8.2' y='16.6' width='2.1' height='4' rx='1'/%3E%3Cpath d='M10.6 8.2a5.9 5.9 0 0 0-3 10.4h5a1 1 0 0 0 0-2H9.3a3.9 3.9 0 0 1 2.2-6.6z'/%3E%3Cpath d='M13.3 2.6a2.2 2.2 0 0 1 3 .8l1.7 3a2.2 2.2 0 0 1-.8 3l-3 1.7-3.9-6.8z'/%3E%3Crect x='10' y='10.1' width='3.6' height='1.7' rx='.85' transform='rotate(-30 10 10.1)'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="flask"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9 2h6a1 1 0 0 1 0 2h-.4v5.3l5.3 9.9A2.1 2.1 0 0 1 18 22.3H6a2.1 2.1 0 0 1-1.9-3.1L9.4 9.3V4H9a1 1 0 0 1 0-2z'/%3E%3Cpath d='M7.4 15h9.2l1.1 2H6.3z' fill='%23fff' opacity='.5'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="book"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.4 2H20a1 1 0 0 1 1 1v14.3H6.4a2.6 2.6 0 0 0-2.6 2.6V4.6A2.6 2.6 0 0 1 6.4 2z'/%3E%3Cpath d='M6.4 19.3H21V22H6.4a1.35 1.35 0 0 1 0-2.7z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="pen"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M16.1 2.6a2.6 2.6 0 0 1 3.7 0l1.6 1.6a2.6 2.6 0 0 1 0 3.7l-1.5 1.5-5.3-5.3z'/%3E%3Cpath d='m13.2 5.5 5.3 5.3L8.2 21H4a1 1 0 0 1-1-1v-4.2z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="search"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M11 3a8 8 0 1 0 4.9 14.3l3.4 3.4a1.3 1.3 0 0 0 1.9-1.9l-3.4-3.4A8 8 0 0 0 11 3zm0 2.4A5.6 5.6 0 1 1 11 16.6 5.6 5.6 0 0 1 11 5.4z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="shield"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.2 4 5.7v5.6c0 5 3.6 9.3 8 10.5 4.4-1.2 8-5.5 8-10.5V5.7z'/%3E%3Cpath d='m10.9 14.8-3-3 1.5-1.5 1.5 1.5 3.7-3.7 1.5 1.5z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="people"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='9' cy='7.6' r='3.7'/%3E%3Cpath d='M9 13.2c-3.6 0-6.6 2.4-6.6 5.4V21h13.2v-2.4c0-3-3-5.4-6.6-5.4z'/%3E%3Ccircle cx='17.4' cy='8.8' r='2.9'/%3E%3Cpath d='M17.4 13.4c-1 0-1.9.2-2.7.5a7.8 7.8 0 0 1 2.9 4.7V21H22v-2.6c0-2.7-2.1-5-4.6-5z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="chat"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M5 3h14a3 3 0 0 1 3 3v8a3 3 0 0 1-3 3H9.4L4.6 20.9A1 1 0 0 1 3 20.1V6a3 3 0 0 1 2-3z'/%3E%3Crect x='7' y='7.6' width='10' height='1.8' rx='.9' fill='%23fff'/%3E%3Crect x='7' y='11.2' width='6.4' height='1.8' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="send"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M21.6 2.4a1.1 1.1 0 0 1 .2 1.2l-7 17.6a1.1 1.1 0 0 1-2-.1l-2.9-6.5 4.6-5.5-6.3 3.9L2.5 10a1.1 1.1 0 0 1 .1-2l17.8-5.8a1.1 1.1 0 0 1 1.2.2z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="award"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Ccircle cx='12' cy='8.6' r='6.1'/%3E%3Cpath d='m7.4 14.3-1.8 7.2a.8.8 0 0 0 1.2.9L12 19.4l5.2 3a.8.8 0 0 0 1.2-.9l-1.8-7.2a8 8 0 0 1-9.2 0z'/%3E%3Cpath d='m10.9 11.5-2.2-2.2 1.4-1.4 1.4 1.4 2.9-2.9 1.4 1.4z' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="globe"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20zm0 2.2c1.3 0 2.8 2.1 3.4 5.2H8.6C9.2 6.3 10.7 4.2 12 4.2zM4.4 11h2.3c.1-2 .4-3.8 1-5.2A7.9 7.9 0 0 0 4.4 11zm0 2h2.3c.1 2 .4 3.8 1 5.2A7.9 7.9 0 0 1 4.4 13zm4.2 0h6.8c-.6 3.1-2.1 5.2-3.4 5.2S9.2 16.1 8.6 13zM17.3 11c-.1-2-.4-3.8-1-5.2a7.9 7.9 0 0 1 3.3 5.2zm0 2h2.3a7.9 7.9 0 0 1-3.3 5.2c.6-1.4.9-3.2 1-5.2z' fill-rule='evenodd'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="calendar"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M7 2a1 1 0 0 1 1 1v1.4h8V3a1 1 0 1 1 2 0v1.4h1a3 3 0 0 1 3 3v.7H2v-.7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1z'/%3E%3Cpath d='M2 10.1h20V19a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3z'/%3E%3Crect x='6.4' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3Crect x='11.6' y='13' width='3.2' height='3.2' rx='.9' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="briefcase"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M9.6 3h4.8a2.6 2.6 0 0 1 2.6 2.6v1.3h-2.2V5.6a.4.4 0 0 0-.4-.4H9.6a.4.4 0 0 0-.4.4v1.3H7V5.6A2.6 2.6 0 0 1 9.6 3z'/%3E%3Cpath d='M3 8.9h18a2 2 0 0 1 2 2V12H1v-1.1a2 2 0 0 1 2-2z'/%3E%3Cpath d='M1 14h9v1a1 1 0 0 0 1 1h2a1 1 0 0 0 1-1v-1h9v4.4a2.6 2.6 0 0 1-2.6 2.6H3.6A2.6 2.6 0 0 1 1 18.4z'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="graduation"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M12 2.6 1.4 7.6 12 12.6l10.6-5z'/%3E%3Cpath d='M5.6 11.2v4.3c0 1.9 2.9 3.4 6.4 3.4s6.4-1.5 6.4-3.4v-4.3L12 14.4z'/%3E%3Cpath d='M21.6 8.6a.9.9 0 0 1 .9.9v5.3a.9.9 0 0 1-1.8 0V9.5a.9.9 0 0 1 .9-.9z'/%3E%3Ccircle cx='21.6' cy='16.3' r='1.5'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="passport"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M6.6 1.8h10.8a2.4 2.4 0 0 1 2.4 2.4v15.6a2.4 2.4 0 0 1-2.4 2.4H6.6a2.4 2.4 0 0 1-2.4-2.4V4.2a2.4 2.4 0 0 1 2.4-2.4z'/%3E%3Cpath d='M12 5.4a4.3 4.3 0 1 0 0 8.6 4.3 4.3 0 0 0 0-8.6zm0 1.5c.5 0 1.2.8 1.5 2.1h-3c.3-1.3 1-2.1 1.5-2.1zM8.1 9h1.2c.1-.8.2-1.5.4-2.1A2.9 2.9 0 0 0 8.1 9zm0 1.4h1.2c.1.8.2 1.5.4 2.1a2.9 2.9 0 0 1-1.6-2.1zm2.6 0h2.6c-.3 1.3-1 2.1-1.3 2.1s-1-.8-1.3-2.1zm4-1.4h1.2a2.9 2.9 0 0 0-1.6-2.1c.2.6.3 1.3.4 2.1zm0 1.4h1.2a2.9 2.9 0 0 1-1.6 2.1c.2-.6.3-1.3.4-2.1z' fill='%23fff' fill-rule='evenodd'/%3E%3Crect x='8.4' y='16.4' width='7.2' height='1.7' rx='.85' fill='%23fff'/%3E%3C/svg%3E") }
.rs-mission__card[data-icon="plane"] .rs-mission__n{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%233B4EE3'%3E%3Cpath d='M13.6 2.6a1.7 1.7 0 0 0-3.2 0v5.1L1.1 13a1 1 0 0 0-.5.9v1.7a.8.8 0 0 0 1 .8l8.8-2.5v3.9l-2.6 1.9a1 1 0 0 0-.4.8v.8a.7.7 0 0 0 .9.7l3.3-1 3.3 1a.7.7 0 0 0 .9-.7v-.8a1 1 0 0 0-.4-.8l-2.6-1.9v-3.9l8.8 2.5a.8.8 0 0 0 1-.8v-1.7a1 1 0 0 0-.5-.9l-9.3-5.3z'/%3E%3C/svg%3E") }

/* ==========================================================================
   OUR STORY — a picture on one side, the account on the other
   ========================================================================== */
.rs-story{ position:relative; padding:clamp(56px,7vw,96px) 0 }
.rs-story--tint{ background:var(--rs-sunk) }

.rs-story__grid{
  width:100%; max-width:var(--rs-wrap); margin-inline:auto; padding-inline:var(--rs-gut);
  display:grid; gap:40px; align-items:center;
}
@media (min-width:980px){
  .rs-story__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:64px }
  /* Picture on the right means the copy is the first column; the markup keeps
     the picture first either way, so the order is set here rather than by
     printing the two halves in a different order for each side. */
  .rs-story--right .rs-story__media{ order:2 }
  .rs-story--right .rs-story__copy{ order:1 }
}
/* With no picture the copy simply takes the width, rather than leaving a hole
   where a picture would have been. */
.rs-story--noimg .rs-story__grid{ grid-template-columns:1fr; max-width:760px }

.rs-story__frame{
  border-radius:var(--rs-r); overflow:hidden;
  box-shadow:0 20px 50px rgba(22,25,59,.16);
}
.rs-story__frame img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block }

.rs-story__copy h2{ margin-bottom:16px }
.rs-story__text{ color:var(--rs-ink-2) }
.rs-story__text p{ margin:0 0 14px }
.rs-story__text p:last-child{ margin-bottom:0 }

.rs-story__stats{
  display:flex; flex-wrap:wrap; gap:14px 40px; margin:28px 0 0;
  padding-top:22px; border-top:1px solid var(--rs-line);
}
.rs-story__stats dt{
  font-size:1.7rem; font-weight:700; line-height:1.1; color:var(--rs-brand);
}
.rs-story__stats dd{
  margin:4px 0 0; font-size:var(--rs-t-xs); color:var(--rs-ink-2);
  letter-spacing:.02em;
}
