/* ==============================================
   TIPS SECTION
   ============================================== */
.tips {
  padding: var(--section-spacing-desktop) 0;
  background: linear-gradient(135deg, rgba(252, 250, 247, 0.95) 0%, rgba(245, 242, 237, 0.95) 100%), /* The design points at ../assets/images/CP7A9561-1.png, which is its own
                   folder layout, not the theme's — so the band has been rendering as a
                   flat cream wash with no photograph under it at all. Resized and
                   re-encoded on the way in: the source is a 4.6 MB PNG for something that
                   shows through a 95%-opaque gradient. */ url('../../img/tips-texture.jpg');
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
}
.tips-wrapper {
  width: calc(100% - 48px);
  max-width: var(--container);
  margin: 0 auto;
}
.tips-wrapper > .eyebrow {
  display: block;
  margin-bottom: 20px;
}
.tips-wrapper > h2 {
  margin-bottom: 48px;
  max-width: 100%;
}
.tips-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-bottom: 56px;
}
.tip-card {
  flex: 1 1 calc(25% - 15px);
  min-width: 220px;
}
.tip-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 20px 16px;
  border: 1.5px solid var(--border);
  transition: all var(--transition);
  display: flex;
  flex-direction: column;
  /* The design says height: 100% here, which quietly cancels the flex stretch it is
       trying to produce — a percentage height against the grid's own auto height is
       indeterminate, so each card falls back to its content height. The design's ten tips
       are all one line of copy, so the ragged bottoms never showed there. */
  align-self: stretch;
}
.tip-card:hover {
  border-color: var(--brand-orange);
  box-shadow: 0 8px 20px rgba(243, 146, 1, 0.1);
  transform: translateY(-3px);
  background: linear-gradient(135deg, rgba(249, 183, 77, 0.02) 0%, rgba(243, 146, 1, 0.02) 100%);
}
.tip-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--brand-orange-tint);
  border-radius: var(--radius-md);
  font-size: 1.3rem;
  color: var(--brand-orange);
  margin-bottom: 12px;
  flex-shrink: 0;
}
.tip-card h3 {
  margin-bottom: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--text);
  line-height: 1.3;
}
.tip-card p {
  color: var(--text-soft);
  font-size: 0.85rem;
  line-height: 1.5;
  flex-grow: 1;
}
.tip-card-link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--brand-orange);
  font-weight: 600;
  font-size: 0.8125rem;
  text-decoration: none;
  margin-top: 12px;
  transition: all var(--transition);
}
.tip-card-link:hover {
  gap: 8px;
  color: var(--brand-orange-dark);
}
.tips-footer {
  text-align: center;
  padding-top: 48px;
}
.link-arrow-large {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--brand-orange) !important;
  font-weight: 700;
  font-size: 1.1875rem;
  text-decoration: none;
  transition: all var(--transition);
  letter-spacing: 0.3px;
}
.link-arrow-large:hover {
  gap: 12px;
  color: var(--brand-orange-dark) !important;
}
@media (max-width: 1024px) {
  .tips-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
}
@media (max-width: 768px) {
  .tips {
    padding: var(--section-spacing-mobile) 0;
  }
  .tips-wrapper > h2 {
    margin-bottom: 32px;
  }
  .tips-grid {
    gap: 14px;
    margin-bottom: 40px;
    grid-template-columns: repeat(2, 1fr);
  }
  .tip-card {
    padding: 16px 12px;
  }
}
@media (max-width: 480px) {
  .tips-grid {
    grid-template-columns: 1fr;
  }
}
/*# sourceMappingURL=style.css.map */
/*# sourceMappingURL=data:application/json;charset=utf8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3N0eWxlLmxlc3MiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7O0FBSUE7RUFDSSxTQUFTLGdDQUFUO0VBQ0EsWUFBWTs7OzsrREFNSSw2QkFOaEI7RUFPQSxzQkFBQTtFQUNBLDJCQUFBO0VBQ0EsNEJBQUE7O0FBR0o7RUFDSSxPQUFPLGlCQUFQO0VBQ0EsV0FBVyxnQkFBWDtFQUNBLGNBQUE7O0FBR0osYUFBYztFQUNWLGNBQUE7RUFDQSxtQkFBQTs7QUFHSixhQUFjO0VBQ1YsbUJBQUE7RUFDQSxlQUFBOztBQUdKO0VBQ0ksYUFBQTtFQUNBLGVBQUE7RUFDQSxTQUFBO0VBQ0EsbUJBQUE7O0FBR0o7RUFDSSxVQUFVLGdCQUFWO0VBQ0EsZ0JBQUE7O0FBR0o7RUFDSSxZQUFZLFlBQVo7RUFDQSxlQUFlLGdCQUFmO0VBQ0Esa0JBQUE7RUFDQSxvQkFBb0IsYUFBcEI7RUFDQSxnQkFBZ0IsaUJBQWhCO0VBQ0EsYUFBQTtFQUNBLHNCQUFBOzs7OztFQUtBLG1CQUFBOztBQUdKLFNBQVM7RUFDTCxjQUFjLG1CQUFkO0VBQ0EsNkNBQUE7RUFDQSxXQUFXLGdCQUFYO0VBQ0EsWUFBWSxrRkFBWjs7QUFHSjtFQUNJLFdBQUE7RUFDQSxZQUFBO0VBQ0EsYUFBQTtFQUNBLG1CQUFBO0VBQ0EsdUJBQUE7RUFDQSxZQUFZLHdCQUFaO0VBQ0EsZUFBZSxnQkFBZjtFQUNBLGlCQUFBO0VBQ0EsT0FBTyxtQkFBUDtFQUNBLG1CQUFBO0VBQ0EsY0FBQTs7QUFHSixTQUFVO0VBQ04sa0JBQUE7RUFDQSxrQkFBQTtFQUNBLGdCQUFBO0VBQ0EsT0FBTyxXQUFQO0VBQ0EsZ0JBQUE7O0FBR0osU0FBVTtFQUNOLE9BQU8sZ0JBQVA7RUFDQSxrQkFBQTtFQUNBLGdCQUFBO0VBQ0EsWUFBQTs7QUFHSjtFQUNJLG9CQUFBO0VBQ0EsbUJBQUE7RUFDQSxRQUFBO0VBQ0EsT0FBTyxtQkFBUDtFQUNBLGdCQUFBO0VBQ0Esb0JBQUE7RUFDQSxxQkFBQTtFQUNBLGdCQUFBO0VBQ0EsZ0JBQWdCLGlCQUFoQjs7QUFHSixjQUFjO0VBQ1YsUUFBQTtFQUNBLE9BQU8sd0JBQVA7O0FBR0o7RUFDSSxrQkFBQTtFQUNBLGlCQUFBOztBQUdKO0VBQ0ksb0JBQUE7RUFDQSxtQkFBQTtFQUNBLFFBQUE7RUFDQSxPQUFPLG1CQUFQO0VBQ0EsZ0JBQUE7RUFDQSxvQkFBQTtFQUNBLHFCQUFBO0VBQ0EsZ0JBQWdCLGlCQUFoQjtFQUNBLHFCQUFBOztBQUdKLGlCQUFpQjtFQUNiLFNBQUE7RUFDQSxPQUFPLHdCQUFQOztBQUdKLFFBQTJCO0VBQ3ZCO0lBQWEsdUJBQXVCLGNBQXZCO0lBQXVDLFNBQUE7OztBQUd4RCxRQUEwQjtFQUN0QjtJQUFRLFNBQVMsK0JBQVQ7O0VBQ1IsYUFBYztJQUFPLG1CQUFBOztFQUNyQjtJQUFhLFNBQUE7SUFBVyxtQkFBQTtJQUFxQix1QkFBdUIsY0FBdkI7O0VBQzdDO0lBQVksa0JBQUE7OztBQUdoQixRQUEwQjtFQUN0QjtJQUFhLDBCQUFBIiwiZmlsZSI6InRpcHMvc3R5bGUuY3NzIiwic291cmNlc0NvbnRlbnQiOltdfQ== */