/* Calcaware theme overrides to align public/www with subserver/solutions */

:root {
  --bg: #f7f3ea;
  --bg-soft: #efe8d9;
  --surface: #fffdf8;
  --surface-2: #fbf7ef;
  --surface-3: #f3ede1;
  --ink: #12211d;
  --ink-soft: #35463f;
  --muted: #62716a;
  --line: #e4ddcf;
  --line-strong: #cfc5b1;
  --teal: #0f6b5c;
  --teal-dark: #0a5448;
  --teal-deep: #073f37;
  --teal-ink: #052c26;
  --mint: #dceee6;
  --amber: #d99b32;
  --sans: 'DM Sans', system-ui, -apple-system, sans-serif;
  --display: 'Manrope', system-ui, sans-serif;
}

/* Typography */
body,
input,
select,
textarea {
  font-family: var(--sans) !important;
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--display) !important;
  font-weight: 800 !important;
  letter-spacing: -0.022em;
  color: var(--ink);
}

/* Colors */
body {
  background: var(--bg) !important;
}

a { color: var(--teal) !important; text-decoration-thickness: 1px; text-underline-offset: 3px; }
a:hover { color: var(--teal-dark) !important; }

/* Buttons: portfolio style */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 13px 22px;
  border: 1px solid transparent;
  border-radius: 10px;
  font-family: var(--display);
  font-size: 0.94rem;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.18s var(--ease), background-color 0.18s var(--ease), border-color 0.18s var(--ease), box-shadow 0.18s var(--ease), color 0.18s var(--ease);
}

.btn-large { padding: 15px 26px; font-size: 1rem; }

.btn-primary {
  background: var(--teal);
  color: #fff;
  box-shadow: 0 10px 22px -12px rgba(15, 107, 92, 0.75);
}

.btn-primary:hover { background: var(--teal-dark); color: #fff; }

/* Map HTML5UP .button to new .btn styles */
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 13px 22px;
  border: 1px solid var(--line-strong) !important;
  border-radius: 10px !important;
  font-family: var(--display) !important;
  font-size: 0.94rem !important;
  font-weight: 700 !important;
  line-height: 1.25 !important;
  text-decoration: none !important;
  background: var(--surface) !important;
  color: var(--ink) !important;
  box-shadow: none !important;
  transition: transform 0.18s var(--ease), background-color 0.18s var(--ease), border-color 0.18s var(--ease), box-shadow 0.18s var(--ease), color 0.18s var(--ease) !important;
}

.button.large,
button.large,
input[type="submit"].large,
input[type="button"].large { padding: 15px 26px !important; font-size: 1rem !important; }

.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover {
  background: #fff !important;
  border-color: var(--teal) !important;
  color: var(--teal-dark) !important;
  box-shadow: var(--shadow-sm) !important;
}

.button.primary,
button.primary,
input[type="submit"].primary,
input[type="button"].primary {
  background: var(--teal) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 22px -12px rgba(15, 107, 92, 0.75) !important;
}

.button.primary:hover,
button.primary:hover,
input[type="submit"].primary:hover,
input[type="button"].primary:hover { background: var(--teal-dark) !important; color: #fff !important; }

/* Prefer primary style for CTA clusters */
.banner .actions .button,
ul.actions.stacked .button:first-child { border-color: transparent !important; }

/* Buttons */
input[type="submit"],
input[type="reset"],
input[type="button"],
button,
.button {
  border-radius: 10px !important;
  color: var(--ink) !important;
  background: var(--surface) !important;
}

input[type="submit"].primary,
input[type="reset"].primary,
input[type="button"].primary,
button.primary,
.button.primary {
  background: var(--teal) !important;
  color: #fff !important;
  box-shadow: 0 10px 22px -12px rgba(15, 107, 92, 0.75) !important;
}

input[type="submit"].primary:hover,
input[type="reset"].primary:hover,
input[type="button"].primary:hover,
button.primary:hover,
.button.primary:hover {
  background: var(--teal-dark) !important;
}

/* Sections */
.wrapper.style1 { background: rgba(255, 253, 248, 0.6) !important; }
.banner.style3 { background: linear-gradient(180deg, #f9f5ed 0%, var(--bg) 78%) !important; }

/* Forms */
label { font-family: var(--display) !important; font-weight: 700; color: var(--ink); }
input[type="text"],
input[type="email"],
textarea {
  border: 1px solid var(--line-strong) !important;
  background: var(--surface-2) !important;
  border-radius: 9px !important;
}

/* Footer */
.wrapper.align-center a { color: var(--teal) !important; }
.wrapper.align-center a:hover { color: var(--teal-dark) !important; }

/* Gallery polish */
.gallery .image img { transition: transform 0.28s var(--ease), box-shadow 0.28s var(--ease); border-radius: 12px; }
.gallery .image:hover img { transform: translateY(-3px); box-shadow: var(--shadow-md); }

/* Ensure caption buttons are high-contrast */
.gallery .caption .button,
.gallery .caption button,
.gallery .caption input[type="button"],
.gallery .caption input[type="submit"] {
  background: var(--teal) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 10px 22px -12px rgba(15, 107, 92, 0.75) !important;
}

.gallery .caption .button:hover,
.gallery .caption button:hover,
.gallery .caption input[type="button"]:hover,
.gallery .caption input[type="submit"]:hover {
  background: var(--teal-dark) !important;
  color: #fff !important;
}

/* Card polish */
.items .inner { transition: box-shadow 0.22s var(--ease), transform 0.22s var(--ease); }
.items .inner:hover { box-shadow: var(--shadow-sm); transform: translateY(-2px); }