


.legal-hero {
  position: relative;
  padding: 140px 0 80px;
  overflow: hidden;
  background: linear-gradient(135deg, var(--bg-color) 0%, var(--secondary-bg-color) 50%, #f0f9ff 100%);
}

.legal-hero::before {
  content: '';
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-image:
    radial-gradient(circle at 15% 20%, rgba(47, 79, 79, 0.03) 0%, transparent 50%),
    radial-gradient(circle at 85% 80%, rgba(255, 165, 0, 0.03) 0%, transparent 50%),
    url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%232F4F4F' fill-opacity='0.015'%3E%3Cpath d='M20 20c0-11.046-8.954-20-20-20s-20 8.954-20 20 8.954 20 20 20 20-8.954 20-20zm-4 0c0-8.837-7.163-16-16-16s-16 7.163-16 16 7.163 16 16 16 16-7.163 16-16z'/%3E%3C/g%3E%3C/svg%3E");
}

.legal-hero__content {
  position: relative;
  z-index: 2;
  max-width: 900px;
  margin: 0 auto;
  text-align: center;
}

.legal-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  border: 2px solid rgba(47, 79, 79, 0.1);
  border-radius: 30px;
  padding: 14px 28px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.08);
  color: var(--main-color);
  font-weight: 700;
  font-size: 0.95rem;
  background: rgba(255, 255, 255, 0.9);
  backdrop-filter: blur(10px);
  transition: all 0.3s ease;
}

.legal-hero__badge:hover {
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}

.legal-hero__badge i {
  color: var(--accent-color);
  font-size: 1.1rem;
}

.legal-hero__title {
  margin-bottom: 20px;
  color: var(--main-color);
  font-weight: 900;
  font-size: 3.5rem;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.legal-hero__subtitle {
  margin-bottom: 30px;
  opacity: 0.9;
  color: var(--text-color);
  font-size: 1.25rem;
  line-height: 1.6;
}

.legal-hero__meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 40px;
}

.legal-meta-item {
  display: flex;
  align-items: center;
  gap: 8px;
  opacity: 0.8;
  color: var(--text-color);
  font-weight: 500;
  font-size: 0.9rem;
}

.legal-meta-item i {
  color: var(--accent-color);
  font-size: 0.85rem;
}


.legal-content {
  padding: 80px 0;
  background: var(--bg-color);
}

.legal-layout {
  display: grid;
  grid-template-columns: 280px 1fr;
  align-items: start;
  gap: 60px;
  max-width: 1400px;
  margin: 0 auto;
}


.legal-nav {
  position: sticky;
  top: 100px;
  left: 0;
}

.legal-nav__sticky {
  position: sticky;
  top: 120px;
  border: 2px solid rgba(47, 79, 79, 0.05);
  border-radius: 20px;
  padding: 30px;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.08);
  background: white;
}

.legal-nav__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
  border-bottom: 2px solid rgba(47, 79, 79, 0.1);
  padding-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.1rem;
}

.legal-nav__title i {
  color: var(--accent-color);
  font-size: 1rem;
}

.legal-nav__list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.legal-nav__link {
  display: flex;
  align-items: center;
  gap: 12px;
  border-radius: 12px;
  padding: 12px 16px;
  opacity: 0.8;
  color: var(--text-color);
  font-weight: 500;
  font-size: 0.9rem;
  text-decoration: none;
  transition: all 0.3s ease;
}

.legal-nav__link:hover {
  opacity: 1;
  color: var(--accent-color);
  background: rgba(255, 165, 0, 0.08);
  transform: translateX(4px);
}

.legal-nav__link i {
  width: 14px;
  color: var(--accent-color);
  font-size: 0.85rem;
  text-align: center;
}


.legal-article {
  border-radius: 20px;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  background: white;
}


.legal-section {
  border-bottom: 1px solid rgba(47, 79, 79, 0.08);
}

.legal-section:last-child {
  border-bottom: none;
}

.legal-section__header {
  padding: 40px 50px 0;
}

.legal-section__title {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 20px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.8rem;
  line-height: 1.3;
}

.legal-section__title i {
  color: var(--accent-color);
  font-size: 1.5rem;
}

.legal-section__content {
  padding: 0 50px 50px;
  color: var(--text-color);
  font-size: 1rem;
  line-height: 1.7;
}

.legal-section__content p {
  margin-bottom: 20px;
}

.legal-section__content h3,
.legal-section__content h4,
.legal-section__content h5,
.legal-section__content h6 {
  margin-top: 24px;
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}

.legal-section__content h3 {
  font-size: 1.4rem;
}

.legal-section__content h4 {
  font-size: 1.2rem;
}

.legal-section__content h5 {
  font-size: 1.1rem;
}

.legal-section__content h6 {
  font-size: 1rem;
}


.info-box {
  display: flex;
  gap: 16px;
  margin: 24px 0;
  border-radius: 16px;
  border-left: 4px solid;
  padding: 24px;
}

.info-box--primary {
  border-left-color: #3b82f6;
  background: rgba(59, 130, 246, 0.05);
}

.info-box--success {
  border-left-color: #22c55e;
  background: rgba(34, 197, 94, 0.05);
}

.info-box--warning {
  border-left-color: #f59e0b;
  background: rgba(245, 158, 11, 0.05);
}

.info-box--info {
  border-left-color: #6366f1;
  background: rgba(99, 102, 241, 0.05);
}

.info-box__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  background: white;
}

.info-box--primary .info-box__icon {
  color: #3b82f6;
}

.info-box--success .info-box__icon {
  color: #22c55e;
}

.info-box--warning .info-box__icon {
  color: #f59e0b;
}

.info-box--info .info-box__icon {
  color: #6366f1;
}

.info-box__title {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.1rem;
}

.info-box__content p {
  margin-bottom: 0;
}


.company-info {
  margin-top: 30px;
  border-radius: 12px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.company-info h4 {
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}

.company-details {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.company-details li {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-color);
  font-size: 0.95rem;
}

.company-details li i {
  width: 16px;
  color: var(--accent-color);
  text-align: center;
}

.company-details strong {
  min-width: 100px;
  color: var(--main-color);
  font-weight: 600;
}


.info-list {
  margin: 20px 0;
  padding-left: 0;
}

.info-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--text-color);
  line-height: 1.6;
}

.info-list li i {
  flex-shrink: 0;
  margin-top: 4px;
  color: #22c55e;
  font-size: 0.85rem;
}

.exclusions-list,
.restrictions-list {
  margin: 20px 0;
}

.exclusions-list li,
.restrictions-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--text-color);
  line-height: 1.6;
}

.exclusions-list li i,
.restrictions-list li i {
  flex-shrink: 0;
  margin-top: 4px;
  color: #ef4444;
  font-size: 0.85rem;
}


.info-category {
  margin: 30px 0;
  border: 1px solid rgba(47, 79, 79, 0.08);
  border-radius: 16px;
  padding: 30px;
  background: rgba(47, 79, 79, 0.02);
}

.info-category__title {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.2rem;
}

.info-category__title i {
  color: var(--accent-color);
  font-size: 1.1rem;
}


.use-cases {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.use-case {
  display: flex;
  gap: 16px;
  border: 2px solid transparent;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.use-case:hover {
  border-color: rgba(255, 165, 0, 0.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.use-case__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.2rem;
  background: linear-gradient(135deg, var(--accent-color), #ff8a00);
}

.use-case__title {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.1rem;
}

.use-case__content p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.95rem;
}


.sharing-scenarios {
  margin: 30px 0;
}

.sharing-scenario {
  margin-bottom: 30px;
  border-radius: 12px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.sharing-scenario h4 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}

.sharing-scenario h4 i {
  color: var(--accent-color);
}

.sharing-scenario ul {
  margin-top: 12px;
  padding-left: 20px;
}

.sharing-scenario li {
  margin-bottom: 8px;
  color: var(--text-color);
  line-height: 1.5;
}


.security-measures {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.security-measure {
  display: flex;
  gap: 16px;
  border: 1px solid rgba(34, 197, 94, 0.1);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.security-measure:hover {
  border-color: rgba(34, 197, 94, 0.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.security-measure__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.2rem;
  background: linear-gradient(135deg, #22c55e, #16a34a);
}

.security-measure__content h4 {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.1rem;
}

.security-measure__content p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.95rem;
}


.cookie-types {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.cookie-type {
  border: 2px solid rgba(99, 102, 241, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(99, 102, 241, 0.02);
  transition: all 0.3s ease;
}

.cookie-type:hover {
  border-color: rgba(99, 102, 241, 0.2);
  background: rgba(99, 102, 241, 0.04);
  transform: translateY(-2px);
}

.cookie-type h4 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--main-color);
  font-weight: 700;
}

.cookie-type h4 i {
  color: #6366f1;
}

.cookie-control {
  margin-top: 30px;
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.cookie-control h4 {
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}


.privacy-rights {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.privacy-right {
  display: flex;
  gap: 16px;
  border: 2px solid transparent;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.privacy-right:hover {
  border-color: rgba(255, 165, 0, 0.2);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.privacy-right__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.2rem;
  background: linear-gradient(135deg, var(--main-color), var(--accent-color));
}

.privacy-right__content h4 {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
  font-size: 1.1rem;
}

.privacy-right__content p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.95rem;
}


.contact-methods {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.contact-method {
  display: flex;
  gap: 16px;
  border: 2px solid rgba(47, 79, 79, 0.05);
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
  transition: all 0.3s ease;
}

.contact-method:hover {
  border-color: rgba(255, 165, 0, 0.2);
  background: rgba(47, 79, 79, 0.04);
  transform: translateY(-2px);
}

.contact-method__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.2rem;
  background: var(--accent-color);
}

.contact-method__content h4 {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.contact-method__content p {
  margin-bottom: 4px;
  color: var(--main-color);
  font-weight: 600;
}

.contact-method__content small {
  opacity: 0.8;
  color: var(--text-color);
  font-size: 0.85rem;
}


.policy-updates {
  margin-top: 30px;
  border: 2px solid rgba(34, 197, 94, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(34, 197, 94, 0.05);
}

.policy-updates h4 {
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}




.company-details-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.company-detail {
  display: flex;
  gap: 16px;
  border: 2px solid rgba(47, 79, 79, 0.05);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.company-detail:hover {
  border-color: rgba(255, 165, 0, 0.2);
  transform: translateY(-2px);
}

.company-detail__icon {
  display: flex;
  flex-shrink: 0;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  color: white;
  font-size: 1.2rem;
  background: var(--accent-color);
}

.company-detail__content h4 {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.company-detail__content p {
  margin-bottom: 0;
  line-height: 1.5;
}


.business-hours {
  margin-top: 30px;
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.business-hours h4 {
  margin-bottom: 20px;
  color: var(--main-color);
  font-weight: 700;
}

.hours-grid {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.hours-item {
  display: flex;
  align-items: center;
  gap: 12px;
  color: var(--text-color);
  font-size: 0.95rem;
}

.hours-item i {
  width: 16px;
  color: var(--accent-color);
}


.product-categories {
  margin: 30px 0;
}

.product-category {
  margin-bottom: 24px;
  border-radius: 16px;
  border-left: 4px solid var(--accent-color);
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.product-category h4 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--main-color);
  font-weight: 700;
}

.product-category h4 i {
  color: var(--accent-color);
}


.product-standards {
  margin-top: 30px;
}

.standards-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 16px;
  margin-top: 16px;
}

.standard-item {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(34, 197, 94, 0.1);
  border-radius: 12px;
  padding: 16px;
  color: var(--main-color);
  font-weight: 500;
  font-size: 0.9rem;
  background: rgba(34, 197, 94, 0.05);
}

.standard-item i {
  color: #22c55e;
  font-size: 1rem;
}


.process-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.process-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  text-align: center;
  background: white;
  transition: all 0.3s ease;
}

.process-step:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
}

.process-step__number {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  margin-bottom: 16px;
  border-radius: 50%;
  color: white;
  font-weight: 700;
  font-size: 1.2rem;
  background: var(--accent-color);
}

.process-step__content h5,
.process-step__content h6 {
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.process-step__content p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.payment-methods {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.payment-method {
  display: flex;
  align-items: center;
  gap: 16px;
  border: 2px solid rgba(47, 79, 79, 0.05);
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.payment-method:hover {
  border-color: rgba(255, 165, 0, 0.2);
  transform: translateY(-2px);
}

.payment-method i {
  flex-shrink: 0;
  color: var(--accent-color);
  font-size: 1.8rem;
}

.payment-method strong {
  display: block;
  margin-bottom: 6px;
  color: var(--main-color);
  font-weight: 700;
}

.payment-method p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.pricing-currency {
  margin-top: 30px;
  border: 2px solid rgba(255, 165, 0, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(255, 165, 0, 0.05);
}


.delivery-zones {
  margin: 30px 0;
}

.zones-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.delivery-zone {
  border: 2px solid transparent;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.delivery-zone:hover {
  border-color: rgba(255, 165, 0, 0.2);
  transform: translateY(-2px);
}

.zone-header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
  border-bottom: 1px solid rgba(47, 79, 79, 0.1);
  padding-bottom: 12px;
}

.zone-header i {
  color: var(--accent-color);
}

.zone-header h5 {
  color: var(--main-color);
  font-weight: 700;
}

.delivery-zone ul {
  padding-left: 0;
}

.delivery-zone li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--text-color);
  font-size: 0.9rem;
}

.delivery-zone li::before {
  content: '•';
  color: var(--accent-color);
  font-weight: bold;
}


.timeline-items {
  display: flex;
  flex-direction: column;
  gap: 20px;
  margin: 30px 0;
}

.timeline-item {
  display: flex;
  gap: 16px;
  border-radius: 12px;
  border-left: 4px solid var(--accent-color);
  padding: 20px;
  background: rgba(47, 79, 79, 0.02);
}

.timeline-item i {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--accent-color);
  font-size: 1.2rem;
}

.timeline-item strong {
  display: block;
  margin-bottom: 6px;
  color: var(--main-color);
  font-weight: 700;
}

.timeline-item p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.policy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.policy-item {
  border-radius: 12px;
  padding: 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  text-align: center;
  background: white;
  transition: transform 0.3s ease;
}

.policy-item:hover {
  transform: translateY(-2px);
}

.policy-item h5 {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
  color: var(--main-color);
  font-weight: 700;
}

.policy-item h5 i {
  color: var(--accent-color);
}

.policy-item p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.return-policy {
  margin: 30px 0;
}

.return-conditions {
  margin: 24px 0;
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}

.return-conditions h5 {
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}

.return-process {
  margin-top: 30px;
}


.warranty-terms {
  margin: 30px 0;
}

.warranty-tiers {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.warranty-tier {
  border-radius: 16px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  background: white;
  transition: all 0.3s ease;
}

.warranty-tier:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
}

.warranty-tier__header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 24px;
  color: white;
  background: linear-gradient(135deg, var(--main-color), var(--accent-color));
}

.warranty-tier__header i {
  font-size: 1.2rem;
}

.warranty-tier__header h5 {
  margin: 0;
  font-weight: 700;
}

.warranty-tier__content {
  padding: 24px;
}

.warranty-tier__content p {
  margin-bottom: 16px;
  opacity: 0.9;
  color: var(--text-color);
}

.warranty-tier__content ul {
  padding-left: 0;
}

.warranty-tier__content li {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  color: var(--text-color);
  font-size: 0.9rem;
}

.warranty-tier__content li::before {
  content: '✓';
  color: #22c55e;
  font-weight: bold;
}


.warranty-exclusions {
  margin-top: 30px;
  border: 2px solid rgba(239, 68, 68, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(239, 68, 68, 0.05);
}

.warranty-exclusions h5 {
  margin-bottom: 16px;
  color: var(--main-color);
  font-weight: 700;
}


.acceptable-use {
  margin: 30px 0;
  border: 2px solid rgba(34, 197, 94, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(34, 197, 94, 0.05);
}


.prohibited-activities {
  margin: 30px 0;
}

.prohibited-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 24px;
  margin-top: 24px;
}

.prohibited-item {
  display: flex;
  gap: 16px;
  border: 2px solid rgba(239, 68, 68, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(239, 68, 68, 0.05);
  transition: all 0.3s ease;
}

.prohibited-item:hover {
  border-color: rgba(239, 68, 68, 0.2);
  background: rgba(239, 68, 68, 0.08);
}

.prohibited-item i {
  flex-shrink: 0;
  margin-top: 2px;
  color: #ef4444;
  font-size: 1.2rem;
}

.prohibited-item strong {
  display: block;
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.prohibited-item p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.account-responsibilities {
  margin: 30px 0;
  border: 2px solid rgba(99, 102, 241, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(99, 102, 241, 0.05);
}


.ip-categories {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.ip-category {
  display: flex;
  gap: 16px;
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.ip-category:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.ip-category i {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--accent-color);
  font-size: 1.4rem;
}

.ip-category strong {
  display: block;
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.ip-category p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.usage-permissions {
  margin: 30px 0;
  border: 2px solid rgba(34, 197, 94, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(34, 197, 94, 0.05);
}


.usage-restrictions {
  margin: 30px 0;
  border: 2px solid rgba(239, 68, 68, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(239, 68, 68, 0.05);
}


[name="dmca-policy"] {
  margin: 30px 0;
  border: 2px solid rgba(47, 79, 79, 0.08);
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
}


.liability-limits {
  margin: 30px 0;
}

.excluded-damages {
  margin: 24px 0;
  border: 2px solid rgba(239, 68, 68, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(239, 68, 68, 0.05);
}


.force-majeure {
  margin: 30px 0;
}

.force-majeure-events {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 16px;
  margin-top: 20px;
}

.fm-event {
  display: flex;
  align-items: center;
  gap: 12px;
  border: 1px solid rgba(245, 158, 11, 0.1);
  border-radius: 12px;
  padding: 16px;
  color: var(--text-color);
  font-size: 0.9rem;
  background: rgba(245, 158, 11, 0.05);
}

.fm-event i {
  flex-shrink: 0;
  color: #f59e0b;
}


.dispute-resolution {
  margin: 30px 0;
}

.resolution-steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.resolution-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-radius: 16px;
  padding: 30px 20px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  text-align: center;
  background: white;
  transition: all 0.3s ease;
}

.resolution-step:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
}

.resolution-step__number {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  margin-bottom: 20px;
  border-radius: 50%;
  color: white;
  font-weight: 700;
  font-size: 1.4rem;
  background: linear-gradient(135deg, var(--main-color), var(--accent-color));
}

.resolution-step__content h5 {
  margin-bottom: 12px;
  color: var(--main-color);
  font-weight: 700;
}

.resolution-step__content p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.9rem;
}


.consumer-protection {
  margin: 30px 0;
}


.legal-provisions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.legal-provision {
  border-radius: 16px;
  padding: 24px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  background: white;
  transition: all 0.3s ease;
}

.legal-provision:hover {
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.legal-provision h5 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
  color: var(--main-color);
  font-weight: 700;
}

.legal-provision h5 i {
  color: var(--accent-color);
}

.legal-provision p {
  margin-bottom: 0;
  opacity: 0.9;
  font-size: 0.95rem;
}


.legal-contacts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
  margin: 30px 0;
}

.legal-contact {
  display: flex;
  gap: 16px;
  border: 2px solid rgba(47, 79, 79, 0.05);
  border-radius: 16px;
  padding: 24px;
  background: rgba(47, 79, 79, 0.02);
  transition: all 0.3s ease;
}

.legal-contact:hover {
  border-color: rgba(255, 165, 0, 0.2);
  background: rgba(47, 79, 79, 0.04);
}

.legal-contact i {
  flex-shrink: 0;
  margin-top: 2px;
  color: var(--accent-color);
  font-size: 1.2rem;
}

.legal-contact strong {
  display: block;
  margin-bottom: 8px;
  color: var(--main-color);
  font-weight: 700;
}

.legal-contact p {
  margin-bottom: 0;
  line-height: 1.5;
}


.terms-scope {
  margin-top: 30px;
  border: 2px solid rgba(99, 102, 241, 0.1);
  border-radius: 16px;
  padding: 24px;
  background: rgba(99, 102, 241, 0.05);
}


@media (max-width: 1024px) {
  .legal-layout {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .legal-nav {
    order: 2;
  }

  .legal-article {
    order: 1;
  }

  .legal-nav__sticky {
    position: static;
    top: auto;
  }

  .legal-nav__list {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 12px;
  }

  .legal-nav__link {
    border-radius: 20px;
    padding: 8px 16px;
    font-size: 0.85rem;
    background: rgba(47, 79, 79, 0.05);
  }

  .legal-hero__title {
    font-size: 2.8rem;
  }

  .legal-hero__meta {
    gap: 20px;
  }
}

@media (max-width: 768px) {
  .legal-hero {
    padding: 120px 0 60px;
  }

  .company-details li {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }

  .legal-hero__title {
    font-size: 2.4rem;
  }

  .legal-hero__meta {
    flex-direction: column;
    gap: 12px;
  }

  .legal-content {
    padding: 60px 0;
  }

  .legal-section__header {
    padding: 30px 30px 0;
  }

  .legal-section__content {
    padding: 0 30px 40px;
  }

  .legal-section__title {
    font-size: 1.5rem;
  }

  .legal-section__title i {
    font-size: 1.2rem;
  }

  .legal-nav__title {
    font-size: 1rem;
  }

  .legal-nav__link {
    font-size: 0.8rem;
  }

  .use-cases,
  .security-measures,
  .cookie-types,
  .privacy-rights,
  .contact-methods {
    grid-template-columns: 1fr;
  }

  .company-details-grid,
  .zones-grid,
  .warranty-tiers,
  .prohibited-grid,
  .ip-categories {
    grid-template-columns: 1fr;
  }

  .process-steps,
  .resolution-steps {
    grid-template-columns: 1fr;
  }

  .payment-methods {
    grid-template-columns: 1fr;
  }

  .policy-grid {
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  }

  .timeline-items {
    gap: 16px;
  }

  .timeline-item {
    flex-direction: column;
    text-align: center;
  }

  .hours-grid {
    gap: 8px;
  }

  .standards-grid {
    grid-template-columns: 1fr;
  }

  .force-majeure-events {
    grid-template-columns: 1fr;
  }

  .legal-provisions {
    grid-template-columns: 1fr;
  }

  .legal-contacts {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .legal-hero {
    padding: 100px 0 40px;
  }

  .legal-hero__title {
    font-size: 2rem;
  }

  .legal-section__header {
    padding: 20px 20px 0;
  }

  .legal-section__content {
    padding: 0 20px 30px;
  }

  .legal-section__title {
    flex-direction: column;
    gap: 8px;
    font-size: 1.3rem;
    text-align: center;
  }

  .legal-nav__sticky {
    padding: 20px;
  }

  .legal-nav__title {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .legal-nav__list {
    justify-content: center;
  }

  .legal-nav__link {
    padding: 6px 12px;
    font-size: 0.75rem;
  }

  .info-box {
    flex-direction: column;
    text-align: center;
  }

  .use-case,
  .security-measure,
  .privacy-right,
  .contact-method,
  .company-detail,
  .prohibited-item,
  .ip-category,
  .legal-contact {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .delivery-zone {
    padding: 20px;
  }

  .zone-header {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .warranty-tier__header {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }

  .policy-grid {
    grid-template-columns: 1fr;
  }

  .process-step__number,
  .resolution-step__number {
    width: 35px;
    height: 35px;
    font-size: 1rem;
  }

  .resolution-step {
    padding: 24px 16px;
  }

  .hours-item {
    flex-direction: column;
    gap: 6px;
    text-align: center;
  }

  .fm-event {
    flex-direction: column;
    gap: 8px;
    text-align: center;
  }
}