/* ============================================================
   coolknjiga.blog — dizajn sustav (papir / tinta / terakota)
   ============================================================ */
:root{
  --ck-paper:#FBF8F3;
  --ck-ink:#14110F;
  --ck-ink-soft:#3A342E;
  --ck-accent:#A64B2A;
  --ck-accent-dark:#7E3218;
  --ck-sand:#F0E7D9;
  --ck-muted:#6F6257;
  --ck-line:#E4DACB;
  --ck-serif:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,Georgia,serif;
  --ck-sans:"Inter","Segoe UI",system-ui,-apple-system,"Helvetica Neue",Arial,sans-serif;
  --ck-wrap:1180px;
  --ck-radius:5px;
}

/* ---------- osnova ---------- */
body{
  background:var(--ck-paper);
  color:var(--ck-ink);
  font-family:var(--ck-sans);
  font-size:1.0625rem;
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
h1,h2,h3,h4,h5,h6{
  font-family:var(--ck-serif);
  font-weight:600;
  line-height:1.13;
  letter-spacing:-.018em;
  color:var(--ck-ink);
  margin:0 0 .6em;
}
h1{font-size:clamp(2.55rem,5.2vw,4.05rem);}
h2{font-size:clamp(1.95rem,3.5vw,2.85rem);}
h3{font-size:1.32rem;line-height:1.25;}
h4{font-size:1.06rem;letter-spacing:.06em;text-transform:uppercase;font-family:var(--ck-sans);font-weight:700;}
p{margin:0 0 1.1em;}
a{color:var(--ck-accent);text-decoration:none;}
a:hover{color:var(--ck-accent-dark);text-decoration:underline;text-underline-offset:3px;}
strong{font-weight:650;}
hr.wp-block-separator{border:0;border-top:1px solid var(--ck-line);opacity:1;margin:2.5rem 0;}

/* ---------- gumbi ---------- */
.wp-block-button__link{
  background:var(--ck-accent);
  color:#fff!important;
  border-radius:var(--ck-radius);
  font-family:var(--ck-sans);
  font-size:1.03rem;
  font-weight:650;
  letter-spacing:.01em;
  padding:1rem 2.1rem;
  box-shadow:0 1px 0 rgba(20,17,15,.08);
  transition:background .18s ease,transform .18s ease;
}
.wp-block-button__link:hover{
  background:var(--ck-ink);
  color:#fff!important;
  transform:translateY(-1px);
  text-decoration:none;
}

/* ---------- pomoćne klase ---------- */
.ck-eyebrow{
  font-size:.78rem!important;
  letter-spacing:.17em;
  text-transform:uppercase;
  font-weight:700!important;
  color:var(--ck-accent)!important;
  margin:0 0 .9rem;
}
.ck-lead{font-size:1.2rem!important;color:var(--ck-ink-soft);line-height:1.6;}
.ck-muted{color:var(--ck-muted)!important;}
.ck-small{font-size:.86rem!important;line-height:1.55;}
.ck-serif{font-family:var(--ck-serif);}

/* ---------- zaglavlje ---------- */
/* NAPOMENA: backdrop-filter NE SMIJE biti na .ck-header — stvara containing
   block i zarobi fiksni overlay mobilnog izbornika unutar trake zaglavlja.
   Zato je efekt na pseudo-elementu. */
.ck-header{
  border-bottom:1px solid var(--ck-line);
  background:transparent;
  position:sticky;top:0;z-index:600;
  padding:.95rem 0;
}
.ck-header::before{
  content:"";
  position:absolute;inset:0;
  background:rgba(251,248,243,.93);
  -webkit-backdrop-filter:saturate(180%) blur(8px);
  backdrop-filter:saturate(180%) blur(8px);
  z-index:-1;
  pointer-events:none;
}
.ck-header .wp-block-navigation a,
.ck-header .wp-block-navigation-item__content{
  font-size:.95rem;
  font-family:var(--ck-sans);
  font-weight:500;
  color:var(--ck-ink);
  letter-spacing:.01em;
}
.ck-header .wp-block-navigation a:hover{color:var(--ck-accent);}
.ck-brand a{color:var(--ck-ink)!important;font-family:var(--ck-serif);font-size:1.16rem;font-weight:600;letter-spacing:.01em;}
.ck-brand a:hover{text-decoration:none;}

/* ---------- hero ---------- */
.ck-hero{padding:clamp(2rem,4.5vw,3.4rem) 0 clamp(2.5rem,6vw,4.5rem);}
.ck-hero__cover img{
  width:100%;height:auto;display:block;
  border-radius:var(--ck-radius);
  box-shadow:0 30px 70px -30px rgba(20,17,15,.55),0 3px 10px rgba(20,17,15,.12);
}
.ck-hero__sub{font-size:1.28rem;line-height:1.5;color:var(--ck-ink-soft);font-family:var(--ck-serif);font-style:italic;margin-bottom:1.4rem;}
.ck-author{font-size:.95rem;letter-spacing:.05em;text-transform:uppercase;font-weight:600;color:var(--ck-muted);margin-bottom:1.6rem;}
.ck-hook{font-size:1.08rem;color:var(--ck-ink-soft);}
.ck-buy{display:flex;flex-direction:column;align-items:flex-start;gap:.9rem;margin:1.8rem 0 1.2rem;}
.ck-trust{font-size:.87rem;color:var(--ck-muted);line-height:1.6;}
.ck-meta{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:1.4rem 0 0;}
.ck-meta li{
  font-size:.79rem;letter-spacing:.06em;text-transform:uppercase;font-weight:600;
  color:var(--ck-muted);border:1px solid var(--ck-line);border-radius:999px;
  padding:.34rem .8rem;background:#fff;
}

/* ---------- traka s citatom ---------- */
.ck-quote-band{background:var(--ck-sand);padding:clamp(2.8rem,6vw,4.4rem) 0;}
.ck-quote-band .wp-block-quote{
  border-left:3px solid var(--ck-accent);
  padding-left:1.6rem;margin:0 0 1rem;
  font-family:var(--ck-serif);font-size:clamp(1.3rem,2.3vw,1.72rem);
  line-height:1.45;font-style:italic;color:var(--ck-ink);
}
.ck-quote-band cite{display:block;margin-top:1.1rem;font-family:var(--ck-sans);font-style:normal;font-size:.82rem;letter-spacing:.12em;text-transform:uppercase;font-weight:600;color:var(--ck-muted);}

/* ---------- kartice poglavlja ---------- */
.ck-section{padding:clamp(3rem,7vw,5rem) 0;}
.ck-card{
  background:#fff;
  border:1px solid var(--ck-line);
  border-radius:var(--ck-radius);
  padding:1.7rem 1.6rem 1.5rem;
  height:100%;
}
.ck-card h3{margin:.35rem 0 .5rem;font-size:1.18rem;}
.ck-card p{font-size:.95rem;color:var(--ck-muted);margin:0;line-height:1.6;}
.ck-card__num{
  font-family:var(--ck-serif);font-size:.9rem;font-weight:700;
  letter-spacing:.14em;color:var(--ck-accent);display:block;margin-bottom:.15rem;
}
.ck-card__era{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ck-muted);font-weight:600;}

/* ---------- tamna traka / koraci ---------- */
.ck-band-dark{background:var(--ck-ink);color:#EFE9E1;padding:clamp(3rem,6.5vw,4.6rem) 0;}
.ck-band-dark h2,.ck-band-dark h3{color:#fff;}
.ck-band-dark p{color:#CBBFB2;}
.ck-step{border-top:2px solid var(--ck-accent);padding-top:1.1rem;height:100%;}
.ck-step__num{font-family:var(--ck-serif);font-size:1.9rem;color:var(--ck-accent);display:block;line-height:1;margin-bottom:.7rem;}
.ck-step h3{font-size:1.1rem;margin-bottom:.45rem;}
.ck-step p{font-size:.94rem;margin:0;}

/* ---------- završni blok ---------- */
.ck-final{background:var(--ck-sand);border-radius:var(--ck-radius);padding:clamp(1.8rem,3.5vw,2.8rem);}
.ck-final h3{margin-bottom:.5rem;}

/* ---------- podnožje ---------- */
.ck-footer{background:var(--ck-ink);color:#B9AFA4;padding:clamp(2.6rem,5vw,3.8rem) 0 2rem;}
.ck-footer h3,.ck-footer h4{color:#fff;}
.ck-footer h4{font-size:.78rem;letter-spacing:.16em;margin-bottom:1rem;}
.ck-footer p{color:#B9AFA4;font-size:.9rem;}
.ck-footer ul{list-style:none;padding:0;margin:0;}
.ck-footer li{margin-bottom:.55rem;}
.ck-footer a{color:#D8CFC4;font-size:.92rem;}
.ck-footer a:hover{color:#fff;text-decoration:none;}
.ck-footer hr.wp-block-separator{border-top:1px solid #2C2723;margin:2.2rem 0 1.6rem;}

/* ---------- WooCommerce: proizvod ---------- */
.single-product .wp-block-post-title{font-size:clamp(2.2rem,4.4vw,3.4rem);}
.woocommerce-Price-amount,.wp-block-woocommerce-product-price .price{
  font-family:var(--ck-serif);font-size:1.9rem!important;color:var(--ck-ink)!important;font-weight:600;
}
.woocommerce-product-details__short-description{
  font-size:1.05rem;color:var(--ck-ink-soft);
  border-top:1px solid var(--ck-line);border-bottom:1px solid var(--ck-line);
  padding:1.1rem 0;margin:1.4rem 0;
}
.wp-block-woocommerce-add-to-cart-form .single_add_to_cart_button,
.wp-block-woocommerce-add-to-cart-form button[type="submit"]{
  background:var(--ck-accent)!important;color:#fff!important;border:0!important;
  border-radius:var(--ck-radius)!important;font-weight:650!important;
  padding:1rem 2.2rem!important;font-size:1.03rem!important;
}
.wp-block-woocommerce-add-to-cart-form .single_add_to_cart_button:hover{background:var(--ck-ink)!important;}
.wp-block-woocommerce-breadcrumbs{font-size:.82rem;color:var(--ck-muted);margin-bottom:1.6rem!important;}
.wp-block-woocommerce-breadcrumbs a{color:var(--ck-muted);}

/* ---------- WooCommerce: blagajna ---------- */
.wc-block-checkout{font-family:var(--ck-sans);}
.wc-block-components-button,
.wc-block-checkout__actions .wc-block-components-button{
  background:var(--ck-accent)!important;color:#fff!important;border-radius:var(--ck-radius)!important;
  font-weight:650!important;transition:background .18s ease;
}
.wc-block-components-button:hover{background:var(--ck-ink)!important;}
.wc-block-components-order-summary,.wc-block-components-sidebar{
  border:1px solid var(--ck-line);border-radius:var(--ck-radius);background:#fff;
}
.ck-checkout-note{
  max-width:46rem;margin:0 auto 2.2rem;padding:1rem 1.2rem;
  background:var(--ck-sand);border-radius:var(--ck-radius);
  font-size:.9rem;color:var(--ck-ink-soft);text-align:center;
}

/* ---------- varijanta: druga knjiga (teal) ---------- */
.ck-page--ai{
  --ck-accent:#14655C;
  --ck-accent-dark:#0C4A43;
  --ck-sand:#E7F0ED;
  --ck-line:#D5E5E1;
}

/* ---------- varijanta: treća knjiga (petrol plava) ---------- */
.ck-page--web{
  --ck-accent:#1F5F8B;
  --ck-accent-dark:#164763;
  --ck-sand:#E5EEF5;
  --ck-line:#D3E1EC;
}

/* ---------- podizbornik ---------- */
.wp-block-navigation__submenu-container{
  background:#fff;
  border:1px solid var(--ck-line);
  border-radius:6px;
  padding:.4rem;
  box-shadow:0 18px 40px -22px rgba(20,17,15,.4);
  min-width:215px;
  z-index:70;
}
.wp-block-navigation__submenu-container a,
.wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  padding:.55rem .8rem;
  border-radius:4px;
  font-size:.92rem;
  font-weight:500;
  color:var(--ck-ink);
}
.wp-block-navigation__submenu-container a:hover{
  background:var(--ck-sand);
  text-decoration:none;
}

/* ---------- unakrsna ponuda knjiga ---------- */
.ck-cross{
  display:flex;gap:1.4rem;align-items:center;
  border:1px solid var(--ck-line);border-radius:var(--ck-radius);
  padding:1.1rem 1.4rem;background:#fff;margin-top:2.6rem;
}
.ck-cross img{width:64px;height:auto;border-radius:3px;flex-shrink:0;}
.ck-cross p{margin:0;font-size:.92rem;color:var(--ck-muted);}
.ck-cross{margin-bottom:.85rem;}
.ck-cross strong{color:var(--ck-ink);font-size:1rem;}

/* ---------- MOBILNI IZBORNIK (overlay) ---------- */
.wp-block-navigation__responsive-container.is-menu-open{
  background:var(--ck-paper)!important;
  padding:0 1.25rem 2.5rem!important;
  z-index:100001;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close{
  position:sticky;top:0;z-index:2;
  display:flex;justify-content:flex-end;
  padding:.9rem 0 .4rem;
  background:var(--ck-paper);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog{
  margin:0;width:100%;max-width:none;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content{
  width:100%;max-width:none;padding-top:0;align-items:stretch;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive{
  width:100%;display:block;margin:0;gap:0;
  align-items:stretch;justify-content:flex-start;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive .wp-block-navigation-item{
  width:100%;
  border-bottom:1px solid var(--ck-line);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content{
  display:flex;align-items:center;justify-content:space-between;
  width:100%;padding:1rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__label{
  font-family:var(--ck-serif);
  font-size:1.42rem;
  font-weight:600;
  letter-spacing:-.012em;
  line-height:1.2;
  color:var(--ck-ink);
}
/* stavka s podizbornikom: naslov lijevo, strelica desno, podizbornik ispod */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive .wp-block-navigation-item.has-child{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive .wp-block-navigation-item.has-child .wp-block-navigation-item__content{
  flex:1 1 auto;
  width:auto;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive .wp-block-navigation__submenu-icon{
  flex:0 0 auto;
  margin-left:.4rem;
  padding:.4rem;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container.is-responsive .wp-block-navigation__submenu-container{
  flex:0 0 100%;
}
/* podizbornik: uvučen, bez okvira i sjene */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container{
  position:static;
  width:100%;min-width:0;
  background:transparent;
  border:0;box-shadow:none;
  padding:.15rem 0 .5rem 1.1rem!important;
  display:block;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item{
  border-bottom:0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  padding:.55rem 0;
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__label{
  font-family:var(--ck-sans);
  font-size:1.02rem;
  font-weight:500;
  color:var(--ck-ink-soft);
}
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__submenu-container .wp-block-navigation-item__label::before{
  content:"— ";
  color:var(--ck-accent);
  opacity:.65;
}
/* hamburger i X */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close{
  background:transparent!important;
  color:var(--ck-ink)!important;
  border:1px solid var(--ck-line)!important;
  border-radius:var(--ck-radius)!important;
  padding:.42rem!important;
  line-height:0!important;
  cursor:pointer;
}
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg{
  fill:currentColor;
  width:22px;height:22px;
}

/* ---------- strukturni hookovi (prije bili bez pravila) ---------- */
.ck-hero__img img{
  width:100%;height:auto;display:block;
  border-radius:var(--ck-radius);
  box-shadow:0 30px 70px -30px rgba(20,17,15,.55),0 3px 10px rgba(20,17,15,.12);
}
.ck-hero__body{min-width:0;}
.ck-quote-band__inner{max-width:52rem;margin:0 auto;}
.ck-section__head{max-width:44rem;margin-bottom:2.1rem;}
.ck-section--sand{background:var(--ck-sand);}

/* ---------- varijanta: newspapers (tamnocrvena / tinta) ---------- */
.ck-page--news{
  --ck-accent:#7C2D2D;
  --ck-accent-dark:#591D1D;
  --ck-sand:#F1E5E1;
  --ck-line:#E6D5D1;
}

/* sadržaj broja — numerirani popis s isprekidanim redovima */
.ck-issue{list-style:none!important;padding-left:0!important;margin:0;}
.ck-issue li{
  border-bottom:1px solid var(--ck-line);
  padding:.6rem 0;
  font-size:1rem;
  line-height:1.55;
  display:flex;
  gap:.8rem;
  align-items:baseline;
}
.ck-issue li:last-child{border-bottom:0;}
.ck-issue li::before{
  content:"·";
  color:var(--ck-accent);
  font-weight:700;
  flex:0 0 auto;
}
.ck-issue li strong{font-weight:650;}

/* ključni brojevi */
.ck-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.15rem 2rem;}
.ck-fact{border-top:2px solid var(--ck-accent);padding-top:.7rem;}
.ck-fact__num{
  font-family:var(--ck-serif);
  font-size:clamp(1.5rem,2.6vw,2rem);
  line-height:1.05;
  font-weight:600;
  color:var(--ck-ink);
  margin:0 0 .25rem;
  font-variant-numeric:tabular-nums;
}
.ck-fact__lab{font-size:.92rem;line-height:1.5;color:var(--ck-muted);margin:0;}

/* oznaka besplatnog izdanja */
.ck-free{
  display:inline-block;
  font-family:var(--ck-sans);
  font-size:.74rem;
  font-weight:700;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:#fff;
  background:var(--ck-accent);
  border-radius:3px;
  padding:.3rem .6rem;
  margin-bottom:.9rem;
}

/* ------- responzivno ------- */
@media (max-width:860px){
  .ck-facts{grid-template-columns:1fr;}
  .ck-issue li{font-size:.97rem;}
}

/* ---------- responzivno ---------- */
@media (max-width:860px){
  .ck-hero{padding-top:1.4rem;}
  .ck-hero__cover{max-width:340px;margin:0 auto 1.8rem;}
  h1{font-size:clamp(2.2rem,8vw,3rem);}
  .ck-header{padding:.7rem 0;}
  .ck-header__inner{flex-wrap:nowrap;gap:1rem;}
  .ck-brand a{font-size:1.06rem;}
  .ck-header .wp-block-navigation{margin-left:auto;}
  .ck-footer{padding-top:2.2rem;}
}