/************************************************
 Impact Sales Theme
 Colors are supplied dynamically by the producer.
************************************************/
:root{--primary:#1F5DAA;--primary-dark:#184A88;--charcoal:#20242A;--muted:#667085;--surface:#fff;--background:#F6F8FB;--border:#E5EAF0;--success-bg:#E8F7ED;--success:#1E7A43;--pending-bg:#FFF4DA;--pending:#8A6200;--sold-bg:#F7E8E8;--sold:#922E2E;--shadow:0 14px 36px rgba(22,34,51,.09);--radius:18px;--max-width:1180px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;color:var(--charcoal);background:var(--background);line-height:1.6}img,video{max-width:100%;display:block}a{text-decoration:none;color:inherit}button,input,textarea{font:inherit}.container{width:min(calc(100% - 32px),var(--max-width));margin:0 auto}
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);border-bottom:1px solid var(--border);backdrop-filter:blur(10px)}.nav{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand img{height:52px}.nav-links{display:flex;gap:24px;font-weight:700}.nav-links a:hover{color:var(--primary)}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border:0;border-radius:999px;background:var(--primary);color:#fff;font-weight:900;cursor:pointer}.button:hover{background:var(--primary-dark)}.button.secondary{background:#fff;color:var(--primary);border:1px solid var(--border)}.button.full{width:100%}
.hero{padding:50px 0 34px}.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:44px;align-items:center}.eyebrow{color:var(--primary);font-weight:900;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem;margin:0 0 12px}.hero h1{font-size:clamp(2.5rem,6vw,4.6rem);line-height:1.02;margin:0 0 20px}.hero p{font-size:1.15rem;color:var(--muted);margin:0 0 28px}.hero-media{border-radius:26px;overflow:hidden;background:#111;box-shadow:var(--shadow);border:1px solid var(--border)}.hero-video{width:100%;aspect-ratio:16/9;object-fit:cover;background:#111}
.section{padding:54px 0}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.feature,.card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}.feature p{color:var(--muted);margin:0}
.page-header{padding:54px 0 24px;text-align:center}.page-header h1{font-size:clamp(2.2rem,5vw,4rem);margin:0 0 10px}.page-header p{max-width:760px;margin:0 auto;color:var(--muted)}
.catalog{padding:28px 0 70px}.pig-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.pig-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}.pig-card.pending-card{border:2px solid #E8C968}.pig-card.sold-card{border:2px solid #D9A7A7}.pig-card-media{position:relative;aspect-ratio:4/3;background:#EDF1F6}.pig-card-media img{width:100%;height:100%;object-fit:cover}.pig-card.pending-card img{filter:saturate(.65)}.pig-card.sold-card img{filter:grayscale(.7);opacity:.72}.status-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center}.status-overlay span{background:rgba(32,36,42,.86);color:#fff;font-size:1.45rem;font-weight:950;letter-spacing:.08em;padding:12px 20px;border-radius:999px}.video-pill{position:absolute;right:12px;bottom:12px;background:rgba(32,36,42,.86);color:#fff;border-radius:999px;padding:7px 11px;font-size:.78rem;font-weight:800}.pig-card-content{padding:22px}.pig-card-meta,.pig-card-copy{color:var(--muted)}.pig-card-price{font-size:1.3rem;font-weight:950;margin:0 0 12px}.badge{display:inline-flex;border-radius:999px;padding:6px 11px;font-size:.76rem;font-weight:900;text-transform:uppercase;margin-bottom:12px}.badge.available{background:var(--success-bg);color:var(--success)}.badge.pending{background:var(--pending-bg);color:var(--pending)}.badge.sold{background:var(--sold-bg);color:var(--sold)}
.detail-shell{padding:42px 0 86px}.detail-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:start}.detail-media,.detail-panel{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);overflow:hidden}.detail-media img{width:100%;aspect-ratio:4/3;object-fit:cover}.video-wrap{padding:18px}.video-frame{width:100%;aspect-ratio:16/9;border:0;border-radius:14px}.no-video{padding:34px;text-align:center;background:#F3F5F8;color:var(--muted);border-radius:14px}.detail-panel{padding:28px;position:sticky;top:100px}.quick-facts{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:20px 0;border-top:1px solid var(--border);border-bottom:1px solid var(--border)}.fact-wide{grid-column:1/-1}.fact span{display:block;color:var(--muted);font-size:.78rem;text-transform:uppercase;font-weight:800}.price{font-size:1.65rem;font-weight:950;margin:20px 0 10px}.status-explainer{padding:14px 16px;border-radius:14px;margin:0 0 18px;font-weight:700}.status-explainer.pending{background:var(--pending-bg);color:var(--pending)}.status-explainer.sold{background:var(--sold-bg);color:var(--sold)}
.contact-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;padding:30px 0 70px}.form-grid{display:grid;gap:16px}label{font-weight:800;font-size:.9rem}input,textarea{width:100%;border:1px solid var(--border);border-radius:12px;padding:13px 14px;background:#fff}input[readonly]{background:#EEF1F5;color:#596270;font-weight:800}textarea{min-height:150px}
.site-footer{margin-top:40px;background:#171A1F;color:#fff;padding:44px 0}.footer-grid{display:flex;justify-content:space-between;align-items:center}.site-footer img{height:48px}.site-footer p{color:#C7CDD6}.sticky-cta{display:none}
@media(max-width:900px){.hero-grid,.detail-grid,.contact-grid{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}.pig-grid{grid-template-columns:1fr 1fr}.detail-panel{position:static}}
@media(max-width:640px){.nav-links .hide-mobile{display:none}.brand img{height:42px}.hero{padding:30px 0 18px}.feature-grid,.pig-grid{grid-template-columns:1fr}.footer-grid{flex-direction:column;text-align:center}.sticky-cta{display:block;position:fixed;left:0;right:0;bottom:0;z-index:80;padding:10px 12px;background:rgba(255,255,255,.97);border-top:1px solid var(--border)}body.has-sticky-cta{padding-bottom:74px}}
.home-sticky-cta{
  position:fixed;
  left:0;
  right:0;
  bottom:0;
  z-index:90;
  padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.96);
  border-top:1px solid var(--border);
  backdrop-filter:blur(10px);
}

body{
  padding-bottom:76px;
}

@media(min-width:901px){
  .home-sticky-cta{
    left:50%;
    right:auto;
    transform:translateX(-50%);
    width:420px;
    bottom:18px;
    border:1px solid var(--border);
    border-radius:999px;
    padding:8px;
    box-shadow:var(--shadow);
  }

  body{
    padding-bottom:0;
  }
}

.pig-card {
  display: block;
  color: inherit;
  text-decoration: none;
  cursor: pointer;
}

.pig-card:focus-visible {
  outline: 3px solid var(--primary);
  outline-offset: 4px;
}

.pig-card .button {
  pointer-events: none;
}

/* Tighter lot cards for faster mobile browsing */
.pig-card-content {
  padding: 18px;
}

.pig-card-content .badge {
  margin-bottom: 6px;
}

.pig-card-content h2 {
  margin: 0 0 2px;
  line-height: 1.15;
}

.pig-card-meta {
  margin: 2px 0 6px;
  line-height: 1.35;
}

.pig-card-price {
  margin: 4px 0 6px;
  line-height: 1.2;
}

.pig-card-copy {
  margin: 6px 0 14px;
  line-height: 1.4;
}

/* Extra compact on phones */
@media (max-width: 640px) {
  .pig-card-content {
    padding: 15px 16px 16px;
  }

  .pig-card-content .badge {
    margin-bottom: 5px;
  }

  .pig-card-content h2 {
    margin-bottom: 1px;
  }

  .pig-card-meta {
    margin: 2px 0 4px;
  }

  .pig-card-price {
    margin: 3px 0 5px;
  }

  .pig-card-copy {
    margin: 5px 0 12px;
  }
}

/* Pending lot availability message */
.pending-message {
  background: #fff3d6;
  border-radius: 18px;
  padding: 20px;
  margin: 22px 0;
  color: #8a6500;
}

.pending-message strong {
  display: block;
  margin-bottom: 10px;
  color: #8a6500;
  font-size: 17px;
  font-weight: 800;
  line-height: 1.4;
}

.pending-message p {
  margin: 0;
  color: #8a6500;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.55;
}

/* =========================================================
   UNIVERSAL LOADING INDICATOR
   Brand-neutral: inherits the surrounding text color.
   ========================================================= */

.loading-indicator {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 72px;
  color: #777;
}

.loading-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.28;
  animation: loading-dot-pulse 1.15s ease-in-out infinite;
}

.loading-dot:nth-child(2) {
  animation-delay: 0.14s;
}

.loading-dot:nth-child(3) {
  animation-delay: 0.28s;
}

@keyframes loading-dot-pulse {
  0%,
  60%,
  100% {
    opacity: 0.28;
    transform: translateY(0);
  }

  30% {
    opacity: 0.85;
    transform: translateY(-3px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .loading-dot {
    animation: none;
    opacity: 0.55;
  }
}

/* Inline loading dots for buttons */
.button-loading-dots {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-left: 6px;
  vertical-align: middle;
}

.button-loading-dot {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: currentColor;
  opacity: 0.35;
  animation: button-dot-pulse 1s ease-in-out infinite;
}

.button-loading-dot:nth-child(2) {
  animation-delay: 0.12s;
}

.button-loading-dot:nth-child(3) {
  animation-delay: 0.24s;
}

@keyframes button-dot-pulse {
  0%,
  60%,
  100% {
    opacity: 0.35;
    transform: translateY(0);
  }

  30% {
    opacity: 1;
    transform: translateY(-2px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .button-loading-dot {
    animation: none;
    opacity: 0.65;
  }
}

/* =========================================================
   CONFIRMATION DIALOG
   Brand-neutral
   ========================================================= */

.confirm-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 22px;
  background: rgba(17, 24, 39, 0.48);
}

.confirm-dialog {
  width: min(100%, 420px);
  background: #fff;
  border-radius: 16px;
  padding: 22px;
  box-shadow:
    0 18px 50px rgba(0, 0, 0, 0.18);
}

.confirm-dialog h2 {
  margin: 0 0 9px;
  font-size: 21px;
  line-height: 1.2;
}

.confirm-message {
  margin: 0;
  color: #475467;
  font-size: 15px;
  line-height: 1.5;
}

.confirm-actions {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
  margin-top: 20px;
}

.confirm-cancel,
.confirm-submit {
  min-height: 46px;
  border-radius: 9px;
  font: inherit;
  font-size: 13px;
  font-weight: 800;
  letter-spacing: 0.03em;
  cursor: pointer;
}

.confirm-cancel {
  border: 1px solid #d0d5dd;
  background: #fff;
  color: #344054;
}

.confirm-submit {
  border: 1px solid #344054;
  background: #344054;
  color: #fff;
}

/* Seller contact actions */
.seller-contact-block {
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e5e7eb;
}

.seller-contact-label {
  margin: 0;
  font-weight: 800;
}

.seller-contact-copy {
  margin: 5px 0 14px;
  color: #667085;
}

.seller-contact-actions {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.seller-contact-button {
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 10px 12px;
  border: 1px solid #d0d5dd;
  border-radius: 9px;
  background: #fff;
  color: #344054;
  text-decoration: none;
  text-align: center;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
}

.seller-contact-button:hover {
  background: #f9fafb;
}

@media (max-width: 640px) {
  .seller-contact-actions {
    grid-template-columns: 1fr;
  }
}

.contact-help-copy {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid #e5e7eb;
}

.contact-help-copy p {
  margin: 0 0 12px;
  color: #667085;
  line-height: 1.55;
}

.contact-help-copy p:last-child {
  margin-bottom: 0;
}

.contact-help-copy a {
  color: inherit;
  font-weight: 700;
}

.platform-credit {
  margin: 4px 0 0;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  opacity: 0.7;
}

.preview-disabled {
  cursor: not-allowed;
  opacity: 0.62;
  pointer-events: none;
}

/* =========================================================
   SALE DASHBOARD
   Mobile-first homepage sale presentation
   ========================================================= */

.sale-dashboard {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 48px 0 42px;
  background: #f4f6f9;
}


.sale-dashboard-background {
  position: absolute;
  inset: 0;
  z-index: -2;

  background-image:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.72),
      rgba(255, 255, 255, 0.9)
    ),
    var(
      --sale-dashboard-background,
      url("../images/hero.JPG")
    );

  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

  transform: scale(1.02);
}


.sale-dashboard::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;

  background:
    linear-gradient(
      to bottom,
      rgba(255, 255, 255, 0.02),
      rgba(255, 255, 255, 0.38)
    );
}


.sale-dashboard-inner {
  display: flex;
  flex-direction: column;
  gap: 30px;
}


.sale-dashboard-heading {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}


.sale-dashboard-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  margin: 0 0 14px;
  padding: 7px 14px;

  border: 1px solid
    color-mix(
      in srgb,
      var(--primary) 35%,
      transparent
    );

  border-radius: 999px;

  background:
    rgba(255, 255, 255, 0.84);

  color: var(--primary);

  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.13em;
  line-height: 1;
  text-transform: uppercase;
}


.sale-dashboard-title {
  max-width: 760px;
  margin: 0 auto;

  font-size: clamp(
    2.35rem,
    11vw,
    4.6rem
  );

  line-height: 0.98;
  letter-spacing: -0.035em;
  text-wrap: balance;
}


.sale-dashboard-description {
  max-width: 620px;
  margin: 20px auto 0;

  color: #465269;

  font-size: 1.04rem;
  line-height: 1.6;
  text-wrap: balance;
}


.sale-dashboard-panel {
  width: min(100%, 660px);
  margin: 0 auto;
  padding: 28px 22px;

  border:
    1px solid
    rgba(75, 91, 118, 0.14);

  border-radius: 24px;

  background:
    rgba(255, 255, 255, 0.94);

  box-shadow:
    0 20px 55px
    rgba(28, 39, 58, 0.14);

  backdrop-filter:
    blur(8px);
}


.sale-dashboard-state {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;

  padding-bottom: 20px;

  border-bottom:
    1px solid
    rgba(75, 91, 118, 0.15);
}


.sale-dashboard-state-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 38px;
  height: 38px;

  flex: 0 0 38px;

  border-radius: 50%;

  background: var(--primary);
  color: #fff;

  font-size: 1.05rem;
}


.sale-dashboard-state p {
  margin: 0;

  color: var(--primary);

  font-size: 1.08rem;
  font-weight: 850;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}


.sale-dashboard-opening {
  padding: 24px 0 22px;
  text-align: center;
}


.sale-dashboard-label {
  margin: 0 0 10px;

  color: #465269;

  font-size: 0.78rem;
  font-weight: 850;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}


.sale-dashboard-date {
  margin: 0;

  color: #202630;

  font-size: clamp(
    1.42rem,
    6vw,
    2rem
  );

  font-weight: 800;
  line-height: 1.2;
  text-wrap: balance;
}


.sale-dashboard-time {
  margin: 8px 0 0;

  color: #202630;

  font-size: 1.16rem;
  font-weight: 750;
}


.sale-dashboard-cta {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 100%;
  min-height: 58px;
  padding: 14px 18px;

  white-space: nowrap;

  font-size: clamp(
    0.88rem,
    4vw,
    1rem
  );

  letter-spacing: 0.045em;
}


.sale-dashboard-lock-note {
  max-width: 440px;
  margin: 16px auto 0;

  color: #697386;

  font-size: 0.88rem;
  line-height: 1.45;
  text-align: center;
}


/* =========================================================
   WELCOME SECTION
   ========================================================= */

.welcome-section {
  padding: 48px 0;
  background: #fff;
}


.welcome-heading {
  margin-bottom: 24px;
  text-align: center;
}


.welcome-heading .eyebrow {
  margin-bottom: 7px;
}


.welcome-heading h2 {
  margin: 0;

  font-size: clamp(
    1.9rem,
    8vw,
    3rem
  );

  line-height: 1.08;
  text-wrap: balance;
}


.welcome-section .hero-media {
  width: min(100%, 880px);
  margin: 0 auto;
}


.welcome-section .hero-video {
  display: block;

  width: 100%;
  aspect-ratio: 16 / 9;

  border-radius: 20px;

  object-fit: cover;

  box-shadow:
    0 18px 45px
    rgba(28, 39, 58, 0.14);
}


/* =========================================================
   TABLET AND DESKTOP
   ========================================================= */

@media (min-width: 760px) {

  .sale-dashboard {
    padding:
      72px 0
      62px;
  }


  .sale-dashboard-inner {
    gap: 38px;
  }


  .sale-dashboard-panel {
    padding:
      34px
      42px;
  }


  .sale-dashboard-opening {
    padding:
      28px 0
      26px;
  }


  .welcome-section {
    padding:
      64px 0;
  }

}


@media (min-width: 980px) {

  .sale-dashboard {
    min-height: 720px;

    display: flex;
    align-items: center;

    padding:
      86px 0
      76px;
  }


  .sale-dashboard-background {
    background-position:
      center 48%;
  }


  .sale-dashboard-panel {
    width: min(100%, 720px);
  }


  .sale-dashboard-state p {
    font-size: 1.18rem;
  }


  .sale-dashboard-lock-note {
    font-size: 0.92rem;
  }

}

.sale-catalog-opening {
  margin: 12px auto 0;
  color: var(--primary);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.45;
  text-align: center;
}

.badge.preview {
  background: rgba(75, 91, 118, 0.12);
  color: var(--primary);
}