/* ============================================================
   Alpekin · Cookies Policy Styles (Alpine Green · structured)
   - Tam uyum: privacy.css / terms.css
   - Sadece tokens.css değişkenleri kullanılır
   ============================================================ */

/* Page shell */
.cookies-page {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--ivory-bone) 95%, white) 0%,
      color-mix(in srgb, var(--moon-ash) 85%, white) 100%
    );
  color: var(--dark-soil);
  padding-block: var(--space-10);
  padding-inline: var(--space-4);
}

/* readable width */
.cookies-page .prose,
.cookies-page > section,
.cookies-hero {
  max-width: min(var(--container-max), 75ch);
  margin-inline: auto;
}

/* Hero */
.cookies-hero {
  background:
    radial-gradient(90rem 38rem at 20% -20%,
      color-mix(in srgb, var(--tree-gold) 10%, transparent), transparent 60%),
    linear-gradient(135deg, var(--alpine-green),
      color-mix(in srgb, var(--tree-gold) 20%, var(--deep-moss)));
  border-radius: var(--radius-xl);
  border: 1px solid color-mix(in srgb, var(--border) 60%, transparent);
  box-shadow: var(--elevation-lg);
  padding: clamp(var(--space-7), 4vw, var(--space-10));
  margin-block-end: var(--space-8);
  position: relative;
  overflow: hidden;
}

.cookies-hero::before {
  content: "";
  position: absolute;
  inset: -25% -10% auto -25%;
  height: 60%;
  transform: rotate(8deg);
  background: linear-gradient(90deg,
    transparent 0%,
    color-mix(in srgb, var(--tree-gold) 22%, transparent) 35%,
    transparent 70%);
  pointer-events: none;
  filter: blur(18px);
  opacity: .45;
}

.cookies-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow:
    inset 0 0 0 1px color-mix(in srgb, var(--ivory-bone) 16%, transparent),
    inset 0 -24px 40px color-mix(in srgb, black 35%, transparent);
  pointer-events: none;
}

.cookies-hero h1 {
  font-family: var(--font-heading);
  font-weight: var(--weight-bold);
  font-size: clamp(2rem, 2.4vw + 1.25rem, 3rem);
  letter-spacing: var(--ls-heading-tight);
  color: var(--ivory-bone);
  text-shadow: var(--accent-gold-glow);
  margin: 0 0 var(--space-2);
}

.effective-date {
  margin: 0;
  color: color-mix(in srgb, var(--ivory-bone) 82%, var(--moon-ash));
  opacity: .95;
  font-size: clamp(.95rem, .25vw + .9rem, 1.05rem);
}

/* Sections (cards) */
.cookies-page section {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--deep-moss) 48%, black) 0%,
      color-mix(in srgb, var(--deep-moss) 62%, black) 100%
    );
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  box-shadow:
    var(--elevation-sm),
    inset 0 0 0 1px color-mix(in srgb, var(--ivory-bone) 10%, transparent);
  padding: clamp(var(--space-6), 2vw + 1rem, var(--space-8));
  margin-block: var(--space-8);
  position: relative;
  color: var(--ivory-bone);
  border-top: 3px solid var(--tree-gold);
  backdrop-filter: saturate(115%) blur(.3px);
}

.cookies-page h2 {
  color: var(--ivory-bone);
  font-size: clamp(1.25rem, 1.2vw + 1rem, 1.75rem);
  font-weight: var(--weight-semibold);
  letter-spacing: var(--ls-heading-tight);
  text-shadow: 0 0 8px color-mix(in srgb, var(--tree-gold) 22%, transparent);
  margin: 0 0 var(--space-3);
}

/* Body */
.cookies-page p,
.cookies-page li {
  color: var(--ivory-bone);
  font-size: clamp(1rem, .25vw + .95rem, 1.125rem);
  line-height: var(--lh-body);
  letter-spacing: var(--ls-body);
}
.cookies-page ul { padding-left: 1.25em; margin: 0; }
.cookies-page li { margin-block: .5em; }
.cookies-page li::marker { color: var(--tree-gold); }

.cookies-note {
  margin-top: var(--space-3);
  padding: var(--space-3) var(--space-4);
  border-radius: var(--radius-md);
  background: color-mix(in srgb, var(--tree-gold) 15%, transparent);
  border-left: 3px solid var(--tree-gold);
  color: var(--ivory-bone);
}

/* Links */
.cookies-page a {
  color: var(--tree-gold);
  text-decoration-thickness: 1px;
  transition: color var(--ease-standard);
}
.cookies-page a:hover,
.cookies-page a:focus-visible {
  color: color-mix(in srgb, var(--tree-gold) 85%, var(--sacred-copper));
  text-decoration: underline;
  outline: none;
}

/* Anchor offset for sticky headers */
.cookies-page [aria-labelledby] { scroll-margin-top: 96px; }

/* Responsive */
@media (max-width: 1024px) {
  .cookies-page { padding-block: var(--space-8); }
  .cookies-page section { margin-block: var(--space-7); }
}
@media (max-width: 640px) {
  .cookies-hero { margin-block-end: var(--space-6); }
  .cookies-page section { margin-block: var(--space-5); }
}

/* Focus / A11y */
.cookies-page :focus-visible {
  box-shadow: var(--accent-gold-ring);
  outline: none;
}

/* Motion & Print */
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; }
}
@media print {
  * { box-shadow: none !important; background: #fff !important; }
  body, .cookies-page, .cookies-page section {
    color: #000 !important;
    border-color: #000 !important;
  }
  .cookies-hero { border: 0 !important; }
  .cookies-page a { color: #000 !important; text-decoration: underline !important; }
}
