/* ============================================================
   Country knowledge pages (country/<slug>/) — goldentreeawards.com
   Scoped under .cp-* so nothing here can collide with styles.css.
   Layout: 90% container, 80/20 main + sticky sidebar on desktop,
   single column below 1000px.
   ============================================================ */

.cp-wrap { width: 90%; max-width: 1750px; margin: 0 auto; }

/* ---------- banner + title band ---------- */
.cp-banner { display: block; background: var(--navy); line-height: 0; }
.cp-banner img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 7; }
.cp-title { background: linear-gradient(180deg, #fff 0%, var(--bg-light) 100%); border-bottom: 1px solid var(--border); padding: 1.4rem 0 1.6rem; }
.cp-title h1 { color: var(--primary); font-size: clamp(1.5rem, 3vw, 2.7rem); line-height: 1.15; margin: .3rem 0 .6rem; text-wrap: balance; }
.cp-title > .cp-wrap > p { color: var(--text-body); line-height: 1.75; font-size: clamp(.92rem, 1.05vw, 1.06rem); text-align: justify; text-wrap: pretty; }
.cp-hero-cta { display: flex; gap: .7rem; flex-wrap: wrap; margin-top: 1.1rem; }
.cp-crumbs { font-size: 0.78rem; letter-spacing: .12em; text-transform: uppercase; color: var(--text-muted); margin-bottom: .5rem; }
.cp-crumbs a { color: var(--text-muted); text-decoration: none; }
.cp-crumbs a:hover { color: var(--gold-dark); }
.cp-crumbs span { margin: 0 .35rem; }

/* ---------- layout ---------- */
.cp-layout { display: grid; grid-template-columns: minmax(0, 80fr) minmax(280px, 20fr); gap: clamp(1.5rem, 3vw, 3rem); padding: 1.6rem 0 2rem; align-items: start; }
.cp-main { min-width: 0; }

/* ---------- sections ---------- */
.cp-section { margin: 0 0 1.75rem; }
.cp-section:last-child { margin-bottom: 0; }
.cp-section h2 { color: var(--primary); font-size: clamp(1.25rem, 1.9vw, 1.8rem); margin: 0 0 .6rem; line-height: 1.25; text-wrap: balance; }
.cp-section p { color: var(--text-body); line-height: 1.75; margin: 0 0 .75rem; text-align: justify; hyphens: auto; }
.cp-section > :last-child { margin-bottom: 0; }
.cp-section a { color: var(--gold-dark); font-weight: 600; }
.cp-intro p:first-of-type { font-size: 1.05rem; }
.cp-note, .cp-updated { font-size: .84rem; color: var(--text-muted); text-align: left; }
.cp-note-inline { font-size: 0.78rem; color: var(--text-muted); font-style: italic; }
.cp-list { list-style: none; padding: 0; margin: 0 0 1rem; }
.cp-list li { position: relative; padding: .4rem 0 .4rem 1.35rem; color: var(--text-body); line-height: 1.75; border-bottom: 1px solid var(--border); text-align: justify; }
.cp-list li:last-child { border-bottom: none; }
.cp-list li::before { content: ""; position: absolute; left: 0; top: 1.05em; width: 7px; height: 7px; border-radius: 50%; background: var(--gold); }

/* ---------- stat grid ---------- */
.cp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1px; background: var(--border); border: 1px solid var(--border); border-radius: 10px; overflow: hidden; margin: 0 0 .75rem; }
.cp-stat { background: #fff; padding: 1.1rem 1rem; display: flex; flex-direction: column; gap: .25rem; }
.cp-stat-num { font-family: var(--serif); font-size: clamp(1.4rem, 2.3vw, 2rem); font-weight: 700; color: var(--primary); font-variant-numeric: tabular-nums; line-height: 1; }
.cp-stat-label { font-size: 0.78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }

/* ---------- tables ---------- */
.cp-tablewrap { overflow-x: auto; border: 1px solid var(--border); border-radius: 10px; }
.cp-table { width: 100%; border-collapse: collapse; min-width: 420px; background: #fff; }
.cp-table th, .cp-table td { padding: .7rem .9rem; text-align: left; border-bottom: 1px solid var(--border); font-size: .9rem; }
.cp-table thead th { background: var(--bg-section); color: var(--primary); font-size: 0.78rem; letter-spacing: .09em; text-transform: uppercase; }
.cp-table tbody tr:last-child td { border-bottom: none; }
.cp-table .cp-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; width: 1%; }
.cp-table td.cp-num { padding-right: 1.4rem; }
.cp-table th.cp-num { padding-right: 1.4rem; }
.cp-mark { color: var(--gold-dark); font-weight: 700; margin-left: .15rem; }

/* ---------- nominee chips ---------- */
.cp-noms { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: .6rem; }
.cp-nom { background: #fff; border: 1px solid var(--border); border-radius: 8px; padding: .7rem .85rem; display: flex; flex-direction: column; gap: .15rem; }
.cp-nom strong { color: var(--primary); font-size: .98rem; line-height: 1.3; overflow-wrap: anywhere; }
.cp-nom-cat { font-size: .9rem; color: var(--text-body); line-height: 1.35; }
.cp-nom-year { font-size: .82rem; letter-spacing: .04em; text-transform: uppercase; color: var(--gold-dark); font-weight: 700; }

/* ---------- winner cards ---------- */
.cp-wins { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1rem; margin: 0 0 .9rem; }
.cp-win { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 1.1rem 1.2rem; display: flex; flex-direction: column; gap: .6rem; transition: border-color .25s, box-shadow .25s, transform .25s; }
.cp-win:hover { border-color: var(--gold); box-shadow: var(--shadow); transform: translateY(-3px); }
.cp-win-top { display: flex; gap: .8rem; align-items: flex-start; }
.cp-win-top > div { min-width: 0; }
.cp-win-mono { flex-shrink: 0; width: 42px; height: 42px; border-radius: 50%; background: linear-gradient(135deg, var(--primary), var(--navy)); color: var(--gold); font-family: var(--serif); font-size: 1.25rem; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.cp-win-cat { display: block; font-size: .8rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: .25rem; line-height: 1.3; }
.cp-win h3 { font-size: 1.08rem; color: var(--primary); line-height: 1.25; margin: 0 0 .35rem; overflow-wrap: anywhere; }
.cp-win-meta { list-style: none; display: flex; flex-wrap: wrap; gap: .25rem 1rem; padding: 0; margin: 0; font-size: .88rem; color: var(--text-body); }
.cp-win-meta li { display: inline-flex; gap: .3rem; align-items: baseline; }
.cp-win-meta li span { font-size: 0.78rem; letter-spacing: .05em; text-transform: uppercase; color: var(--gold-dark); font-weight: 700; }
.cp-win-desc { font-size: .92rem; line-height: 1.7; color: var(--text-body); text-align: justify; margin: 0; }
.cp-win-site { font-size: 0.78rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--primary); text-decoration: none; }
.cp-win-site:hover { color: var(--gold-dark); }
.cp-more { margin-top: .4rem; }

/* ---------- winners grouped by year ---------- */
.cp-year-group { margin-bottom: 1.6rem; }
.cp-year-head { display: flex; align-items: baseline; gap: .8rem; color: var(--primary); font-size: 1.05rem; margin: 0 0 .7rem; padding-bottom: .4rem; border-bottom: 2px solid var(--border); }
.cp-year-head span { font-size: 0.78rem; letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); font-weight: 400; }

/* ---------- FAQ ---------- */
.cp-faq { border: 1px solid var(--border); border-radius: 8px; background: #fff; margin-bottom: .55rem; }
.cp-faq summary { cursor: pointer; padding: .85rem 1rem; font-weight: 600; color: var(--primary); font-size: .95rem; list-style: none; display: flex; justify-content: space-between; gap: 1rem; align-items: center; }
.cp-faq summary::-webkit-details-marker { display: none; }
.cp-faq summary::after { content: "+"; color: var(--gold-dark); font-size: 1.3rem; line-height: 1; flex-shrink: 0; }
.cp-faq[open] summary::after { content: "−"; }
.cp-faq-a { padding: 0 1rem 1rem; }
.cp-faq-a p { font-size: .9rem; margin: 0; color: var(--text-body); line-height: 1.75; text-align: justify; }

/* ---------- sticky sidebar ---------- */
.cp-side { position: sticky; top: 96px; }
.cp-side-inner { background: linear-gradient(170deg, var(--navy) 0%, var(--primary) 100%); color: #fff; border-radius: 14px; padding: 1.5rem 1.35rem; text-align: center; box-shadow: var(--shadow-lg); }
.cp-side-inner img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 8px; margin: 0 0 1rem; }
.cp-side-inner .eyebrow { color: var(--gold); justify-content: center; }
.cp-side-inner h2 { color: #fff; font-size: 1.12rem; line-height: 1.3; margin: .3rem 0 .6rem; }
.cp-side-inner p { font-size: .85rem; line-height: 1.65; color: rgba(255,255,255,.82); margin-bottom: 1.1rem; }
.cp-side-cta { display: flex !important; width: 100%; justify-content: center; margin-bottom: .55rem; }
.cp-side-inner .btn-outline-gold { border-color: rgba(200,164,93,.6); }
.cp-side-facts { margin: 1.1rem 0 0; padding-top: 1rem; border-top: 1px solid rgba(255,255,255,.15); display: grid; gap: .5rem; text-align: left; }
.cp-side-facts div { display: flex; justify-content: space-between; gap: .8rem; align-items: baseline; }
.cp-side-facts dt { font-size: 0.78rem; color: rgba(255,255,255,.62); }
.cp-side-facts dd { margin: 0; font-size: .86rem; font-weight: 700; color: var(--gold-light); font-variant-numeric: tabular-nums; }

/* ---------- final CTA ---------- */
.cp-final { background: linear-gradient(120deg, var(--navy) 0%, var(--primary) 100%); color: #fff; padding: clamp(2.2rem, 4vw, 3.4rem) 0; }
.cp-final-inner { display: flex; gap: 1.6rem; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cp-final h2 { color: #fff; font-size: clamp(1.3rem, 2.2vw, 2rem); margin: .3rem 0 .5rem; max-width: 22ch; }
.cp-final p { color: rgba(255,255,255,.82); max-width: 58ch; line-height: 1.7; margin: 0; }
.cp-final .eyebrow { color: var(--gold); }
.cp-final-cta { display: flex; gap: .7rem; flex-wrap: wrap; }

/* ---------- responsive ---------- */
@media (max-width: 1000px) {
  .cp-layout { grid-template-columns: 1fr; }          /* 100% main, CTA in normal flow */
  .cp-side { position: static; }
  .cp-side-inner { max-width: 560px; margin: 0 auto; }
}
@media (max-width: 640px) {
  .cp-wrap { width: 92%; }
  .cp-stats { grid-template-columns: repeat(2, 1fr); }
  .cp-wins { grid-template-columns: 1fr; }
  .cp-noms { grid-template-columns: 1fr; }
  .cp-hero-cta .btn, .cp-final-cta .btn { width: 100%; justify-content: center; }
  .cp-win-desc, .cp-section p, .cp-list li, .cp-faq-a p, .cp-title > .cp-wrap > p { text-align: left; hyphens: manual; }
}

/* ---------- programme / industry cards ---------- */
.cp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.cp-card { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: .95rem 1.05rem; display: flex; flex-direction: column; gap: .3rem; transition: border-color .25s, box-shadow .25s; }
.cp-card:hover { border-color: var(--gold); box-shadow: var(--shadow-sm); }
.cp-card strong { color: var(--primary); font-size: .96rem; line-height: 1.3; }
.cp-card a { text-decoration: none; }
.cp-card-count { font-size: 0.78rem; color: var(--text-muted); letter-spacing: .04em; }
.cp-card-count b { color: var(--gold-dark); font-variant-numeric: tabular-nums; }

/* ---------- categories grouped by sector ---------- */
.cp-sectors { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.cp-sector { background: #fff; border: 1px solid var(--border); border-radius: 10px; padding: 1rem 1.1rem; }
.cp-sector h3 { color: var(--primary); font-size: .98rem; margin: 0 0 .55rem; display: flex; justify-content: space-between; gap: .6rem; align-items: baseline; }
.cp-sector h3 span { font-size: 0.78rem; color: var(--text-muted); letter-spacing: .06em; text-transform: uppercase; font-weight: 400; white-space: nowrap; }
.cp-chips { display: flex; flex-wrap: wrap; gap: .4rem; }
.cp-chip { font-size: .78rem; color: var(--text-body); background: var(--bg-section); border-radius: 999px; padding: .28rem .7rem; line-height: 1.3; }
.cp-chip-more { font-size: 0.78rem; color: var(--gold-dark); font-weight: 700; padding: .28rem .2rem; }

/* ---------- nominee card: programme line ---------- */
.cp-nom-prog { font-size: .86rem; color: var(--primary); font-weight: 600; }

/* ---------- legibility: shared footer labels sit under 12px in site.css ---------- */
.footer-brand small, .footer-winners-grid li strong { font-size: .78rem; }
