/* =========================================================================
   RUBEN — N27, the brand face.
   Loaded after style.css so these rules win on equal specificity. Each
   selector below matches the template's own title selector plus .font-n27,
   so ONLY the typeface changes: the size, leading and tracking the template
   sets for that title are left exactly as they were.
   ========================================================================= */

@font-face { font-family: "N27"; src: url("../fonts/N27-Thin.otf") format("opentype");
  font-weight: 100; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-ThinItalic.otf") format("opentype");
  font-weight: 100; font-style: italic; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-ExtraLight.otf") format("opentype");
  font-weight: 200; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-ExtraLightItalic.otf") format("opentype");
  font-weight: 200; font-style: italic; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-Light.otf") format("opentype");
  font-weight: 300; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-LightItalic.otf") format("opentype");
  font-weight: 300; font-style: italic; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-Regular.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-RegularItalic.otf") format("opentype");
  font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-Medium.otf") format("opentype");
  font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-MediumItalic.otf") format("opentype");
  font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-Bold.otf") format("opentype");
  font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "N27"; src: url("../fonts/N27-BoldItalic.otf") format("opentype");
  font-weight: 700; font-style: italic; font-display: swap; }

:root { --font_n27: "N27", "Helvetica Neue", Arial, sans-serif; }

/* section titles: match the template's own two-class specificity */
.section-title.font-n27,
.section-title.font-n27 a,
.section-title.font-n27 span:not(.icon) { font-family: var(--font_n27); }

/* the CAR / NAV / HOME / WORK / TRAVEL counters */
.funfact-item .number.font-n27,
.number.font-n27 { font-family: var(--font_n27); }

/* service and portfolio titles (In-Car, On the Go, At Home, Privacy).
   The template sets these from `.services-wrapper-4 .service-box .title`
   (specificity 0,3,0), so the override has to meet it rather than rely on
   source order. */
.services-wrapper-4 .service-box .title.font-n27,
.services-wrapper-4 .service-box .title.font-n27 a,
h2.title.font-n27,
h3.title.font-n27,
.title.font-n27 a { font-family: var(--font_n27); }

/* anything else tagged directly */
.font-n27 { font-family: var(--font_n27); }

/* These two headings kept the weight of the face they used to be set in
   (310 from Sequel Sans, which lands on N27 Light). N27's own weights are
   what makes it read as N27, so both are set to Medium like the rest of the
   titles. Size, leading and tracking are still the template's. */
.section-title.font-sequelsans-romanbody.font-n27,
.section-title.font-instrumentsans-medium.font-n27 { font-weight: 500; }

/* Hero slides (portfolio-4): the slide titles in N27 Medium like every other
   title. Specificity meets the template's `.portfolio-4 .swiper-slide-active
   .portfolio-4__content-title` (0,3,0) so the font does not flip mid-animation. */
.portfolio-4 .swiper-slide .portfolio-4__content-title.font-n27,
.portfolio-4 .swiper-slide .portfolio-4__content-title.font-n27 a { font-family: var(--font_n27); font-weight: 500; }

/* Thank-you blocks: the small uppercase subtitle and the thanks paragraph that
   the template styles as a section title. */
.section-subtitle.font-n27 { font-family: var(--font_n27); }
.client-area-page-about .section-title.font-n27,
p.section-title.font-n27 { font-family: var(--font_n27); font-weight: 500; }
