/*
Theme Name:  u hladu (GeneratePress Child)
Theme URI:   https://uhladu.com
Description: Child tema za uhladu.com — zelena prirodna paleta, editorial tipografija. Bazirano na mockup dizajn sistemu (jun–avg 2026).
Author:      Jonas
Template:    generatepress
Version:     1.0.0
Text Domain: uhladu
*/

/* =========================================================
   1. DIZAJN TOKENI — cela paleta na jednom mestu
   ========================================================= */
:root{
  /* zelena prirodna paleta */
  --forest:#2E4034;
  --forest-deep:#1C2720;
  --moss:#4C6043;
  --sage:#8A9A78;
  --sage-soft:#B6C2A4;
  --honey:#C49A5A;
  --honey-light:#E2C690;
  --honey-deep:#98742F;
  --paper:#F4F1E6;
  --cream:#FBF8EF;
  --ink:#262C20;
  --stone:#8A8270;
  --line:#E6E0CC;

  /* tipografija */
  --f-display:'Italiana',serif;
  --f-edit:'Cormorant Garamond',serif;
  --f-ui:'Inter',sans-serif;
  --f-mono:'DM Mono',monospace;
}

/* =========================================================
   2. GLOBALNO
   ========================================================= */
body{
  background:var(--cream);
  color:var(--ink);
  font-family:var(--f-ui);
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{color:var(--moss)}
a:hover{color:var(--forest)}

h1,h2,h3,.entry-title,.site-title{
  font-family:var(--f-display);
  font-weight:400;
  color:var(--forest);
  line-height:1.1;
}
h4,h5,h6{font-family:var(--f-ui);font-weight:600;color:var(--forest-deep)}

.eyebrow{
  font-family:var(--f-mono);font-size:11.5px;letter-spacing:.24em;
  text-transform:uppercase;color:var(--honey-deep);
}

/* =========================================================
   3. HEADER / NAVIGACIJA (GeneratePress elementi)
   ========================================================= */
.site-header{background:rgba(251,248,239,.93);border-bottom:1px solid var(--line)}
.site-title a{font-family:var(--f-display);font-size:30px;color:var(--forest)!important;text-transform:lowercase}
.main-navigation a{font-size:13.5px;font-weight:500;color:var(--ink)}
.main-navigation .current-menu-item > a,
.main-navigation a:hover{color:var(--moss)}

/* =========================================================
   4. DUGMAD
   ========================================================= */
.button,button,input[type=submit],.wp-block-button__link{
  font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  background:var(--moss);color:var(--cream);
  padding:13px 24px;border-radius:32px;border:0;transition:.2s;
}
.button:hover,button:hover,input[type=submit]:hover,.wp-block-button__link:hover{
  background:var(--forest);color:var(--cream);
}
.button.btn-honey,.wp-block-button.is-style-honey .wp-block-button__link{
  background:var(--honey);color:var(--forest-deep);
}

/* =========================================================
   5. ČLANAK (single post) — editorial stilovi iz šablona
   ========================================================= */
.single .entry-title{font-size:clamp(34px,5.5vw,56px)}
.single .entry-content p{font-size:18px;line-height:1.78;color:#33372b}

/* dek (podnaslov) — dodeli klasu prvom pasusu po želji */
.single .dek{
  font-family:var(--f-edit);font-style:italic;
  font-size:clamp(19px,2.6vw,24px);color:var(--ink);
}

/* lead pasus */
.single .entry-content > p:first-of-type{
  font-family:var(--f-edit);font-style:italic;
  font-size:22px;color:var(--forest);line-height:1.5;
}

/* dropcap — dodaj klasu .dropcap pasusu */
.entry-content .dropcap::first-letter{
  font-family:var(--f-display);font-size:64px;float:left;
  line-height:.78;padding:8px 12px 0 0;color:var(--moss);
}

/* pull-quote */
.entry-content blockquote{
  border-left:3px solid var(--honey);padding:6px 0 6px 22px;margin:28px 0;
  font-family:var(--f-edit);font-style:italic;font-size:22px;
  color:var(--moss);line-height:1.5;background:none;
}

/* praktični okvir — <div class="practical"> ... */
.practical{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:6px 26px;margin:30px 0}
.practical .it{display:flex;gap:16px;padding:15px 0;border-bottom:1px solid var(--line)}
.practical .it:last-child{border-bottom:0}
.practical .k{font-family:var(--f-mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--honey-deep);min-width:120px;padding-top:2px}
.practical .v{font-size:15.5px;color:#3b4031}

/* FAQ blok — <div class="faq"><div class="q"><b>Pitanje</b><p>Odgovor</p></div></div> */
.faq .q{border-top:1px solid var(--line);padding:15px 0}
.faq .q b{display:block;font-size:16px;color:var(--forest-deep);margin-bottom:4px}
.faq .q p{font-size:15px;margin:0;color:#43483a}

/* autor box */
.author-box{display:flex;gap:16px;align-items:flex-start;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:22px 24px;margin:34px 0}
.author-box .av{width:52px;height:52px;border-radius:50%;background:linear-gradient(140deg,var(--honey-light),var(--moss));flex:none}
.author-box .n{font-family:var(--f-display);font-size:19px;color:var(--forest-deep)}
.author-box p{font-size:13.5px;color:#54594a;margin:4px 0 0;line-height:1.55}

/* trust strip (money stranice) */
.trust{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}
.trust .b{display:flex;align-items:center;gap:7px;font-family:var(--f-mono);font-size:11px;color:var(--forest);background:#E9F0E9;border:1px solid #CFE0D0;padding:7px 12px;border-radius:30px}
.trust .b .c{color:#3E6B4F;font-weight:700}

/* kvaka (pošteno upozorenje) */
.kvaka{font-size:14px;color:#6e5b1f;background:#FBF4E4;border-left:3px solid var(--honey);border-radius:0 8px 8px 0;padding:9px 14px;margin:12px 0}

/* affiliate disclosure */
.disclosure{font-family:var(--f-mono);font-size:11.5px;color:var(--stone);background:var(--paper);border-radius:10px;padding:14px 18px;margin:24px 0;line-height:1.6}

/* =========================================================
   6. KARTICE (mesta / povezano / sezona)
   ========================================================= */
.place-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.place-card{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;transition:.25s}
.place-card:hover{transform:translateY(-4px);box-shadow:0 18px 42px -26px rgba(28,39,32,.5)}
.place-card .ph{height:170px;position:relative;overflow:hidden;background:linear-gradient(140deg,var(--sage),var(--forest))}
.place-card .ph img{width:100%;height:100%;object-fit:cover}
.place-card .kind{position:absolute;left:14px;top:14px;z-index:2;font-family:var(--f-mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;background:rgba(251,248,239,.92);color:var(--forest);padding:3px 9px;border-radius:20px}
.place-card .b{padding:18px 20px}
.place-card h3,.place-card h4{font-family:var(--f-display);font-size:22px;color:var(--forest-deep);margin:0 0 6px}
.place-card p{font-size:14px;color:#54594a;line-height:1.55;margin:0}
.place-card .meta{font-family:var(--f-mono);font-size:11px;color:var(--stone);margin-top:12px}

/* =========================================================
   7. SEZONSKI TABOVI (arhive /sezona/...)
   ========================================================= */
.sezona-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 26px}
.sezona-tabs a{
  font-family:var(--f-mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  padding:11px 22px;border-radius:30px;border:1px solid var(--line);
  color:var(--ink);background:#fff;transition:.18s;text-decoration:none;
}
.sezona-tabs a:hover{border-color:var(--sage);color:var(--moss)}
.sezona-tabs a.on{background:var(--moss);color:var(--cream);border-color:var(--moss)}

/* body klasa sezona-{leto...} se dodaje iz functions.php — može da tonira sitnice */
.sezona-jesen .eyebrow{color:#9A6B1F}

/* =========================================================
   8. FOOTER
   ========================================================= */
.site-footer{background:var(--forest-deep);color:var(--paper)}
.site-footer a{color:#C8C9B6}
.site-footer a:hover{color:var(--honey-light)}

/* =========================================================
   9. RESPONSIVE
   ========================================================= */
@media(max-width:900px){ .place-grid{grid-template-columns:1fr 1fr} }
@media(max-width:560px){ .place-grid{grid-template-columns:1fr} }
