/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.

*/
/* ======================
   Geist Family
====================== */
@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Thin-4b138a3d.otf") format('opentype');
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-ThinItalic-ab2c993b.otf") format('opentype');
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-ExtraLight-ae7468af.otf") format('opentype');
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-ExtraLightItalic-e3384d01.otf") format('opentype');
  font-weight: 200;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Light-d63b8ca6.otf") format('opentype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-LightItalic-210098dc.otf") format('opentype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Regular-b5a477ac.otf") format('opentype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-RegularItalic-f152a911.otf") format('opentype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Medium-b6be47b8.otf") format('opentype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-MediumItalic-c4f00d82.otf") format('opentype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-SemiBold-b6c06566.otf") format('opentype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-SemiBoldItalic-3b49cc1a.otf") format('opentype');
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Bold-eea5c7ba.otf") format('opentype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-BoldItalic-b700792f.otf") format('opentype');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-ExtraBold-77e525e6.otf") format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-ExtraBoldItalic-058065b9.otf") format('opentype');
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-Black-cd9fcdaf.otf") format('opentype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'Geist';
  src: url("/assets/Geist-BlackItalic-29a7398d.otf") format('opentype');
  font-weight: 900;
  font-style: italic;
}


/* ======================
   GeistMono Family
====================== */
@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Thin-0aaba07c.otf") format('opentype');
  font-weight: 100;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-ThinItalic-0d7f4552.otf") format('opentype');
  font-weight: 100;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-ExtraLight-58386486.otf") format('opentype');
  font-weight: 200;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-ExtraLightItalic-fa2927c1.otf") format('opentype');
  font-weight: 200;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Light-e6480873.otf") format('opentype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-LightItalic-8dfe98d7.otf") format('opentype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Regular-fbe4523d.otf") format('opentype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Italic-c27d48cd.otf") format('opentype');
  font-weight: 400;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Medium-d19971f9.otf") format('opentype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-MediumItalic-6ecf2804.otf") format('opentype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-SemiBold-b74566f0.otf") format('opentype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-SemiBoldItalic-4a785ca7.otf") format('opentype');
  font-weight: 600;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Bold-19c0238f.otf") format('opentype');
  font-weight: 700;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-BoldItalic-64d01ab0.otf") format('opentype');
  font-weight: 700;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-ExtraBold-ad9f1324.otf") format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-ExtraBoldItalic-1ffac39a.otf") format('opentype');
  font-weight: 800;
  font-style: italic;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-Black-3bc6dba3.otf") format('opentype');
  font-weight: 900;
  font-style: normal;
}

@font-face {
  font-family: 'GeistMono';
  src: url("/assets/GeistMono-BlackItalic-422559b5.otf") format('opentype');
  font-weight: 900;
  font-style: italic;
}


.font-geist {
  font-family: 'Geist', sans-serif;
}

.font-geist-mono {
  font-family: 'GeistMono', monospace;
}

/* ======================
   Postal Red Landing Page
====================== */
:root {
  --postal-red: #c1272d;
  --postal-red-dark: #a82025;
  --postal-blue: #1e3a5f;
  --postal-blue-light: #2d5a87;
  --cream: #faf6f1;
  --paper: #ffffff;
  --kraft: #d4c4a8;
  --ink: #1a1a1a;
  --ink-light: #555555;
  --ink-muted: #999999;
  --envelope-border: #c9b896;
  --stamp-border: #ececec;
}

/* Paper texture overlay for landing page */
.landing-texture::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
  opacity: 0.03;
  pointer-events: none;
  z-index: 10000;
}

/* Stamp perforation effect */
.stamp-perf::before {
  content: '';
  position: absolute;
  inset: -4px;
  background: radial-gradient(circle, transparent 3px, var(--cream) 3px);
  background-size: 8px 8px;
  background-position: 4px 4px;
}

.stamp-perf-dark::before {
  background: radial-gradient(circle, transparent 3px, var(--ink) 3px);
  background-size: 8px 8px;
  background-position: 4px 4px;
}

.stamp-perf-large::before {
  content: '';
  position: absolute;
  inset: -8px;
  background: radial-gradient(circle, transparent 5px, var(--cream) 5px);
  background-size: 14px 14px;
  background-position: 7px 7px;
}

.envelope-stamp-perf::before {
  content: '';
  position: absolute;
  inset: -6px;
  background: radial-gradient(circle, transparent 4px, var(--cream) 4px);
  background-size: 10px 10px;
  background-position: 5px 5px;
}

/* Airmail stripe */
.airmail-stripe {
  height: 12px;
  background: repeating-linear-gradient(-45deg,
      var(--postal-red),
      var(--postal-red) 12px,
      white 12px,
      white 24px,
      var(--postal-blue) 24px,
      var(--postal-blue) 36px,
      white 36px,
      white 48px);
}

/* Airmail top border */
.airmail-top {
  background: repeating-linear-gradient(90deg,
      var(--postal-red) 0px,
      var(--postal-red) 20px,
      transparent 20px,
      transparent 28px,
      var(--postal-blue) 28px,
      var(--postal-blue) 48px,
      transparent 48px,
      transparent 56px);
}

/* Testimonial card top stripe */
.testimonial-stripe::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 8px;
  background: repeating-linear-gradient(90deg,
      var(--postal-red) 0px,
      var(--postal-red) 16px,
      transparent 16px,
      transparent 24px,
      var(--postal-blue) 24px,
      var(--postal-blue) 40px,
      transparent 40px,
      transparent 48px);
  border-radius: 8px 8px 0 0;
}

/* Envelope top border */
.envelope-border-top::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 12px;
  background: repeating-linear-gradient(90deg,
      var(--postal-red) 0px,
      var(--postal-red) 20px,
      transparent 20px,
      transparent 28px,
      var(--postal-blue) 28px,
      var(--postal-blue) 48px,
      transparent 48px,
      transparent 56px);
}

/* Envelope inner shadow */
.envelope-shadow::after {
  content: '';
  position: absolute;
  top: 12px;
  left: 10%;
  right: 10%;
  height: 30px;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0.08), transparent);
  border-radius: 0 0 50% 50%;
  z-index: 1;
}

/* Journey dotted path */
.journey-dotted-path::before {
  content: '';
  position: absolute;
  top: 60px;
  left: 80px;
  right: 80px;
  height: 3px;
  background: repeating-linear-gradient(90deg,
      var(--stamp-border) 0px,
      var(--stamp-border) 8px,
      transparent 8px,
      transparent 16px);
}

/* Features grid pattern overlay */
.features-grid-pattern::before {
  content: '';
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0L30 60M0 30L60 30' stroke='%23ffffff' stroke-opacity='0.03' stroke-width='1'/%3E%3C/svg%3E");
}

/* Letter animation */
@keyframes letterSlide {

  0%,
  100% {
    top: -100px;
  }

  80% {
    top: -80px;
  }
}

.letter-slide {
  animation: letterSlide 4s ease-in-out infinite;
}

/* Price card featured badge */
.price-featured::before {
  content: 'Best Value';
  position: absolute;
  top: -14px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--postal-red);
  color: white;
  font-family: 'GeistMono', monospace;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  padding: 8px 20px;
  border-radius: 4px;
}

/* Stamp perforation for price card */
.price-stamp-perf::before {
  content: '';
  position: absolute;
  inset: -6px;
  background: radial-gradient(circle, transparent 4px, currentColor 4px);
  background-size: 10px 10px;
  background-position: 5px 5px;
  opacity: 0.1;
  z-index: 6;
}

/* Landing page navbar */
.landing-nav {
  background: var(--cream);
}

.landing-nav.scrolled {
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.05);
}

/* FAQ answer transition */
.faq-answer-panel {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
}

.faq-item-active .faq-answer-panel {
  max-height: 300px;
}

.faq-item-active .faq-chevron {
  transform: rotate(45deg);
}