.care-main { color: #0c0c0d; background: #fff; }
.care-hero { position: relative; min-height: 590px; overflow: hidden; background: #f5f4f2; }
.care-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.care-hero__shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgb(255 255 255 / 98%) 0%, rgb(255 255 255 / 91%) 29%, rgb(255 255 255 / 18%) 55%, transparent 72%); }
.care-hero__inner { position: relative; z-index: 2; padding-top: 34px; padding-bottom: 42px; }
.care-breadcrumb { display: flex; gap: 10px; align-items: center; margin-bottom: clamp(35px, 5vw, 64px); font-size: 13px; font-weight: 800; text-transform: uppercase; }
.care-breadcrumb a:hover { color: #e0181f; }
.care-hero__copy { max-width: 465px; }
.care-hero h1 { margin: 0 0 24px; font-size: clamp(3.8rem, 6.3vw, 6.6rem); line-height: .92; letter-spacing: -.035em; text-transform: uppercase; }
.care-hero__copy > p { max-width: 410px; margin: 0; font-size: clamp(16px, 1.45vw, 20px); line-height: 1.55; }
.care-hero__note { display: flex; align-items: center; gap: 18px; max-width: 455px; margin-top: 48px; padding: 17px 20px; border: 1px solid #1a1a1a; background: rgb(255 255 255 / 72%); backdrop-filter: blur(5px); }
.care-hero__note svg { width: 44px; height: 44px; flex: 0 0 44px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.care-hero__note strong { font-size: 12px; line-height: 1.45; text-transform: uppercase; }

.care-rules { padding-top: clamp(36px, 4vw, 58px); padding-bottom: 20px; }
.care-rules > h2 { margin: 0 0 24px; text-align: center; font-size: clamp(1.6rem, 3vw, 2.2rem); text-transform: uppercase; }
.care-rules__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; }
.care-rule { min-width: 0; padding: 26px 16px 24px; text-align: center; border: 1px solid #ddd; border-radius: 9px; background: #fff; transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.care-rule:hover { border-color: #111; box-shadow: 0 12px 28px rgb(0 0 0 / 8%); transform: translateY(-4px); }
.care-rule svg { width: 58px; height: 58px; margin-bottom: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.care-rule h3 { margin: 0 0 13px; font-size: 13px; text-transform: uppercase; }
.care-rule p { margin: 0; color: #353535; font-size: 12px; line-height: 1.55; }

.care-details { display: grid; grid-template-columns: 1fr 1.15fr 1fr; margin-top: 12px; margin-bottom: clamp(34px, 5vw, 68px); overflow: hidden; border: 1px solid #ddd; border-radius: 10px; }
.care-details__text { padding: clamp(26px, 3.4vw, 44px); }
.care-details__text h2 { margin: 0 0 22px; font-size: 17px; text-transform: uppercase; }
.care-details__text p, .care-details__text li { font-size: 14px; line-height: 1.75; }
.care-details__text p { margin: 0; }
.care-details__text ul { display: grid; gap: 7px; margin: 0; padding-left: 18px; }
.care-quality { position: relative; display: grid; place-content: center; min-height: 260px; padding: 35px; overflow: hidden; color: #fff; text-align: center; background: radial-gradient(circle at 35% 20%, #343434, #111 52%, #050505); }
.care-quality::before { position: absolute; inset: -30%; content: ""; opacity: .5; background: repeating-linear-gradient(118deg, transparent 0 7px, rgb(255 255 255 / 5%) 8px 9px); transform: rotate(-7deg); }
.care-quality::after { position: absolute; inset: 20%; content: ""; border: 2px dashed rgb(255 255 255 / 45%); border-radius: 8px; transform: rotate(-4deg); }
.care-quality span, .care-quality strong { position: relative; z-index: 2; text-transform: uppercase; }
.care-quality span { font-size: clamp(1.2rem, 2vw, 1.8rem); letter-spacing: .07em; }
.care-quality strong { margin-top: 6px; font-size: clamp(1.8rem, 3.2vw, 3rem); line-height: 1; }

@media (max-width: 1050px) {
  .care-rules__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .care-details { grid-template-columns: 1fr 1fr; }
  .care-quality { grid-row: span 2; }
}

@media (max-width: 720px) {
  .care-hero { min-height: 650px; }
  .care-hero__image { object-position: 62% center; }
  .care-hero__shade { background: linear-gradient(180deg, rgb(255 255 255 / 40%) 0%, rgb(255 255 255 / 90%) 46%, #fff 68%); }
  .care-hero__inner { display: flex; min-height: 650px; flex-direction: column; padding-top: 22px; padding-bottom: 30px; }
  .care-breadcrumb { margin-bottom: auto; font-size: 11px; }
  .care-hero__copy { max-width: 100%; }
  .care-hero h1 { margin-bottom: 16px; font-size: clamp(3rem, 15vw, 4.7rem); }
  .care-hero__copy > p { max-width: 100%; font-size: 15px; }
  .care-hero__note { margin-top: 22px; padding: 13px 14px; }
  .care-hero__note svg { width: 36px; height: 36px; flex-basis: 36px; }
  .care-hero__note strong { font-size: 10px; }
  .care-rules__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .care-rule { padding: 20px 11px; }
  .care-rule svg { width: 48px; height: 48px; }
  .care-details { grid-template-columns: 1fr; }
  .care-quality { grid-row: auto; min-height: 230px; order: 2; }
  .care-details__text:last-child { order: 3; }
}

@media (prefers-reduced-motion: reduce) {
  .care-rule { transition: none; }
}
