/**
 * Visual perception enhancements – Hypothele
 * Readability, rhythm, contrast, subtle motion
 */

:root {
  --hypo-text-max: 65ch;
  --hypo-line-height-body: 1.65;
  --hypo-line-height-tight: 1.35;
  --hypo-space-xs: 0.5rem;
  --hypo-space-sm: 1rem;
  --hypo-space-md: 1.5rem;
  --hypo-space-lg: 2rem;
  --hypo-space-xl: 3rem;
  --hypo-radius: 6px;
  --hypo-transition: 0.2s ease;
  --hypo-shadow-soft: 0 2px 12px rgba(0, 0, 0, 0.06);
  --hypo-shadow-text: 0 1px 2px rgba(0, 0, 0, 0.5);
}

/* ----- Typography & readability ----- */
.site-main .kerning-text {
  line-height: var(--hypo-line-height-body);
  max-width: var(--hypo-text-max);
}
.site-main .kerning-section-title,
.site-main .kerning-section-subtitle {
  line-height: var(--hypo-line-height-tight);
  margin-bottom: var(--hypo-space-sm);
}
.site-main .kerning-section-title + .kerning-text,
.site-main .kerning-section-subtitle + .kerning-text,
.site-main .title-wrap .kerning-section-title + .kerning-text {
  margin-top: var(--hypo-space-sm);
}

/* Hero: legibility over background image */
.section-header01-5 .content-wrapper .kerning-section-subtitle,
.section-header01-5 .content-wrapper .kerning-section-title {
  text-shadow: var(--hypo-shadow-text);
}
.section-header01-5 .content-wrapper .kerning-text {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
}

/* Policy / long-form text */
.section-article12-p .kerning-text,
.section-form01-i .kerning-text {
  line-height: var(--hypo-line-height-body);
  max-width: var(--hypo-text-max);
}

/* ----- Section rhythm ----- */
.site-main .section-header01-5 .content-wrapper {
  padding-top: var(--hypo-space-md);
  padding-bottom: var(--hypo-space-md);
}
.section-header01-5 .kerning-section-btn {
  margin-top: var(--hypo-space-lg);
}
.section-header01-5 .kerning-section-btn .btn {
  padding: 0.75rem 1.75rem;
  font-weight: 600;
}
.why-us,
.section-article1-7,
.section-content3-8,
.section-content8-9,
.section-contacts01-a,
.section-form01-i,
.section-pricing01-d,
.section-article06-e,
.section-content5-f,
.section-content7-g {
  padding-top: var(--hypo-space-xl);
  padding-bottom: var(--hypo-space-xl);
}
@media (min-width: 992px) {
  .why-us,
  .section-article1-7,
  .section-content3-8,
  .section-content8-9,
  .section-contacts01-a,
  .section-form01-i,
  .section-pricing01-d,
  .section-article06-e,
  .section-content5-f,
  .section-content7-g {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
}
.section-article12-p {
  padding-top: var(--hypo-space-xl);
  padding-bottom: var(--hypo-space-xl);
}
.section-article12-p .page-title {
  margin-bottom: var(--hypo-space-md);
}

/* ----- Buttons ----- */
.site-main .btn-primary,
.kerning-section-btn .btn,
.kerning-section-btn-main .btn {
  transition: transform var(--hypo-transition), box-shadow var(--hypo-transition), opacity var(--hypo-transition);
}
.site-main .btn-primary:hover,
.kerning-section-btn .btn:hover,
.kerning-section-btn-main .btn:hover {
  transform: translateY(-1px);
  box-shadow: var(--hypo-shadow-soft);
}
.site-main .btn-primary:active,
.kerning-section-btn .btn:active,
.kerning-section-btn-main .btn:active {
  transform: translateY(0);
}

/* ----- Images ----- */
.site-main .image-wrapper {
  border-radius: var(--hypo-radius);
}
.site-main .why-us .image-wrapper img,
.site-main .section-content3-8 .image-wrapper img,
.site-main .section-content8-9 .image-wrapper img,
.site-main .section-article06-e .image-wrapper img,
.site-main .section-content7-g .image-wrapper img {
  border-radius: var(--hypo-radius);
}
.site-main .section-pricing01-d .item-img {
  border-radius: var(--hypo-radius);
  overflow: hidden;
}
.site-main .section-pricing01-d .item-img img {
  border-radius: var(--hypo-radius);
}

/* ----- Contact / Find Us cards ----- */
.section-contacts01-a .items-wrapper,
.section-contacts01-j .items-wrapper {
  gap: var(--hypo-space-md);
}
.section-contacts01-a .item-wrapper,
.section-contacts01-j .item-wrapper {
  transition: background-color var(--hypo-transition), transform var(--hypo-transition);
  padding: var(--hypo-space-sm);
}
.section-contacts01-a .item-wrapper:hover,
.section-contacts01-j .item-wrapper:hover {
  background-color: rgba(0, 0, 0, 0.03);
}
.section-contacts01-a .card-box a,
.section-contacts01-j .card-box a {
  transition: color var(--hypo-transition), opacity var(--hypo-transition);
}
.section-contacts01-a .card-box a:hover,
.section-contacts01-j .card-box a:hover {
  opacity: 0.85;
}

/* ----- Form ----- */
.section-form01-i .form-control {
  transition: border-color var(--hypo-transition), box-shadow var(--hypo-transition);
  border-radius: var(--hypo-radius);
}
.section-form01-i .form-control:focus {
  border-color: #17a2b8;
  box-shadow: 0 0 0 3px rgba(23, 162, 184, 0.2);
}
.section-form01-i .btn-primary {
  padding: 0.75rem 1.5rem;
  border-radius: var(--hypo-radius);
}

/* ----- Footer ----- */
.site-footer .section-footer01-w {
  padding-top: var(--hypo-space-xl);
  padding-bottom: var(--hypo-space-lg);
}
.site-footer .nav-wrap ul {
  gap: 0.25rem;
}
.site-footer .kerning-copy {
  margin-top: var(--hypo-space-lg);
  padding-top: var(--hypo-space-md);
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  opacity: 0.95;
}

/* ----- Nav: subtle polish ----- */
.site-header .nav-link {
  transition: color var(--hypo-transition), opacity var(--hypo-transition);
}
.site-header .nav-link:hover {
  opacity: 0.9;
}
.site-header .navbar-brand .navbar-logo img {
  transition: opacity var(--hypo-transition);
}
.site-header .navbar-brand .navbar-logo:hover img {
  opacity: 0.9;
}

/* ----- Cards (About page) ----- */
.section-pricing01-d .card-box {
  padding: var(--hypo-space-md);
  border-radius: var(--hypo-radius);
}
.section-pricing01-d .item-wrapper {
  transition: transform var(--hypo-transition);
  border-radius: var(--hypo-radius);
  overflow: hidden;
  box-shadow: var(--hypo-shadow-soft);
}
.section-pricing01-d .item-wrapper:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

/* ----- Reduced motion ----- */
@media (prefers-reduced-motion: reduce) {
  .site-main .btn-primary:hover,
  .kerning-section-btn .btn:hover,
  .kerning-section-btn-main .btn:hover,
  .section-contacts01-a .item-wrapper:hover,
  .section-contacts01-j .item-wrapper:hover,
  .section-pricing01-d .item-wrapper:hover {
    transform: none;
  }
}