/* Raster editorial artwork, parchment seam, and crisp social controls. */

:root {
  --rt-paper-seam: #efe6d8;
  --rt-social-ink: #d8c79e;
}

/* High-resolution transparent parchment tear. */
.rt-hero-tear {
  height: 58px;
  background-color: transparent;
  background-image: url('/assets/images/wild-expedition/tear-divider-v2.png');
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: 100% 58px;
  clip-path: none;
  image-rendering: auto;
}

.rt-products {
  background:
    linear-gradient(
      to bottom,
      var(--rt-paper-seam) 0,
      var(--rt-paper-seam) 94px,
      rgba(241, 231, 217, .94) 146px,
      rgba(246, 239, 226, .76) 230px
    ),
    url('/assets/images/wild-expedition/paper-texture.png') center top / cover repeat-y;
}

/* The successful large atmospheric Principles artwork remains unchanged. */
.rt-principles {
  padding-block: 18px 30px;
  background:
    linear-gradient(rgba(246, 239, 226, .76), rgba(238, 227, 210, .76)),
    url('/assets/images/wild-expedition/paper-texture.png') center top / cover repeat-y;
}

.rt-principles::before,
.rt-principles::after {
  top: auto;
  bottom: 0;
  width: clamp(300px, 31vw, 500px);
  height: 235px;
  opacity: .31;
  background-repeat: no-repeat;
  background-size: contain;
  filter: none;
}

.rt-principles::before {
  left: 0;
  background-image: url('/assets/images/wild-expedition/principles-forest-left.png');
  background-position: left bottom;
}

.rt-principles::after {
  right: 0;
  background-image: url('/assets/images/wild-expedition/principles-forest-right.png');
  background-position: right bottom;
}

/* Simplified high-resolution PNG Principles icons. */
.rt-principle-icon {
  width: 52px;
  height: 52px;
  font-size: 0;
  color: transparent;
  background-color: transparent;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 46px 46px;
  -webkit-mask: none;
  mask: none;
  image-rendering: auto;
}

.rt-principle:nth-child(1) .rt-principle-icon {
  background-image: url('/assets/images/wild-expedition/principle-independence.png');
}

.rt-principle:nth-child(2) .rt-principle-icon {
  background-image: url('/assets/images/wild-expedition/principle-privacy.png');
}

.rt-principle:nth-child(3) .rt-principle-icon {
  background-image: url('/assets/images/wild-expedition/principle-built-to-last.png');
}

.rt-principle:nth-child(4) .rt-principle-icon {
  background-image: url('/assets/images/wild-expedition/principle-explore.png');
}

/* Small social marks remain vector masks because this is their ideal use case. */
.rt-footer-socials {
  gap: 16px;
}

.rt-footer-socials span {
  display: block;
  width: 24px;
  height: 24px;
  overflow: hidden;
  font-size: 0;
  background: var(--rt-social-ink);
  opacity: .88;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 20px 20px;
  mask-size: 20px 20px;
  transition: opacity .18s ease, transform .18s ease;
}

.rt-footer-socials span:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.rt-footer-socials span:nth-child(1) {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.9 2H22l-6.8 7.8L23 22h-6.1l-4.8-6.2L6.7 22H3.6l7.1-8.1L3.2 2h6.3l4.3 5.7L18.9 2Zm-1.1 17.9h1.7L8.6 4H6.8l11 15.9Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.9 2H22l-6.8 7.8L23 22h-6.1l-4.8-6.2L6.7 22H3.6l7.1-8.1L3.2 2h6.3l4.3 5.7L18.9 2Zm-1.1 17.9h1.7L8.6 4H6.8l11 15.9Z'/%3E%3C/svg%3E");
}

.rt-footer-socials span:nth-child(2) {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.3 3.5A2.3 2.3 0 1 1 .7 3.5a2.3 2.3 0 0 1 4.6 0ZM1.1 8h4.4v14H1.1V8Zm7.1 0h4.2v1.9h.1c.6-1.1 2-2.3 4.2-2.3 4.5 0 5.3 3 5.3 6.8V22h-4.4v-6.8c0-1.6 0-3.7-2.3-3.7s-2.7 1.8-2.7 3.6V22H8.2V8Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.3 3.5A2.3 2.3 0 1 1 .7 3.5a2.3 2.3 0 0 1 4.6 0ZM1.1 8h4.4v14H1.1V8Zm7.1 0h4.2v1.9h.1c.6-1.1 2-2.3 4.2-2.3 4.5 0 5.3 3 5.3 6.8V22h-4.4v-6.8c0-1.6 0-3.7-2.3-3.7s-2.7 1.8-2.7 3.6V22H8.2V8Z'/%3E%3C/svg%3E");
}

.rt-footer-socials span:nth-child(3) {
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Zm-5 3a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6Zm5.3-3.4a1.2 1.2 0 1 1 0 2.4 1.2 1.2 0 0 1 0-2.4Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' d='M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5Zm10 2H7a3 3 0 0 0-3 3v10a3 3 0 0 0 3 3h10a3 3 0 0 0 3-3V7a3 3 0 0 0-3-3Zm-5 3a5 5 0 1 1 0 10 5 5 0 0 1 0-10Zm0 2a3 3 0 1 0 0 6 3 3 0 0 0 0-6Zm5.3-3.4a1.2 1.2 0 1 1 0 2.4 1.2 1.2 0 0 1 0-2.4Z'/%3E%3C/svg%3E");
}

/* Keep the desktop CTA row comfortably clear of the torn edge. */
.rt-hero-actions {
  margin-top: 24px;
  transform: translateY(-10px);
}

@media (max-width: 880px) {
  .rt-hero-actions {
    gap: 14px;
    margin-top: 22px;
    transform: translateY(-6px);
  }

  .rt-btn {
    min-width: 0;
    height: 52px;
    padding-inline: 22px;
  }

  .rt-principles::before,
  .rt-principles::after {
    width: 320px;
    height: 190px;
    opacity: .22;
  }
}

@media (max-width: 640px) {
  .rt-hero-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    width: min(100%, 340px);
    margin-top: 20px;
    transform: translateY(-2px);
  }

  .rt-btn {
    width: 100%;
    height: 50px;
    padding-inline: 18px;
  }

  .rt-hero-tear {
    height: 38px;
    background-size: 100% 38px;
  }

  .rt-principles::before,
  .rt-principles::after {
    display: none;
  }
}
