/* Final cross-page polish: scale, rhythm and restrained surface treatment. */
:root { --container: 1280px; }

body,
button,
input,
textarea,
select {
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}

p { text-wrap: pretty; }
h1, h2, h3 { text-wrap: balance; }

.breadcrumb { margin-bottom: 17px; font-size: 14px; }
.eyebrow { font-size: 12px; letter-spacing: .09em; }
.lead { line-height: 1.65; }

.card {
  border-radius: 16px;
  box-shadow: 0 3px 12px rgba(17, 24, 39, .035);
}
.icon-box { border-radius: 10px; }

.product-lines {
  background-color: #fafafa;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Ccircle cx='2' cy='2' r='1' fill='%23dfe3e8' fill-opacity='.68'/%3E%3C/svg%3E");
}
.campaign-offers { background-color: #f7f8fa; }

.required-app-row { border-radius: 16px; }
.required-app-download { text-decoration: none; }

.forum-page-hero + .section { background-color: #f7f8fa; }
.cf-search,
.cf-toolbar,
.cf-category,
.cf-topic-row { border-color: var(--line); }

.site-footer.footer-modern { margin-top: 0; }

/* Each inner page gets a restrained, functional texture instead of one repeated template. */
.products-page-hero {
  background-color: #fafafa;
  background-image:
    linear-gradient(90deg, rgba(211,47,47,.15) 0 1px, transparent 1px),
    linear-gradient(rgba(17,24,39,.045) 0 1px, transparent 1px);
  background-size: 72px 100%, 100% 36px;
}
.contact-page-hero {
  background-color: #fafafa;
  background-image: radial-gradient(circle, rgba(17,24,39,.11) 1px, transparent 1.2px);
  background-size: 24px 24px;
  background-position: calc(50% + 8px) center;
}
.campaign-page-hero,
.forum-page-hero { background-color: #fafafa; }

.footer-group-toggle {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  color: #737b87;
  background: transparent;
  font: inherit;
  margin-bottom: 20px;
  font-size: 12px;
  font-weight: 800;
  text-align: left;
  text-transform: uppercase;
  letter-spacing: .1em;
  cursor: default;
}
.footer-group-toggle span { display: none; }

/* Page entrances use one motion language; section reveal owns the transition. */
.page-hero .reveal h1 { animation: none; }

@media (max-width: 720px) {
  .nav-wrap { height: 78px; }
  .brand-mark { margin-left: 14px; }
  .brand-mark img { width: 117px; }

  .page-hero { padding-block: 30px 34px; }
  .page-hero .breadcrumb { margin-bottom: 14px; }
  .page-hero .eyebrow { margin-bottom: 7px; }
  .page-hero .lead { margin-top: 18px; font-size: 16px; }
  .page-hero h1 { max-width: 12ch; font-size: clamp(36px, 10vw, 42px); }
  .page-hero + .section { padding-top: 48px; }
  .products-page-hero { background-size: 48px 100%, 100% 28px; }
  .contact-page-hero { background-size: 22px 22px; }

  .section-head { gap: 14px; }
  .section-head h2 { font-size: 34px; }
  .section-head p { font-size: 15px; }

  .campaign-offers { padding-top: 54px; }
  .campaign-offers-head { margin-bottom: 30px; }

  .required-apps-head h2 { font-size: 35px; }
  .required-app-row { border-radius: 15px; }

  .contact-studio { padding-top: 42px; }
  .contact-studio-form { border-radius: 15px; }
}

@media (max-width: 560px) {
  .site-footer.footer-modern { padding-top: 52px; }
  .footer-modern-top { gap: 34px; padding-bottom: 40px; }
  .footer-modern-brand h2 { margin-top: 26px; font-size: 36px; }
  .footer-modern-brand > p { font-size: 15px; }
  .footer-modern-nav { display: block; padding: 28px 0 34px; }
  .footer-office { margin-bottom: 24px; padding-bottom: 24px; border-right: 0; border-bottom: 1px solid #dfe2e6; }
  .footer-link-group { border-bottom: 1px solid #dfe2e6; }
  .footer-group-toggle {
    display: flex;
    min-height: 58px;
    align-items: center;
    justify-content: space-between;
    color: var(--ink);
    font-size: 13px;
    font-weight: 800;
    cursor: pointer;
  }
  .footer-group-toggle span {
    display: grid;
    width: 28px;
    height: 28px;
    place-items: center;
    border: 1px solid #dfe2e6;
    border-radius: 9px;
    font-size: 18px;
    line-height: 1;
    transition: transform var(--motion-base) var(--motion-ease), color var(--motion-fast) ease, border-color var(--motion-fast) ease;
  }
  .footer-group-toggle { margin-bottom: 0; }
  .footer-group-links { max-height: 0; overflow: hidden; transition: max-height var(--motion-base) var(--motion-ease), padding var(--motion-base) ease; }
  .footer-group-links > * { visibility: hidden; margin-block: 0; opacity: 0; transition: opacity var(--motion-fast) ease; }
  .footer-link-group.is-open .footer-group-links { max-height: 240px; padding-bottom: 14px; }
  .footer-link-group.is-open .footer-group-links > * { visibility: visible; margin-block: 8px; opacity: 1; }
  .footer-link-group.is-open .footer-group-toggle { color: var(--red); }
  .footer-link-group.is-open .footer-group-toggle span { transform: rotate(45deg); border-color: rgba(211,47,47,.28); color: var(--red); }
  .footer-modern-bottom { padding-bottom: 12px; }
}