/* Картки, editorial-списки, лічильники, marquee партнерів, тілт/shine */

/* --- напрями: editorial нумерований список --- */
.directions-list{border-top:1px solid var(--line);}
.direction-row{
  border-bottom:1px solid var(--line);
  padding-block:28px;
  display:grid;grid-template-columns:70px 1fr 60px;align-items:center;gap:24px;
  cursor:pointer;position:relative;overflow:hidden;
}
.direction-row .num{font-family:var(--f-alt);font-size:15px;color:var(--ink-soft);}
.direction-row h3{
  font-size:clamp(24px,3.6vw,46px);transition:transform var(--dur-med) var(--ease-out), color var(--dur-fast);
}
.direction-row .d-icon{
  width:44px;height:44px;flex:none;opacity:.85;transition:transform var(--dur-med) var(--ease-out);
}
.direction-row .d-icon img{width:100%;height:100%;object-fit:contain;}
.direction-row .d-desc{
  grid-column:2/3;max-height:0;overflow:hidden;opacity:0;
  transition:max-height var(--dur-med) var(--ease-in-out), opacity var(--dur-med), margin var(--dur-med);
  font-size:16px;color:var(--ink-soft);max-width:60ch;
}
.direction-row .arrow{
  width:52px;height:52px;border-radius:50%;border:1.5px solid var(--line);
  display:inline-flex;align-items:center;justify-content:center;
  transition:background var(--dur-fast), transform var(--dur-fast), border-color var(--dur-fast);
}
.direction-row .arrow svg{width:18px;height:18px;transition:transform var(--dur-fast);}
.direction-row:hover, .direction-row.is-active{background:var(--paper-dim);}
.direction-row:hover h3, .direction-row.is-active h3{color:var(--signal);transform:translateX(10px);}
.direction-row:hover .d-icon, .direction-row.is-active .d-icon{transform:rotate(-8deg) scale(1.1);}
.direction-row:hover .arrow, .direction-row.is-active .arrow{background:var(--ink);border-color:var(--ink);}
.direction-row:hover .arrow svg, .direction-row.is-active .arrow svg{transform:rotate(45deg);filter:invert(1);}
.direction-row.is-active .d-desc{max-height:200px;opacity:1;margin-top:14px;}
.direction-row .d-cta{margin-top:14px;display:inline-block;}

/* --- факти: типографіка на пів екрана --- */
.facts-grid{display:grid;grid-template-columns:repeat(3,1fr);}
.fact-cell{
  padding:36px 20px;border:1px solid var(--line-dark);
  display:flex;flex-direction:column;justify-content:center;gap:10px;min-height:220px;
}
.fact-value{
  font-family:var(--f-display);font-weight:800;font-size:clamp(34px,4.6vw,72px);line-height:1;
  color:var(--paper);
}
.fact-value .accent{color:var(--signal);}
.fact-label{font-family:var(--f-text);font-size:13.5px;color:rgba(250,246,239,.65);max-width:32ch;}

/* --- горизонтальна стрічка новин/семінарів --- */
.ribbon-pin{position:relative;}
.ribbon-viewport{padding-inline:var(--gutter);max-width:100%;}
.ribbon-track{display:flex;gap:26px;will-change:transform;padding-block:6px;}
@media (min-width:900px){
  .ribbon-viewport{max-width:none;overflow:visible;}
}
@media (max-width:899px){
  /* на мобілці пін+GSAP вимкнено (js) — натомість звичайний горизонтальний свайп */
  .ribbon-viewport{overflow-x:auto;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity;}
  .ribbon-track{scroll-snap-type:x proximity;}
  .ribbon-card{scroll-snap-align:start;}
}
.ribbon-card{
  flex:none;width:min(78vw,400px);border-radius:var(--radius-md);overflow:hidden;
  background:#fff;border:1px solid var(--line);position:relative;
  transition:transform var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast);
}
.ribbon-card:hover{transform:translateY(-8px);box-shadow:0 30px 60px -24px rgba(20,20,20,.25);}
.ribbon-card .thumb{aspect-ratio:4/3;overflow:hidden;background:var(--line);position:relative;}
.ribbon-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease-out);}
.ribbon-card:hover .thumb img{transform:scale(1.08);}
.ribbon-card .thumb .no-photo{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-family:var(--f-display);font-weight:700;color:var(--ink-soft);background:var(--paper-dim);text-align:center;padding:20px;font-size:14px;
}
.ribbon-card .body{padding:22px;}
.ribbon-card .date{font-family:var(--f-alt);font-size:12px;color:var(--signal);font-weight:600;text-transform:uppercase;letter-spacing:.06em;}
.ribbon-card h4{font-size:19px;line-height:1.3;margin-top:10px;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.ribbon-card .kind{position:absolute;top:14px;left:14px;z-index:2;}

/* --- shine hover для будь-якої картки --- */
.shine{position:relative;isolation:isolate;}
.shine::before{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;
  background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.55) 48%,transparent 62%);
  transform:translateX(-120%);
}
.shine:hover::before{transition:transform .8s var(--ease-out);transform:translateX(120%);}

/* --- партнери --- */
.partners-marquee{overflow:hidden;padding-block:20px;border-block:1px solid var(--line);}
.partners-track{display:flex;gap:56px;align-items:center;will-change:transform;}
.partners-track img{height:38px;width:auto;object-fit:contain;filter:grayscale(1);opacity:.65;transition:opacity .3s,filter .3s;}
.partners-track img:hover{filter:grayscale(0);opacity:1;}

/* --- акордеон FAQ --- */
.faq-list{border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-q{
  width:100%;display:flex;align-items:center;gap:24px;padding:28px 4px;text-align:left;
}
.faq-num{font-family:var(--f-display);font-size:clamp(22px,3vw,40px);color:var(--line);flex:none;width:64px;transition:color var(--dur-fast);}
.faq-item.is-open .faq-num{color:var(--signal);}
.faq-q h3{font-size:clamp(17px,2vw,24px);flex:1;font-family:var(--f-text);font-weight:700;}
.faq-plus{
  width:34px;height:34px;border-radius:50%;border:1.5px solid var(--line);flex:none;
  display:flex;align-items:center;justify-content:center;position:relative;transition:transform var(--dur-fast) var(--ease-out), background var(--dur-fast);
}
.faq-plus::before,.faq-plus::after{content:"";position:absolute;background:var(--ink);transition:opacity var(--dur-fast);}
.faq-plus::before{width:14px;height:2px;}
.faq-plus::after{width:2px;height:14px;}
.faq-item.is-open .faq-plus{transform:rotate(135deg);background:var(--signal);}
.faq-item.is-open .faq-plus::before,.faq-item.is-open .faq-plus::after{background:#fff;}
.faq-a{max-height:0;overflow:hidden;transition:max-height var(--dur-med) var(--ease-in-out);}
.faq-a-inner{padding:0 4px 30px 88px;color:var(--ink-soft);max-width:64ch;font-size:16px;}
.faq-item.is-open .faq-a{max-height:400px;}

/* --- таби --- */
.tabs-head{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px;}
.tab-btn{
  padding:12px 22px;border-radius:100px;border:1.5px solid var(--line);font-family:var(--f-alt);font-weight:600;font-size:14px;
  transition:background var(--dur-fast),color var(--dur-fast),border-color var(--dur-fast);
}
.tab-btn.is-active{background:var(--ink);color:var(--paper);border-color:var(--ink);}
.tab-btn:not(.is-active):hover{border-color:var(--ink);}

/* --- галерея / lightbox тригер --- */
.gallery-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;}
.gallery-grid button{
  aspect-ratio:1;overflow:hidden;border-radius:var(--radius-sm);position:relative;
}
.gallery-grid img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease-out);}
.gallery-grid button:hover img{transform:scale(1.1);}
.gallery-grid button::after{
  content:"+";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:32px;background:rgba(14,26,43,0);transition:background var(--dur-fast);
}
.gallery-grid button:hover::after{background:rgba(14,26,43,.35);}

@media (max-width:900px){
  /* НЕ 2 колонки: 9 фактів / 2 лишає неповний останній рядок (діра). 9 ділиться
     на 3 і на 1, тож тримаємо 3 колонки аж до 640px, де переходимо одразу на 1. */
  .gallery-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:640px){
  .direction-row{grid-template-columns:40px 1fr 46px;gap:14px;}
  .facts-grid{grid-template-columns:1fr;}
}
