/* DANNY.TATTOOER — Галас на Ґанку · LIGHT рушник variant.
   Класична вышиванка: червоне + чорне по білому льну.
   Загружается ПОСЛЕ styles.css и переопределяет палитру + пару хардкодов. */

body {
  /* Semantic flip: --ink стал светлым фоном, --bone — тёмным текстом */
  --ink: #FBF7EF;        /* linen white — базовый фон */
  --ink-2: #F1EADB;      /* панель (marquee / cards / bands) */
  --bone: #17130F;       /* near-black — текст/заголовки */
  --bone-dim: #6B6156;   /* приглушённый текст */
  --line: rgba(23, 19, 16, 0.15);
  /* --red / --red-deep без изменений */

  /* Рушник-орнаменты как переиспользуемые переменные (червоне+чорне) */
  --orn-h: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='44' viewBox='0 0 56 44'%3E%3Cpath d='M0 8 L7 2 L14 8 L21 2 L28 8 L35 2 L42 8 L49 2 L56 8' fill='none' stroke='%23C8102E' stroke-width='2'/%3E%3Cpath d='M0 36 L7 42 L14 36 L21 42 L28 36 L35 42 L42 36 L49 42 L56 36' fill='none' stroke='%23C8102E' stroke-width='2'/%3E%3Crect x='20' y='14' width='16' height='16' transform='rotate(45 28 22)' fill='%23C8102E'/%3E%3Crect x='25' y='19' width='6' height='6' transform='rotate(45 28 22)' fill='%2317130F'/%3E%3Crect x='-5' y='17' width='10' height='10' transform='rotate(45 0 22)' fill='%2317130F'/%3E%3Crect x='51' y='17' width='10' height='10' transform='rotate(45 56 22)' fill='%2317130F'/%3E%3Crect x='12' y='20' width='4' height='4' transform='rotate(45 14 22)' fill='%2317130F' fill-opacity='.6'/%3E%3Crect x='40' y='20' width='4' height='4' transform='rotate(45 42 22)' fill='%2317130F' fill-opacity='.6'/%3E%3C/svg%3E");
  --orn-v: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='44' height='56' viewBox='0 0 44 56'%3E%3Cpath d='M8 0 L2 7 L8 14 L2 21 L8 28 L2 35 L8 42 L2 49 L8 56' fill='none' stroke='%23C8102E' stroke-width='2'/%3E%3Cpath d='M36 0 L42 7 L36 14 L42 21 L36 28 L42 35 L36 42 L42 49 L36 56' fill='none' stroke='%23C8102E' stroke-width='2'/%3E%3Crect x='14' y='20' width='16' height='16' transform='rotate(45 22 28)' fill='%23C8102E'/%3E%3Crect x='19' y='25' width='6' height='6' transform='rotate(45 22 28)' fill='%2317130F'/%3E%3Crect x='17' y='-5' width='10' height='10' transform='rotate(45 22 0)' fill='%2317130F'/%3E%3Crect x='17' y='51' width='10' height='10' transform='rotate(45 22 56)' fill='%2317130F'/%3E%3Crect x='20' y='12' width='4' height='4' transform='rotate(45 22 14)' fill='%2317130F' fill-opacity='.6'/%3E%3Crect x='20' y='40' width='4' height='4' transform='rotate(45 22 42)' fill='%2317130F' fill-opacity='.6'/%3E%3C/svg%3E");

  background: var(--ink);
  color: var(--bone);
}

/* Header — светлое стекло */
header { background: rgba(251, 247, 239, 0.86); }
/* Выпадающее меню — светлый фон под тему рушника (все размеры) */
.head-nav { background: rgba(251, 247, 239, 0.98); }

/* Красные кнопки: текст остаётся костяным (не переворачивается в тёмный) */
.btn-red { color: #F7F2E8; }

/* Горизонтальный орнамент-рушник на белом (чорне осердя замість костяного) */
.ornament { background-image: var(--orn-h); }

/* Statement — красная лента остаётся; текст держим тёмным */
.statement { color: #17130F; }

/* Лёгкая тень у карточек, чтобы читались на светлом фоне */
.detail-card .tiltcard__in,
.cd-cell,
.steps li { box-shadow: 0 1px 0 rgba(23, 19, 16, 0.04); }

/* Вертикальний рушник — вишита лента-полотенце вздовж правого краю геро.
   Упирается точно в верхний край нижней ленты (.hero-ornament):
   hero padding-bottom 60 + высота ленты 46 = 106px от низа секции →
   чистый T-стык вместо наложения-креста. */
.rushnyk-v {
  position: absolute; top: 0; bottom: 106px; width: 42px;
  right: max(24px, calc((100% - 1100px) / 2));
  background: var(--orn-v) repeat-y center bottom / 42px auto;
  opacity: 0.9; pointer-events: none;
}
/* Горизонтальная лента рисуется поверх вертикали (перекрывает возможный шов) */
.galas-hero .hero-ornament { position: relative; z-index: 1; }
@media (max-width: 980px) { .rushnyk-v { display: none; } }

/* Хрестиковий куточок на карточках When/Where/Hours/On the porch */
.detail-card .tiltcard__in::after {
  content: ''; position: absolute; top: 12px; right: 12px; width: 24px; height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Crect x='7' y='7' width='10' height='10' transform='rotate(45 12 12)' fill='%23C8102E'/%3E%3Crect x='10' y='10' width='4' height='4' transform='rotate(45 12 12)' fill='%2317130F'/%3E%3Crect x='11' y='1' width='2' height='2' fill='%23C8102E'/%3E%3Crect x='11' y='21' width='2' height='2' fill='%23C8102E'/%3E%3Crect x='21' y='11' width='2' height='2' fill='%23C8102E'/%3E%3Crect x='1' y='11' width='2' height='2' fill='%23C8102E'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: 0.7; transition: opacity 0.3s, transform 0.3s var(--ease);
  pointer-events: none;
}
.detail-card:hover .tiltcard__in::after { opacity: 1; transform: rotate(90deg); }

/* Рушник-рамка вокруг финального CTA — «вишите запрошення» */
.galas-invite { position: relative; padding: 54px 44px; }
.galas-invite .galas-cta-inner { margin: 0 auto; }
.rframe { position: absolute; pointer-events: none; }
.rframe-t, .rframe-b { left: 6px; right: 6px; height: 20px; background: var(--orn-h) repeat-x center / auto 20px; }
.rframe-t { top: 0; }
.rframe-b { bottom: 0; transform: scaleY(-1); }
.rframe-l, .rframe-r { top: 6px; bottom: 6px; width: 20px; background: var(--orn-v) repeat-y center / 20px auto; }
.rframe-l { left: 0; }
.rframe-r { right: 0; }
@media (max-width: 560px) {
  .galas-invite { padding: 40px 26px; }
  .rframe-l, .rframe-r { display: none; }
}