/* Care for the product, before and after delivery. */
.care-section {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 112px 0 100px;
  border-block: 1px solid #bca1df20;
  background: radial-gradient(ellipse at 85% 12%, #4a2d6c24, transparent 50%), #0d0b14;
}
.care-section .section-label { margin-bottom: 39px; }
.care-heading {
  display: grid;
  grid-template-columns: minmax(0, 1.6fr) minmax(220px, .7fr);
  align-items: end;
  gap: 60px;
  margin-bottom: 50px;
}
.care-heading h2 {
  font-size: clamp(39px, 4.1vw, 60px);
  line-height: 1.14;
  letter-spacing: -.055em;
}
.care-heading > p {
  max-width: 290px;
  padding-bottom: 5px;
  font-size: 16px;
  line-height: 1.85;
  color: #bdb3cc;
  text-wrap: pretty;
}
.care-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}
.care-card {
  --care-accent: #c2a2f7;
  --care-glow: #9266d918;
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  padding: 32px 36px 27px;
  border: 1px solid #9e87bd38;
  border-radius: 20px;
  background: radial-gradient(ellipse at 100% 0%, var(--care-glow), transparent 68%), #17121f;
  transition: border-color .25s, background-color .25s;
}
.care-card:hover, .care-card:focus-within { border-color: #b59ad66e; }
.care-card--support { --care-accent: #9acddd; --care-glow: #4c9cb222; }
.care-card--packaging { --care-accent: #d7a4cc; --care-glow: #b55b9f1d; }
.care-card--parts { --care-accent: #b2baf2; --care-glow: #7481d522; }
.care-card-top {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 29px;
  color: #c0b1ce;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .12em;
}
.care-card-number {
  color: var(--care-accent);
  font-size: 13px;
  letter-spacing: .02em;
  font-variant-numeric: tabular-nums;
}
.care-card-top::after {
  content: '';
  width: 46px;
  height: 1px;
  margin-left: auto;
  background: linear-gradient(90deg, var(--care-accent), transparent);
}
.care-card h3 {
  margin-bottom: 19px;
  color: #f0eaf7;
  font-size: clamp(30px, 3vw, 40px);
  line-height: 1.18;
  letter-spacing: -.045em;
}
.care-card > p {
  max-width: 440px;
  margin-bottom: 32px;
  color: #beb3cb;
  font-size: 15px;
  line-height: 1.85;
  text-wrap: pretty;
}
.care-action {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  width: 100%;
  min-height: 49px;
  margin-top: auto;
  padding: 20px 0 0;
  border: 0;
  border-top: 1px solid #ae94cb2e;
  background: transparent;
  color: #e0d4ee;
  text-align: left;
  font: 600 13px/1.6 var(--font);
  transition: color .2s;
}
.care-action > span {
  color: var(--care-accent);
  font-size: 23px;
  line-height: 1;
  transition: transform .2s;
}
.care-action:hover { color: var(--care-accent); }
.care-action:hover > span { transform: translate(2px, -2px); }
.care-action:focus-visible { outline: 2px solid var(--care-accent); outline-offset: 6px; }
.care-channel-note {
  max-width: 760px;
  margin-top: 28px;
  color: #b7a9c5;
  font-size: 12px;
  line-height: 1.8;
}
@media (max-width: 1000px) {
  .care-heading { grid-template-columns: minmax(0, 1.5fr) minmax(190px, .8fr); gap: 30px; }
  .care-heading h2 { font-size: 43px; }
  .care-heading > p { font-size: 15px; }
  .care-card { padding: 28px; }
  .care-card h3 { font-size: 33px; }
}
@media (max-width: 700px) {
  .care-section { padding: 76px 0 68px; }
  .care-heading { grid-template-columns: 1fr; gap: 24px; margin-bottom: 34px; }
  .care-heading h2 { font-size: clamp(35px, 7.8vw, 49px); }
  .care-heading > p { max-width: 430px; padding: 0; font-size: 16px; }
  .care-grid { grid-template-columns: 1fr; gap: 17px; }
  .care-card { padding: 27px 28px 23px; }
  .care-card-top { margin-bottom: 25px; }
  .care-card h3 { font-size: 34px; }
  .care-card > p { max-width: none; margin-bottom: 27px; }
  .care-channel-note { margin-top: 24px; }
}
@media (max-width: 370px) {
  .care-heading h2 { font-size: 32px; }
  .care-card { padding-inline: 23px; }
  .care-card h3 { font-size: 31px; }
  .care-card-top { font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .care-card, .care-action, .care-action > span { transition: none; }
  .care-action:hover > span { transform: none; }
}

/* Product selection is the starting point of customer care. */
.care-card--quality{grid-column:1/-1;padding:38px 36px 28px;--care-accent:#cab1ff;background:radial-gradient(ellipse at 8% 0%,#6b409c35,transparent 60%),linear-gradient(115deg,#1e152c,#11151f);border-color:#ba9de654}
.care-card--quality .care-card-top{margin-bottom:28px}
.care-quality-content{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:center}
.care-quality-content h3{font-size:clamp(34px,3.2vw,46px);margin:0}
.care-quality-copy p{color:#c5b9d3;font-size:16px;line-height:1.85;max-width:500px;text-wrap:pretty}
.care-quality-copy p+p{margin-top:17px}
.care-quality-points{list-style:none;padding:24px 0 0;margin:30px 0 0;border-top:1px solid #b99bd333;display:flex;flex-wrap:wrap;gap:14px 40px}
.care-quality-points li{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:600;color:#c6b8db}
.care-quality-points li::before{content:'';width:4px;height:4px;border-radius:50%;background:linear-gradient(135deg,#a8dfea,#c3a1f4);flex-shrink:0}
@media(max-width:1000px){.care-card--quality{padding:30px 28px 26px}.care-quality-content{gap:35px}.care-quality-content h3{font-size:35px}.care-quality-copy p{font-size:15px}.care-quality-points{gap:14px 25px}}
@media(max-width:700px){.care-card--quality{padding:28px}.care-quality-content{grid-template-columns:1fr;gap:24px}.care-quality-content h3{font-size:34px}.care-quality-copy p{font-size:15px}.care-quality-points{display:grid;gap:12px;margin-top:25px;padding-top:23px}}
@media(max-width:370px){.care-card--quality{padding-inline:23px}.care-quality-content h3{font-size:30px}}
