/**
 * Home landing — brand-themed category cards (Minimal Interior + Tiny Place).
 * Scoped to body.page-home; mirrors story-theme-minimalinterior / theme-tinyplace palettes.
 */

body.page-home .category-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

body.page-home .category-card > * {
  position: relative;
  z-index: 1;
}

/* —— Minimal Interior: editorial cream + terracotta accent —— */
body.page-home .category-card--minimalinterior {
  --card-text: #141210;
  --card-text-light: #5c5854;
  --card-accent: #a85d42;
  --card-border: #d9d4cb;
  --card-bg: #ffffff;
  --card-surface: #f5f2ec;

  background-color: var(--card-surface);
  background-image:
    linear-gradient(#e8e4dc 1px, transparent 1px),
    linear-gradient(90deg, #e8e4dc 1px, transparent 1px);
  background-size: 56px 56px;
  border: 1px solid var(--card-border);
  border-top: 4px solid var(--card-accent);
  border-radius: 2px;
  box-shadow: 0 2px 12px rgba(20, 18, 16, 0.06);
}

body.page-home .category-card--minimalinterior .category-title {
  font-family: var(--font-serif);
  font-weight: 500;
  letter-spacing: -0.03em;
  color: var(--card-text);
}

body.page-home .category-card--minimalinterior .category-description {
  color: var(--card-text-light);
  font-weight: 300;
}

body.page-home .category-card--minimalinterior .category-tagline {
  font-family: var(--font-serif);
  font-style: italic;
  color: var(--card-text);
}

body.page-home .category-card--minimalinterior .category-card-logo-svg {
  color: var(--card-text);
}

body.page-home .category-card--minimalinterior .btn-story {
  border-radius: 2px;
  border-width: 1px;
  border-color: var(--card-border);
  color: var(--card-text);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.page-home .category-card--minimalinterior .btn-story:hover {
  background: var(--card-text);
  border-color: var(--card-text);
  color: var(--card-surface);
}

body.page-home .category-card--minimalinterior:hover {
  box-shadow: 0 12px 32px rgba(20, 18, 16, 0.12);
}

body.page-home .category-card--minimalinterior.visible:hover {
  transform: translateY(-8px);
}

/* —— Tiny Place: soft blue palette + mural texture —— */
body.page-home .category-card--tinyplace {
  --card-text: #435f87;
  --card-text-light: #6f88ab;
  --card-accent: #5f8fda;
  --card-border: #d5e3f5;
  --card-bg: #f4f8fd;

  background: var(--card-bg);
  border: 1px solid var(--card-border);
  border-radius: 18px;
  box-shadow: 0 4px 20px rgba(67, 95, 135, 0.08);
}

body.page-home .category-card--tinyplace::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 800'%3E%3Cg fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M90 640c120-120 260-30 340-100 60-50 140-120 220-60' stroke='%2396b8ed' stroke-width='7' opacity='.5'/%3E%3Cpath d='M1230 640c100-110 220-20 290-90 40-40 110-95 170-50' stroke='%235f8fda' stroke-width='7' opacity='.5'/%3E%3Cpath d='M270 170l120 40-120 40 28-40z' stroke='%236b9be0' stroke-width='7'/%3E%3Cpath d='M1210 190l125 42-125 42 30-42z' stroke='%2389aee8' stroke-width='7'/%3E%3Ccircle cx='730' cy='170' r='28' stroke='%23d06ca1' stroke-width='6'/%3E%3Ccircle cx='790' cy='170' r='28' stroke='%23d06ca1' stroke-width='6'/%3E%3Ccircle cx='760' cy='120' r='28' stroke='%23d06ca1' stroke-width='6'/%3E%3Ccircle cx='760' cy='220' r='28' stroke='%23d06ca1' stroke-width='6'/%3E%3Ccircle cx='760' cy='170' r='16' stroke='%23f0b95e' stroke-width='6'/%3E%3C/g%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  opacity: 0.22;
  pointer-events: none;
}

body.page-home .category-card--tinyplace .category-title {
  font-family: var(--font-serif);
  font-weight: 400;
  letter-spacing: -0.02em;
  color: var(--card-text);
}

body.page-home .category-card--tinyplace .category-description {
  color: var(--card-text-light);
  font-weight: 400;
}

body.page-home .category-card--tinyplace .category-tagline {
  font-family: var(--font-serif);
  color: var(--card-text);
}

body.page-home .category-card--tinyplace .category-card-logo-svg {
  color: var(--card-text);
}

body.page-home .category-card--tinyplace .btn-story {
  border-radius: 999px;
  border-color: #c7d8f1;
  color: var(--card-text);
  font-weight: 500;
}

body.page-home .category-card--tinyplace .btn-story:hover {
  background: var(--card-accent);
  border-color: var(--card-accent);
  color: #ffffff;
}

body.page-home .category-card--tinyplace:hover {
  box-shadow: 0 14px 36px rgba(67, 95, 135, 0.14);
}

body.page-home .category-card--tinyplace.visible:hover {
  transform: translateY(-8px);
}

@media (prefers-reduced-motion: reduce) {
  body.page-home .category-card--minimalinterior .btn-story,
  body.page-home .category-card--tinyplace .btn-story {
    transition: none;
  }
}
