/* The Beard Lens additions on top of the La Dolfina stylesheet */

/* Alpine Script isn't bundled; use a close Google script as fallback */
.u-cursive {
  font-family: "Alpine Script", "Pinyon Script", cursive;
}

/* Loader only on the first visit; repeat visits skip it and show the nav straight away */
.bl-seen .loader {
  display: none !important;
}
.bl-skip-intro .navbar__item,
.bl-skip-intro .header .c-badge__wrapper {
  opacity: 1 !important;
  transform: none !important;
}

/* Loader: beard badge + wordmark centred, progress line underneath */
.loader__logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  height: auto;
  margin-top: -60px;
  transform: none;
  text-align: center;
}
.loader__logo > span {
  animation: bl-loader-in 1.1s cubic-bezier(.2, .7, .2, 1) both;
}
.loader__logo > .loader__name { animation-delay: .2s; }
.loader__logo > .loader__sub { animation-delay: .35s; }
.loader__mark {
  display: flex;
  align-items: center;
  justify-content: center;
}
.loader__mark img {
  width: 130px;
  height: auto;
  filter: brightness(0) invert(1);
}
.loader__name {
  margin-top: 28px;
  color: #fff;
  font: 400 clamp(20px, 3vw, 28px)/1 var(--font-tertiary);
  letter-spacing: .3em;
  text-transform: uppercase;
}
.loader__sub {
  margin-top: 12px;
  color: var(--color-primary);
  font: 500 11px/1 var(--font-primary);
  letter-spacing: .4em;
  text-transform: uppercase;
}
.loader__progress {
  top: calc(50% + 120px);
  width: 220px;
}
.loader__progress:before {
  width: 220px;
}
@keyframes bl-loader-in {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: none; }
}

/* The Lens: background photo brighter, softer tint */
.c-breeding__bg {
  opacity: .35;
  mix-blend-mode: normal;
}
.c-breeding__bg img {
  filter: grayscale(.2) brightness(1.08);
}
.c-breeding .o-wrapper {
  z-index: 2;
}
.c-breeding__bg:after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(9, 17, 25, .55) 0%, rgba(9, 17, 25, .2) 50%, rgba(9, 17, 25, .6) 100%);
}

/* Tighter section spacing than La Dolfina's 15% (brand section keeps the original) */
.o-section:not(.c-brand) {
  padding: 18vw 0;
}
@media (min-width: 768px) {
  .o-section:not(.c-brand) { padding: 7% 0; }
}
@media (min-width: 1256px) {
  .c-breeding .o-row { padding-top: 4%; }
}

/* Work section: remove the dead space between rows */
.c-location__top p { margin-top: 0; margin-bottom: 30px; }
@media (min-width: 768px) {
  .c-location__top p { margin-top: 2%; }
  .c-location__mid { margin: 4% 0; }
}
.c-location__mid p,
.c-location__bot p {
  margin-bottom: 30px;
  padding-top: 3%;
}
@media (min-width: 1256px) {
  .c-location__bot p { padding-top: 2%; }
}
.c-news { padding-top: 5%; }
.c-news .c-cards .c-card { margin-bottom: 20px; }

/* Faded beard logo watermark (white sections: grey, dark sections: light) */
.bl-logo-mark {
  position: absolute;
  top: 50%;
  left: 50%;
  height: 85%;
  max-height: 900px;
  max-width: 90%;
  width: auto;
  object-fit: contain;
  transform: translate(-50%, -50%);
  opacity: .05;
  filter: grayscale(1);
  pointer-events: none;
  user-select: none;
  z-index: 0;
}
.bl-logo-mark--dark {
  filter: brightness(0) invert(1);
  opacity: .04;
}
/* ===== BL_UP.svg controls (Let's create, bottom edge) ===== */
:root {
  --blup-width-mobile: var(--bl-footer-width-mobile);    /* size on phones/tablets (matches footer) */
  --blup-width-desktop: var(--bl-footer-width-desktop);  /* size on desktop (matches footer) */
  --blup-right-desktop: var(--bl-footer-right-desktop);  /* distance from right edge (matches footer) */
  --blup-bottom: 0px;           /* lift up from the bottom edge (negative = push down) */
  --blup-shift-mobile: 0px;     /* nudge left/right on mobile (from centre) */
  --blup-opacity: .04;          /* how faded it is */
}
/* ===== BL.svg footer (unchanged size) ===== */
:root {
  --bl-footer-width-mobile: 62vw;
  --bl-footer-width-desktop: 30vw;
  --bl-footer-right-desktop: -6%;
  --bl-mobile-beard: 34vw;       /* mobile: footer beard + BL_UP size */
  --bl-mobile-beard-max: 160px;
}

.bl-logo-mark--join-top,
.bl-logo-mark--join-bottom {
  height: auto;
  max-height: none;
  max-width: none;
}
.bl-logo-mark--join-top {
  top: auto;
  bottom: var(--blup-bottom);
  width: var(--blup-width-mobile);
  opacity: var(--blup-opacity);
  transform: translateX(calc(-50% + var(--blup-shift-mobile)));
}
.bl-logo-mark--join-bottom {
  top: 0;
  width: var(--bl-footer-width-mobile);
  transform: translateX(-50%);
}
@media (min-width: 1024px) {
  .bl-logo-mark.bl-logo-mark--join-top,
  .bl-logo-mark.bl-logo-mark--join-bottom {
    left: auto;
    transform: none;
  }
  .bl-logo-mark.bl-logo-mark--join-top {
    right: var(--blup-right-desktop);
    width: var(--blup-width-desktop);
  }
  .bl-logo-mark.bl-logo-mark--join-bottom {
    right: var(--bl-footer-right-desktop);
    width: var(--bl-footer-width-desktop);
  }
}

/* Desktop: logos sit off to the side (mobile stays centred) */
@media (min-width: 1024px) {
  .bl-logo-mark {
    left: auto;
    right: -4%;
    max-width: none;
    transform: translateY(-50%);
  }
  .bl-logo-mark--left {
    right: auto;
    left: -4%;
  }
}
.c-jumping .o-wrapper,
.c-press .o-wrapper,
.c-breeding .o-wrapper,
.c-equipment .o-wrapper,
.footer .o-wrapper {
  position: relative;
  z-index: 1;
}

/* Your story: image columns rising on scroll */
.c-tour__gallery {
  position: absolute;
  inset: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
  padding: 0 14px;
  overflow: hidden;
  z-index: 0;
}
@media (min-width: 768px) {
  .c-tour__gallery { grid-template-columns: repeat(4, 1fr); gap: 18px; padding: 0 18px; }
}
.c-tour__col {
  display: flex;
  flex-direction: column;
  gap: 14px;
  will-change: transform;
}
.c-tour__col:nth-child(n+3) { display: none; }
@media (min-width: 768px) {
  .c-tour__col:nth-child(n+3) { display: flex; }
  .c-tour__col { gap: 18px; }
}
.c-tour__col img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}
.c-tour__gallery:after {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(10, 27, 46, .45);
}
.c-tour .o-wrapper {
  position: relative;
  z-index: 2;
}

/* Navbar logo: icon + wordmark (their invert filter would turn the PNG into a white blob) */
.navbar__logo,
body.is--nav-transparent .navbar__logo {
  width: auto;
  filter: none;
}
.navbar__logo a {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  text-decoration: none;
}
.navbar__logo img {
  width: 46px;
  height: auto;
  filter: brightness(0);
}
.navbar__logo span {
  display: none;
  font: 400 15px/1.1 var(--font-tertiary);
  letter-spacing: .25em;
  text-transform: uppercase;
  white-space: nowrap;
}
.navbar__logo small {
  display: block;
  margin-top: 4px;
  font-size: 10px;
  letter-spacing: .45em;
  color: var(--color-primary);
}
@media (min-width: 768px) {
  .navbar__logo span { display: block; }
}

/* Mobile menu: drop the 60px backdrop blur (re-blurred every frame while the panel slides = jank) */
@media (max-width: 1023px) {
  .navbar {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background-color: rgba(10, 27, 46, .96);
    transition: background-color .5s, padding .5s;
  }
  body.is--nav-transparent .navbar {
    background-color: transparent;
  }
  .navbar__menu {
    will-change: transform;
    backface-visibility: hidden;
    -webkit-backface-visibility: hidden;
  }
  .navbar__menu .navbar__item {
    will-change: transform, opacity;
  }

  /* Logo lined up with the "Menu" label / close X (both centred ~45px from the top) */
  .navbar__logo {
    margin: 27px 10px 9px 20px;
  }
  body.is--nav-open .header__trigger {
    padding-top: 20px;
  }

  /* Menu layout scales with the phone's real visible height (dvh excludes the browser bars)
     --mu is the menu's unit: the smaller of 1% width / 1% visible height */
  .navbar__menu {
    --mu: min(1vw, 1vh);
    --mu: min(1vw, 1dvh);
    height: 100vh;
    height: 100dvh;
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding: calc(clamp(72px, 11dvh, 110px) + env(safe-area-inset-top)) 7.5% calc(clamp(14px, 3dvh, 32px) + env(safe-area-inset-bottom));
    overflow: hidden;
  }
  .navbar__menu > ul {
    position: relative;
    z-index: 2;
    flex: 1 1 auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    justify-content: center;
    gap: clamp(10px, 3.6dvh, 40px);
  }
  .navbar__menu > ul li {
    font-size: clamp(18px, calc(var(--mu) * 7), 34px);
  }
  .navbar__menu-bgtext {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    z-index: 0;
    color: rgba(255, 255, 255, .05);
    font: 400 min(26vw, 13dvh)/.95 var(--font-tertiary);
    letter-spacing: .01em;
    text-align: center;
    text-transform: uppercase;
    pointer-events: none;
    user-select: none;
    opacity: 0;
    transform: translateY(-46%);
    transition: opacity .3s, transform .3s;
  }
  body.is--nav-open .navbar__menu-bgtext {
    opacity: 1;
    transform: translateY(-50%);
    transition: opacity 1.4s ease .2s, transform 1.6s cubic-bezier(.2, .7, .2, 1) .2s;
  }

  /* Menu: rotating badge */
  .navbar__menu-badge {
    position: absolute;
    top: calc(clamp(72px, 11dvh, 110px) + env(safe-area-inset-top));
    right: 7.5%;
    z-index: 1;
    opacity: 0;
    transform: scale(.5);
    transition: opacity .2s, transform .2s;
  }
  body.is--nav-open .navbar__menu-badge {
    opacity: 1;
    transform: scale(1);
    transition: opacity 1s ease .5s, transform 1.25s cubic-bezier(.2, .7, .2, 1) .5s;
  }
  .navbar__menu-badge .c-badge__wrapper {
    position: relative;
    width: clamp(64px, calc(var(--mu) * 26), 110px);
    height: clamp(64px, calc(var(--mu) * 26), 110px);
  }
  .navbar__menu-badge img:first-child {
    width: 100%;
    height: 100%;
  }
  .navbar__menu-badge img:last-child {
    position: absolute;
    inset: 0;
    width: 40%;
    margin: auto;
  }

  /* Menu open: same logo, same spot, but white and above the panel */
  .navbar__logo img {
    transition: filter .4s;
  }
  body.is--nav-open .navbar__logo {
    position: relative;
    z-index: 1000;
  }
  body.is--nav-open .navbar__logo img {
    filter: brightness(0) invert(1);
  }

  /* Menu footer: Instagram handles + copyright pinned to the bottom of the panel */
  .navbar__menu-footer {
    position: relative;
    z-index: 2;
    flex: 0 0 auto;
    margin-top: clamp(12px, 3dvh, 32px);
    text-align: center;
  }
  .navbar__menu-footer:before {
    content: "\00A9";
    position: absolute;
    left: 50%;
    bottom: -0.18em;
    z-index: -1;
    color: rgba(255, 255, 255, .05);
    font: 400 min(64vw, 34dvh)/1 var(--font-tertiary);
    transform: translateX(-50%);
    pointer-events: none;
    opacity: 0;
    transition: opacity .2s;
  }
  body.is--nav-open .navbar__menu-footer:before {
    opacity: 1;
    transition: opacity 1.4s ease .6s;
  }
  .navbar__menu-social {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: clamp(6px, 1.4dvh, 12px);
    margin-bottom: clamp(10px, 2.4dvh, 22px);
  }
  .navbar__menu-social a {
    display: inline-flex;
    align-items: center;
    gap: clamp(8px, 2.4vw, 12px);
    width: fit-content;
    color: var(--color-primary);
    font: 400 clamp(11px, calc(var(--mu) * 3.3), 13px)/1 var(--font-primary);
    letter-spacing: .12em;
    text-decoration: none;
  }
  .navbar__menu-social svg {
    width: clamp(14px, calc(var(--mu) * 4.4), 18px);
    height: clamp(14px, calc(var(--mu) * 4.4), 18px);
    flex-shrink: 0;
  }

  /* Menu footer animates in after the links (links stagger in over ~1.2s) */
  .navbar__menu-social a,
  .navbar__menu-footer p {
    opacity: 0;
    transform: translateY(24px);
    transition: opacity .2s, transform .2s;
  }
  body.is--nav-open .navbar__menu-social a,
  body.is--nav-open .navbar__menu-footer p {
    opacity: 1;
    transform: none;
    transition: opacity .9s cubic-bezier(.2, .7, .2, 1), transform .9s cubic-bezier(.2, .7, .2, 1);
  }
  body.is--nav-open .navbar__menu-social a:nth-child(1) { transition-delay: .75s; }
  body.is--nav-open .navbar__menu-social a:nth-child(2) { transition-delay: .9s; }
  body.is--nav-open .navbar__menu-footer p { transition-delay: 1.05s; }
  .navbar__menu-footer p {
    margin: 0;
    padding-top: clamp(10px, 2dvh, 18px);
    border-top: 1px solid rgba(251, 224, 182, .15);
    color: rgba(255, 255, 255, .55);
    font: 400 clamp(9.5px, calc(var(--mu) * 2.8), 11px)/1.5 var(--font-primary);
    letter-spacing: .08em;
  }
}
/* Very short screens (small phones, landscape): drop the badge so nothing collides */
@media (max-width: 1023px) and (max-height: 620px) {
  .navbar__menu-badge { display: none; }
}
@media (min-width: 1024px) {
  .navbar__menu-footer,
  .navbar__menu-bgtext,
  .navbar__menu-badge { display: none; }
}

/* Hero: everything centered */
.header__heading .o-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.header__eyebrow {
  margin: 0 0 18px;
  color: var(--color-primary);
  font: 500 12px/1.4 var(--font-primary);
  letter-spacing: .35em;
  text-transform: uppercase;
}
.header__heading h1 {
  margin-top: 0;
}
.header__tagline {
  min-height: 1.5em;
  margin: 18px 0 0;
  color: #fff;
  font: 400 clamp(16px, 2.2vw, 22px)/1.5 var(--font-tertiary);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.header__caret {
  display: inline-block;
  width: 2px;
  height: 1em;
  margin-left: 4px;
  vertical-align: -0.12em;
  background: var(--color-primary);
  animation: bl-caret 1s steps(1) infinite;
}
@keyframes bl-caret { 50% { opacity: 0; } }
.header__sub {
  max-width: 560px;
  margin: 14px 0 0;
  color: rgba(255, 255, 255, .85);
  font: 400 15px/1.6 var(--font-primary);
}
.header__sub strong { color: #fff; }
.header__heading .o-btn {
  margin-top: 36px;
}

/* Keep the scroll arrow on the hero */
.header .header__icons .c-arrow {
  bottom: 40px;
}

/* Exclusive brand: huge greyed-out background copy inside their parallax .bg-container */
.c-brand .bg-container {
  overflow: hidden;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
  mask-image: linear-gradient(to bottom, #000 70%, transparent 100%);
}
.c-brand__bgtext {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0 1vw;
  color: rgba(255, 255, 255, .07);
  font: 400 clamp(64px, 11vw, 210px)/1 var(--font-tertiary);
  letter-spacing: .01em;
  text-align: center;
  text-transform: uppercase;
  user-select: none;
}
@media (max-width: 767px) {
  .c-brand__bgtext { font-size: 48vw; }
}
.c-brand .o-wrapper {
  position: relative;
  z-index: 1;
}

/* Exclusive brand: both images as tall portrait frames */
.c-brand .o-row picture,
.c-brand__video picture {
  display: block;
  overflow: hidden;
}
.c-brand picture .parallax-wrapper {
  height: 100%;
}
.c-brand__img,
.c-brand__video picture img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
}
.c-brand__img {
  max-width: 70vw;
}
@media (min-width: 480px) {
  .c-brand__img { max-width: 40vw; }
}
@media (min-width: 1024px) {
  .c-brand__img { max-width: 400px; }
}
@media (min-width: 1440px) {
  .c-brand__img { max-width: 26vw; }
}
.c-brand__video picture {
  aspect-ratio: 3 / 4;
  width: 80vw;
}
@media (min-width: 480px) {
  .c-brand__video picture img { max-width: none; }
}
@media (min-width: 1024px) {
  .c-brand__video picture { width: 38vw; max-width: 620px; }
}
@media (min-width: 1256px) {
  .c-brand__video picture { width: 34vw; max-width: 620px; }
}
.c-brand__video picture .parallax-wrapper,
.c-brand__video picture img {
  height: 100%;
}

.c-jumping a.c-card {
  display: block;
  color: inherit;
  text-decoration: none;
}

/* Service cards: identical, shorter 4:3 images */
.c-jumping .c-card img,
.c-jumping .c-card .video__wrapper {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}
.c-jumping .c-card .video__wrapper video {
  height: 100%;
  object-fit: cover;
}
.c-jumping .c-card h5 {
  margin: 14px 0 8px;
}
.c-jumping .c-card p {
  margin: 0 0 34px;
  max-width: 34ch;
  color: var(--color-p);
  font: 400 14px/1.55 var(--font-primary);
}

/* Buttons: their triangle sits at 25% of the width and collides with longer labels */
.o-btn {
  padding-left: 62px;
}
.o-btn:before {
  left: 32px;
}

/* Enquiry form (contact section) */
.c-enquiry__intro {
  margin: 0;
}
.c-enquiry__email {
  margin: 14px 0 36px;
}
.c-enquiry__email a {
  margin-left: 10px;
  color: var(--color-primary);
  text-decoration: none;
  letter-spacing: .08em;
}
.c-enquiry {
  /* The photo is as tall as the form. The form's height is locked while an enquiry sends (beardlens.js),
     so the photo stays the same size */
  align-items: stretch;
  gap: 48px;
  margin: 50px 0 0;
}
.c-enquiry__media {
  position: relative;
  flex: 1 1 45%;
  min-width: 0;
}
.c-enquiry__media picture {
  display: block;
  height: 100%;
  min-height: 320px;
  overflow: hidden;
}
/* Parallax wrapper fills the photo frame instead of sizing itself to the photo's natural width */
.c-enquiry__media .parallax-wrapper {
  width: 100% !important;
  height: 100%;
}
.c-enquiry__media picture img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
@media (max-width: 767px) {
  .c-enquiry__media picture { height: auto; aspect-ratio: 4 / 3; }
}
.c-enquiry__media .c-badge {
  position: absolute;
  right: -40px;
  bottom: -40px;
  z-index: 2;
}
.c-enquiry__form {
  flex: 1 1 55%;
  width: 100%;
  min-width: 0;
}
@media (max-width: 767px) {
  .c-enquiry__media .c-badge { right: 10px; bottom: -30px; }
}
.c-enquiry__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0 32px;
}
@media (min-width: 768px) {
  .c-enquiry__grid { grid-template-columns: 1fr 1fr; }
}
.c-enquiry__form label {
  display: block;
  margin-bottom: 28px;
}
.c-enquiry__form label span {
  display: block;
  margin-bottom: 8px;
  color: var(--color-primary);
  font: 500 11px/1 var(--font-primary);
  letter-spacing: .3em;
  text-transform: uppercase;
}
.c-enquiry__form input,
.c-enquiry__form select,
.c-enquiry__form textarea {
  width: 100%;
  padding: 10px 0;
  border: 0;
  border-bottom: 1px solid rgba(251, 224, 182, .35);
  border-radius: 0;
  background: transparent;
  color: #fff;
  font: 400 16px/1.5 var(--font-primary);
  outline: none;
  transition: border-color .3s;
}
.c-enquiry__form select option { color: #0a1b2e; }
.c-enquiry__form textarea { resize: vertical; }
.c-enquiry__form input:focus,
.c-enquiry__form select:focus,
.c-enquiry__form textarea:focus {
  border-bottom-color: var(--color-primary);
}
.c-enquiry__form .o-btn {
  cursor: pointer;
  font-family: var(--font-primary);
}
/* Footer social handles */
.footer .footer__bottom .social-icons {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 14px 28px;
  width: auto;
  margin: 30px auto 0;
}
@media (min-width: 1024px) {
  .footer .footer__bottom .social-icons { margin: 0; justify-content: flex-end; }
}
.footer .footer__bottom .social-icons a {
  flex-direction: row;
  align-items: center;
  gap: 10px;
  width: auto;
  height: auto;
  border-radius: 0;
  color: var(--color-footer);
  font: 400 12px/1 var(--font-primary);
  letter-spacing: .15em;
  text-transform: none;
  white-space: nowrap;
}
.footer .footer__bottom .social-icons svg {
  width: 20px;
  height: 20px;
  flex-shrink: 0;
}
.footer .logo img {
  height: auto;
}
@media (max-width: 1023px) {
  .footer .logo {
    display: none;
  }
  /* Mobile footer: the beard is the logo, fully visible, above the content */
  .footer .bl-logo-mark.bl-logo-mark--join-bottom {
    position: relative;
    top: auto;
    left: auto;
    display: block;
    width: var(--bl-mobile-beard);
    max-width: var(--bl-mobile-beard-max);
    margin: -10vw auto 40px;
    opacity: 1;
    filter: none;
    transform: none;
  }
  /* BL_UP sits on the bottom edge of Let's create at the same size, so it meets the footer beard */
  .bl-logo-mark.bl-logo-mark--join-top {
    width: var(--bl-mobile-beard);
    max-width: var(--bl-mobile-beard-max);
  }
}

/* Enquiry form human check (Netlify injects the reCAPTCHA widget on the live site) */
.c-enquiry__captcha:not(:empty) {
  margin: 6px 0 24px;
}
@media (max-width: 360px) {
  .c-enquiry__captcha { transform: scale(.88); transform-origin: left top; }
}

/* Thank-you message: sits over the form in the same box, so nothing around it changes size */
.c-enquiry__form {
  position: relative;
}
.c-enquiry__form > * {
  transition: opacity .35s ease, visibility .35s;
}
.c-enquiry__form.is-sent > :not(.c-enquiry__done) {
  opacity: 0;
  visibility: hidden;
}
.c-enquiry__done {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  outline: none;
  opacity: 0;
  visibility: hidden;
}
.c-enquiry__form.is-sent > .c-enquiry__done {
  opacity: 1;
  visibility: visible;
  transition-delay: .2s;
}
.c-enquiry__done-eyebrow {
  margin: 0 0 18px;
  color: var(--color-primary);
  font: 500 12px/1 var(--font-primary);
  letter-spacing: .35em;
  text-transform: uppercase;
}
.c-enquiry__done h3 {
  margin: 0 0 24px;
  color: #fff;
  font: 400 clamp(48px, 7vw, 96px)/1 var(--font-tertiary);
}
.c-enquiry__done h3 span {
  color: var(--color-primary);
}
.c-enquiry__done p {
  max-width: 520px;
  margin: 0 0 18px;
  color: rgba(255, 255, 255, .9);
  font: 400 20px/1.6 var(--font-primary);
}
.c-enquiry__done .c-enquiry__done-email {
  font-size: 17px;
  color: rgba(255, 255, 255, .7);
}
.c-enquiry__done a { color: var(--color-primary); }
.c-enquiry__done .o-btn {
  margin-top: 26px;
  cursor: pointer;
  font-family: var(--font-primary);
}

/* Enquiry form result message */
.c-enquiry__status {
  margin: 18px 0 0;
  font: 400 15px/1.6 var(--font-primary);
}
.c-enquiry__status:empty { display: none; }
.c-enquiry__status.is-sent { color: var(--color-primary); }
.c-enquiry__status.is-error { color: #f3a6a6; }
.c-enquiry__status a { color: inherit; }
.c-enquiry__form button[disabled] { opacity: .6; cursor: wait; }

/* Footer service links (internal links for search engines) */
.footer__services {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 28px;
  margin: 10px 0 40px;
  padding-top: 28px;
  border-top: 1px solid rgba(22, 38, 56, .12);
}
.footer__services a {
  color: var(--color-p);
  font: 400 13px/1.4 var(--font-primary);
  letter-spacing: .04em;
  text-decoration: none;
  transition: color .3s;
}
.footer__services a:hover { color: var(--color-primary); }

/* Modal link to the matching service page */
.bl-readmore {
  color: var(--color-primary);
  font: 500 12px/1.4 var(--font-primary);
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 4px;
}

/* Service landing pages */
.header--page {
  height: 78vh;
  min-height: 520px;
}
.bl-breadcrumb {
  position: relative;
  z-index: 2;
  margin: 0 0 10%;
  color: rgba(255, 255, 255, .6);
  font: 400 12px/1.4 var(--font-primary);
  letter-spacing: .12em;
  text-transform: uppercase;
}
.bl-breadcrumb a {
  color: var(--color-primary);
  text-decoration: none;
}
.bl-service__details {
  gap: 60px;
  align-items: flex-start;
}
.bl-service__col { flex: 1 1 0; }
.bl-service__col h3 {
  margin: 0 0 20px;
  color: var(--color-primary);
  font: 500 12px/1 var(--font-primary);
  letter-spacing: .3em;
  text-transform: uppercase;
}
.bl-service__col p {
  margin: 0 0 16px;
  color: var(--color-p);
  font: 400 16px/1.7 var(--font-primary);
}
.bl-service__col a { color: var(--color-primary); }
.bl-service__list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.bl-service__list li {
  position: relative;
  padding: 12px 0 12px 26px;
  border-bottom: 1px solid rgba(22, 38, 56, .1);
  color: var(--color-p);
  font: 400 16px/1.5 var(--font-primary);
}
.bl-service__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 0;
  height: 0;
  border-left: 7px solid var(--color-primary);
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  transform: translateY(-50%);
}
/* The parallax library wraps the image; without a height the image spills out of the frame */
.bl-service__image {
  display: block;
  position: relative;
  margin: 80px 0 0;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.bl-service__image .parallax-wrapper {
  height: 100%;
}
.bl-service__image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Service page questions: same frame as "An exclusive brand" */
.bl-faq .o-wrapper {
  padding-top: 6%;
  padding-bottom: 6%;
}
.bl-faq h2 {
  margin: 0 0 6%;
}
.bl-faq__list {
  max-width: 980px;
  margin-left: auto;
  border-top: 1px solid rgba(255, 255, 255, .15);
}
.bl-faq__item {
  border-bottom: 1px solid rgba(255, 255, 255, .15);
}
.bl-faq__q {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  width: 100%;
  padding: 30px 0;
  border: 0;
  background: none;
  color: #fff;
  font: 400 clamp(20px, 2.4vw, 32px)/1.3 var(--font-tertiary);
  text-align: left;
  cursor: pointer;
  transition: color .3s;
}
.bl-faq__q:hover,
.bl-faq__item.is-open .bl-faq__q { color: var(--color-primary); }
.bl-faq__icon {
  position: relative;
  flex-shrink: 0;
  width: 46px;
  height: 46px;
  border: 1px solid currentColor;
  border-radius: 50%;
  transition: transform .5s cubic-bezier(.65, 0, .35, 1);
}
.bl-faq__icon::before,
.bl-faq__icon::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 1px;
  background: currentColor;
  transform: translate(-50%, -50%);
  transition: transform .5s cubic-bezier(.65, 0, .35, 1);
}
.bl-faq__icon::after { transform: translate(-50%, -50%) rotate(90deg); }
.bl-faq__item.is-open .bl-faq__icon { transform: rotate(180deg); }
.bl-faq__item.is-open .bl-faq__icon::after { transform: translate(-50%, -50%) rotate(0deg); }
.bl-faq__a {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .6s cubic-bezier(.65, 0, .35, 1);
}
.bl-faq__item.is-open .bl-faq__a { grid-template-rows: 1fr; }
.bl-faq__a > div {
  overflow: hidden;
}
.bl-faq__a p {
  max-width: 70ch;
  margin: 0;
  padding: 0 70px 30px 0;
  color: rgba(255, 255, 255, .75);
  font: 400 16px/1.7 var(--font-primary);
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity .4s, transform .6s cubic-bezier(.65, 0, .35, 1);
}
.bl-faq__item.is-open .bl-faq__a p {
  opacity: 1;
  transform: none;
  transition-delay: .15s;
}
@media (max-width: 1023px) {
  .bl-faq .c-brand__bgtext { font-size: 17vw; }
}
@media (max-width: 767px) {
  .bl-faq__q { padding: 22px 0; }
  .bl-faq__icon { width: 38px; height: 38px; }
  .bl-faq__a p { padding-right: 0; }
}
.bl-cta .o-wrapper {
  align-items: center;
  text-align: center;
}
.bl-cta p {
  max-width: 560px;
  margin: 20px auto 36px;
  color: rgba(255, 255, 255, .85);
}
@media (max-width: 767px) {
  .bl-service__details { flex-direction: column; gap: 40px; }
  .bl-service__image { margin: 50px 0; }
}