/* BizPack.it — shared site stylesheet
   Ported from the Claude-Design-canvas source (Main.dc.html / Main-EN.dc.html /
   Main-Mobile.dc.html / Main-Mobile-EN.dc.html / Privacy.dc.html / Privacy-EN.dc.html). */

body {
  margin: 0;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  background: #F1F8F3;
}
* { box-sizing: border-box; }
a { color: #3A7D57; text-decoration: none; }
a:hover { color: #2C5E42; }

.btn-primary {
  background: #3A7D57;
  color: #FFFFFF;
  padding: 15px 30px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 800;
  border: none;
  cursor: pointer;
  display: inline-block;
  box-shadow: 0 8px 20px rgba(58,125,87,0.35);
}
.btn-primary:hover { background: #2C5E42; }

.btn-outline {
  background: #FFFFFF;
  color: #2B1B2E;
  padding: 14px 29px;
  border-radius: 999px;
  font-size: 14px;
  font-weight: 800;
  border: 2px solid #2B1B2E;
  cursor: pointer;
  display: inline-block;
}
.btn-outline:hover { background: #2B1B2E; color: #FFFFFF; }

.card {
  background: #FFFFFF;
  border: none;
  border-radius: 24px;
  box-shadow: 0 6px 24px rgba(43,27,46,0.06);
}
.eyebrow {
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #3A7D57;
  font-weight: 800;
}
.navlink { font-size: 14px; color: #2B1B2E; font-weight: 700; }
.navlink:hover { color: #3A7D57; }
input, textarea { font-family: inherit; }
.chip {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
}

/* ---- Privacy page (serif headings, slightly different palette) ---- */
.privacy-page {
  font-family: 'Inter var', 'Helvetica Neue', Arial, sans-serif;
  background: #F1F8F3;
  color: #211D1B;
}
.privacy-navlink { font-size: 14px; color: #4A423D; font-weight: 500; }
.privacy-navlink:hover { color: #3A7D57; }

/* ---- Contact tab switcher ---- */
.tab-btn { transition: background 0.15s ease, color 0.15s ease; }
.tab-btn.active { background: #3A7D57; color: #FFFFFF; }
.tab-btn:not(.active) { background: transparent; color: #8A7A8E; }

/* ---- Cookie preferences toggle rows ---- */
.pref-checkbox { width: 18px; height: 18px; }

/* =========================================================
   DUAL-RENDER RESPONSIVE STRATEGY
   Desktop markup (1440px design) and Mobile markup (390px
   design) are both present in the DOM. Only one is shown at
   a time via this breakpoint, matching the two hand-built
   source layouts without merging them into one fluid grid.
   ========================================================= */
.mobile-view { display: none; }
.desktop-view { display: block; }

@media (max-width: 860px) {
  .desktop-view { display: none; }
  .mobile-view { display: block; }
}

/* Prevent horizontal scrollbars on the page shell */
html, body { max-width: 100%; overflow-x: hidden; }