/* Концепт «День за кордоном»: вертикальна прокрутка рухає день убік; небо темнішає від ранку до вечора; на кожній картці — ситуація і фраза. */
.c-den { --ink: #10172a; --paper: #f6f1e7; background: var(--paper); color: var(--ink); }
.c-den { --lead-accent: #c01a1a; }
.dn-top { position: fixed; inset: 0 0 auto; z-index: 30; display: flex; align-items: center; justify-content: space-between; padding: 12px clamp(16px, 4vw, 48px); }
.dn-logo { display: flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 12px 0 6px; background: rgba(255, 255, 255, .85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border-radius: 999px; font-weight: 800; letter-spacing: -.02em; text-decoration: none; }
.dn-logo .rosette { width: 30px; height: 30px; }
.dn-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 56px; padding: 0 26px; border-radius: 999px; background: #c01a1a; color: #fff; font-weight: 700; text-decoration: none; transition: transform .25s var(--ease); }
.dn-btn:hover { transform: translateY(-2px); }
.dn-btn-sm { min-height: 44px; padding: 0 18px; font-size: .9375rem; }
.dn-btn-light { background: #fff; color: var(--ink); }
.dn-eyebrow { font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #5d667e; }

.dn-intro { min-height: 92svh; display: grid; align-content: center; gap: 20px; padding: 110px clamp(16px, 4vw, 48px) 40px; max-width: 1240px; margin: 0 auto; }
.dn-intro h1 { font-size: clamp(2.6rem, 1.1rem + 6vw, 7rem); font-weight: 800; letter-spacing: -.05em; line-height: .95; max-width: 14ch; }
.dn-intro h1 em { font-family: var(--serif); font-weight: 500; color: #c01a1a; letter-spacing: -.02em; }
.dn-sub { max-width: 34rem; font-size: 1.15rem; color: #39435e; }

/* день: липка сцена, доріжка карток їде вбік */
.dn-day { --sky: 0; height: calc(var(--n) * 70vh + 100vh); }
.dn-pin { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; align-content: center;
  background: linear-gradient(180deg, var(--sky-top, #f6e6c8), var(--sky-bot, #f6f1e7)); }
.dn-clock { position: absolute; left: clamp(16px, 4vw, 48px); right: clamp(16px, 4vw, 48px); top: 88px; height: 3px; background: rgba(16, 23, 42, .15); }
.dn-clock i { position: absolute; inset: 0; background: #c01a1a; transform-origin: left; transform: scaleX(0); }
.dn-sun { position: absolute; top: 50%; left: 0; width: 22px; height: 22px; border-radius: 50%; background: #f1b711; box-shadow: 0 0 0 6px rgba(241, 183, 17, .25); transform: translate(-50%, -50%); }
.dn-track { display: flex; gap: clamp(14px, 2vw, 28px); padding: 0 clamp(16px, 4vw, 48px); width: max-content; will-change: transform; }
.dn-card { position: relative; width: min(84vw, 420px); min-height: min(62svh, 520px); padding: 26px 24px; display: flex; flex-direction: column; justify-content: flex-end; gap: 10px; overflow: hidden; border-radius: 6px; background: var(--c); color: #fff; box-shadow: 0 30px 60px rgba(10, 16, 36, .22); }
.dn-card img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .38; mix-blend-mode: luminosity; }
.dn-card > *:not(img) { position: relative; }
.dn-time { position: absolute !important; top: 22px; left: 24px; font-size: clamp(2.6rem, 1.6rem + 3vw, 4.4rem); font-weight: 800; letter-spacing: -.05em; line-height: 1; }
.dn-card h2 { font-size: 1.6rem; font-weight: 800; letter-spacing: -.03em; line-height: 1.1; }
.dn-en { font-family: var(--serif); font-style: italic; font-size: clamp(1.3rem, 1.1rem + .8vw, 1.75rem); line-height: 1.2; }
.dn-ua { opacity: .92; }
.dn-last { background: #fff; color: var(--ink); justify-content: center; }
.dn-last .dn-time { color: #c01a1a; }
.dn-last .dn-btn { align-self: flex-start; margin-top: 10px; }

.dn-courses { max-width: 1240px; margin: 0 auto; padding: clamp(64px, 9vw, 128px) clamp(16px, 4vw, 48px); }
.dn-courses h2, .dn-final h2 { font-size: clamp(2rem, 1.2rem + 3vw, 3.8rem); font-weight: 800; letter-spacing: -.045em; line-height: 1; }
.dn-courses ul { margin-top: 32px; display: grid; gap: 14px; }
@media (min-width: 900px) { .dn-courses ul { grid-template-columns: repeat(4, 1fr); } }
.dn-courses a { display: grid; gap: 8px; height: 100%; padding: 22px 20px; background: #fff; border-top: 6px solid var(--c); border-radius: 4px; text-decoration: none; transition: transform .3s var(--ease); }
.dn-courses a:hover { transform: translateY(-4px); }
.dn-courses b { font-size: 1.3rem; letter-spacing: -.02em; line-height: 1.15; }
.dn-courses span { color: #39435e; font-size: .9375rem; }
.dn-final { padding: clamp(64px, 9vw, 128px) clamp(16px, 4vw, 48px); background: #0e1630; color: #fff; text-align: center; display: grid; justify-items: center; gap: 18px; }
.dn-final p { max-width: 36rem; color: #c3cbe0; font-size: 1.125rem; }
@media (prefers-reduced-motion: reduce) { .dn-day { height: auto; } .dn-pin { position: relative; height: auto; padding: 120px 0 60px; } .dn-track { width: auto; flex-wrap: wrap; } }