/* ============ O NAMA — Naša priča ============ */
/* Reuse app.css tokens/components; only page-specific additions below. */

/* Hero: potpisni redak "pismo roditeljima" */
.onama-sign{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:1.15rem;
  color:var(--muted);margin:-.6rem 0 2rem;line-height:1.4}
.onama-sign strong{font-style:normal;font-weight:600;color:var(--aqua)}
.onama-hero-media .hero-frame{animation-duration:19s}

/* ============ TIMELINE — naša priča (signature #1) ============ */
.onama-timeline{list-style:none;margin:3rem 0 0;padding:0;position:relative;
  display:grid;gap:1.4rem}
.onama-timeline::before{content:"";position:absolute;left:15px;top:8px;bottom:8px;width:2px;
  background:linear-gradient(180deg,var(--aqua-bright),color-mix(in srgb,var(--gold) 60%,transparent));
  opacity:.55;border-radius:2px}
.onama-tl-item{position:relative;padding-left:3.4rem}
.onama-tl-dot{position:absolute;left:6px;top:6px;width:20px;height:20px;border-radius:50%;
  background:var(--card);border:2px solid var(--aqua);box-shadow:0 0 0 5px color-mix(in srgb,var(--aqua) 14%,transparent)}
.onama-tl-dot::after{content:"";position:absolute;inset:4px;border-radius:50%;background:var(--aqua);
  animation:onama-tl-pulse 3.4s var(--ease) infinite}
.onama-tl-card{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:1.5rem 1.7rem;box-shadow:var(--shadow-sm);transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.onama-tl-item:hover .onama-tl-card{transform:translateX(6px);box-shadow:var(--shadow)}
.onama-tl-tag{display:inline-block;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);margin-bottom:.5rem}
.onama-tl-card h3{font-size:var(--fs-h3);margin-bottom:.4rem}
.onama-tl-card p{font-size:.96rem;color:var(--muted);max-width:60ch}
@keyframes onama-tl-pulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.35);opacity:.55}}

/* ============ TIM — polaroid kartice (signature #2) ============ */
.onama-team{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem;margin-top:3rem;
  justify-items:center;padding-top:.6rem}
.onama-polaroid{margin:0;background:var(--surface);border:1px solid var(--line);
  padding:.8rem .8rem .3rem;border-radius:8px;box-shadow:var(--shadow);width:100%;max-width:300px;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
:root[data-theme="dark"] .onama-polaroid,
.onama-polaroid{background:color-mix(in srgb,var(--surface) 92%,#fff)}
@media (prefers-color-scheme:dark){.onama-polaroid{background:var(--card)}}
:root[data-theme="dark"] .onama-polaroid{background:var(--card)}
.onama-team .onama-polaroid:nth-child(1){transform:rotate(-3deg)}
.onama-team .onama-polaroid:nth-child(2){transform:rotate(1.5deg) translateY(-10px)}
.onama-team .onama-polaroid:nth-child(3){transform:rotate(3deg)}
.onama-team .onama-polaroid:hover{transform:rotate(0) translateY(-6px) scale(1.02);box-shadow:0 30px 60px -26px rgba(46,74,67,.5);z-index:2}
.onama-photo{border-radius:4px;overflow:hidden;aspect-ratio:1/1;background:var(--mist)}
.onama-photo img{width:100%;height:100%;object-fit:cover;filter:saturate(1.02);
  transition:transform .6s var(--ease)}
.onama-polaroid:hover .onama-photo img{transform:scale(1.05)}
.onama-polaroid figcaption{padding:.9rem .3rem .6rem;text-align:center}
.onama-name{font-family:'Fraunces',Georgia,serif;font-weight:600;font-size:1.16rem;color:var(--fg);display:block}
.onama-role{display:block;margin-top:.15rem;font-size:.82rem;font-weight:600;letter-spacing:.03em;color:var(--aqua)}

/* ============ ČEK-LISTA standardi ============ */
.onama-checklist{list-style:none;margin:3rem auto 0;padding:0;max-width:900px;
  display:grid;grid-template-columns:1fr 1fr;gap:1.1rem}
.onama-check{display:flex;gap:1rem;align-items:flex-start;background:var(--card);
  border:1px solid var(--line);border-radius:var(--r-md);padding:1.4rem 1.5rem;box-shadow:var(--shadow-sm);
  transition:transform .35s var(--ease),border-color .35s var(--ease)}
.onama-check:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--aqua) 45%,transparent)}
.onama-check-ico{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;
  background:color-mix(in srgb,var(--aqua) 14%,transparent);color:var(--aqua)}
.onama-check-ico svg{width:22px;height:22px;stroke-dasharray:36;stroke-dashoffset:36;
  transition:stroke-dashoffset .8s var(--ease) .15s}
.onama-check.is-in .onama-check-ico svg{stroke-dashoffset:0}
.onama-check h3{font-size:1.1rem;margin-bottom:.3rem}
.onama-check p{font-size:.92rem;color:var(--muted)}

/* ============ OPREMA ============ */
.onama-equip{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-top:3rem}
.onama-eq{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;
  transition:transform .4s var(--ease),box-shadow .4s var(--ease)}
.onama-eq:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.onama-eq-img{aspect-ratio:16/10;overflow:hidden}
.onama-eq-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.onama-eq:hover .onama-eq-img img{transform:scale(1.05)}
.onama-eq-body{padding:1.5rem 1.6rem 1.8rem}
.onama-eq-body h3{font-size:var(--fs-h3);margin-bottom:.5rem}
.onama-eq-body p{font-size:.95rem;color:var(--muted)}

/* ============ CTA citat (moto) ============ */
.onama-quote{position:relative;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r-lg);padding:2.4rem 2rem;text-align:center;backdrop-filter:blur(2px)}
.onama-quote-mark{width:44px;height:44px;color:var(--aqua-bright);opacity:.85;margin-bottom:.4rem}
.onama-quote p{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400;
  font-size:clamp(1.5rem,3vw,2.2rem);line-height:1.2;color:#fff}
.onama-quote-by{display:block;margin-top:1rem;font-size:.85rem;color:#cfe3d7}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .onama-team{grid-template-columns:1fr 1fr}
  .onama-team .onama-polaroid:nth-child(3){grid-column:1 / -1;justify-self:center;max-width:300px}
  .onama-equip{grid-template-columns:1fr}
}
@media (max-width:760px){
  .onama-checklist{grid-template-columns:1fr}
}
@media (max-width:640px){
  .onama-team{grid-template-columns:1fr;max-width:320px;margin-inline:auto}
  .onama-team .onama-polaroid:nth-child(1),
  .onama-team .onama-polaroid:nth-child(2),
  .onama-team .onama-polaroid:nth-child(3){transform:rotate(-2deg) translateY(0)}
  .onama-team .onama-polaroid:nth-child(2){transform:rotate(2deg)}
}

@media (prefers-reduced-motion:reduce){
  .onama-tl-dot::after{animation:none}
  .onama-team .onama-polaroid,
  .onama-team .onama-polaroid:nth-child(1),
  .onama-team .onama-polaroid:nth-child(2),
  .onama-team .onama-polaroid:nth-child(3){transform:none}
  .onama-tl-item:hover .onama-tl-card,
  .onama-check:hover,.onama-eq:hover,
  .onama-team .onama-polaroid:hover{transform:none}
}
