@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700;12..96,800&family=Instrument+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

/* =========================================================
   CraftKiln — warm artisan-editorial theme
   Palette: cream paper · fired terracotta · espresso · sage · ochre
   ========================================================= */
:root{
  --bg:#FAF5EC; --surface:#FFFFFF; --surface-2:#F4EAD9; --surface-3:#EFE3CE;
  --ink:#2B2320; --ink-soft:#4B4039; --muted:#8C7C6A;
  --line:#E7DBC5; --line-2:#DECFB4;
  --clay:#C2562F; --clay-dk:#9E4324; --clay-soft:#F0D9CC;
  --sage:#5E6E45; --sage-soft:#E4E7D6;
  --ochre:#D8962C; --star:#D8962C;
  --r:14px; --r-lg:22px; --r-pill:999px;
  --sh-sm:0 2px 8px rgba(74,58,44,.06);
  --sh:0 12px 30px rgba(74,58,44,.10);
  --sh-lg:0 26px 60px rgba(74,58,44,.16);
  --head:'Bricolage Grotesque',ui-sans-serif,system-ui,sans-serif;
  --body:'Instrument Sans',ui-sans-serif,system-ui,sans-serif;
  --wrap:1180px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0;background-color:var(--bg);color:var(--ink);
  font-family:var(--body);line-height:1.65;font-size:16px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='200' height='200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.035'/%3E%3C/svg%3E");
}
img{max-width:100%;height:auto;display:block}
a{color:var(--clay);text-decoration:none}
h1,h2,h3,h4{font-family:var(--head);color:var(--ink);line-height:1.12;margin:0;font-weight:600}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.ck-kicker{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--body);font-weight:700;
  text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:var(--clay)}
.ck-kicker::before{content:"";width:26px;height:2px;background:var(--clay);border-radius:2px}
.ck-sec-head{max-width:640px;margin:0 auto 2.4rem;text-align:center}
.ck-sec-head h2{font-size:clamp(1.8rem,3.6vw,2.7rem);margin:.6rem 0 .5rem;letter-spacing:-.01em}
.ck-sec-head p{color:var(--muted);margin:0;font-size:1.05rem}

/* ---------- Buttons ---------- */
.ck-btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--body);font-weight:600;font-size:.95rem;cursor:pointer;border:none;
  padding:.85rem 1.6rem;border-radius:var(--r-pill);transition:transform .18s ease,box-shadow .18s ease,background .18s}
.ck-btn--primary{background:var(--clay);color:#fff;box-shadow:0 8px 18px rgba(194,86,47,.28)}
.ck-btn--primary:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(194,86,47,.36);background:var(--clay-dk)}
.ck-btn--ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line-2)}
.ck-btn--ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.ck-btn--block{width:100%}

/* ---------- Header ---------- */
.ck-hd{position:sticky;top:0;z-index:100;background:rgba(250,245,236,.85);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ck-hd__in{max-width:var(--wrap);margin:0 auto;display:flex;align-items:center;gap:1.5rem;
  padding:.7rem 24px}
.ck-brand{display:flex;align-items:center;gap:.65rem;color:var(--ink)}
.ck-brand__mark{width:38px;height:38px;flex:none;border-radius:11px;
  background:linear-gradient(150deg,var(--clay),var(--ochre));display:grid;place-items:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.25),0 4px 10px rgba(194,86,47,.3)}
.ck-brand__mark svg{width:20px;height:20px;fill:#fff}
.ck-brand__logo{width:40px;height:40px;flex:none;border-radius:11px;object-fit:cover;box-shadow:0 3px 8px rgba(74,58,44,.18)}
.ck-brand__txt{display:flex;flex-direction:column;line-height:1}
.ck-brand__wm{font-family:var(--head);font-weight:700;font-size:1.4rem;letter-spacing:-.01em}
.ck-brand__wm b{color:var(--clay);font-weight:700}
.ck-brand__tag{font-size:.62rem;text-transform:uppercase;letter-spacing:.22em;color:var(--muted);font-weight:600;margin-top:2px}
.ck-nav{display:flex;align-items:center;gap:.35rem;margin-left:auto}
.ck-nav__a{color:var(--ink-soft);font-weight:500;font-size:.93rem;padding:.5rem .7rem;border-radius:9px;transition:background .15s,color .15s}
.ck-nav__a:hover{background:var(--surface-2);color:var(--clay)}
.ck-nav__cta{margin-left:.5rem;background:var(--ink);color:#fff;font-weight:600;font-size:.9rem;
  padding:.6rem 1.1rem;border-radius:var(--r-pill);transition:background .18s,transform .18s}
.ck-nav__cta:hover{background:var(--clay);transform:translateY(-1px)}
.ck-navtog{display:none}
.ck-burger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:6px;margin-left:auto}
.ck-burger span{width:26px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}
@media(max-width:900px){
  .ck-nav{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--surface);border-bottom:1px solid var(--line);padding:.6rem 24px 1.2rem;
    transform:translateY(-120%);transition:transform .3s ease;box-shadow:var(--sh);margin-left:0}
  .ck-navtog:checked~.ck-nav{transform:translateY(0)}
  .ck-nav__a,.ck-nav__cta{padding:.85rem .4rem;border-radius:0;text-align:left}
  .ck-nav__cta{margin:.6rem 0 0;text-align:center}
  .ck-burger{display:flex}
  .ck-navtog:checked~.ck-burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .ck-navtog:checked~.ck-burger span:nth-child(2){opacity:0}
  .ck-navtog:checked~.ck-burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}

/* ---------- Hero ---------- */
.ck-hero{position:relative;overflow:hidden;background:
  radial-gradient(1100px 500px at 88% -12%,var(--clay-soft),transparent 60%),
  radial-gradient(800px 460px at -8% 120%,var(--sage-soft),transparent 60%)}
.ck-hero__in{max-width:var(--wrap);margin:0 auto;padding:4.2rem 24px 3.6rem;
  display:grid;grid-template-columns:1.1fr .9fr;gap:3rem;align-items:center}
.ck-hero__h1{font-size:clamp(2.4rem,5.4vw,4.1rem);letter-spacing:-.02em;margin:1rem 0 1.1rem;font-weight:600}
.ck-hero__h1 em{font-style:italic;color:var(--clay);font-weight:500}
.ck-hero__sub{font-size:1.16rem;color:var(--ink-soft);max-width:46ch;margin:0 0 1.8rem}
.ck-hero__cta{display:flex;gap:.9rem;flex-wrap:wrap}
.ck-hero__trust{display:flex;gap:1.8rem;margin-top:2.2rem;padding-top:1.6rem;border-top:1px dashed var(--line-2);flex-wrap:wrap}
.ck-hero__trust b{font-family:var(--head);font-size:1.5rem;color:var(--ink);display:block;line-height:1}
.ck-hero__trust span{font-size:.78rem;color:var(--muted);text-transform:uppercase;letter-spacing:.08em}
.ck-hero__art{position:relative;aspect-ratio:1/1;max-width:440px;margin-left:auto}
.ck-hero__frame{position:absolute;inset:0;border-radius:32px;overflow:hidden;
  box-shadow:var(--sh-lg);border:6px solid #fff;transform:rotate(2.2deg)}
.ck-hero__frame img{width:100%;height:100%;object-fit:cover}
.ck-stamp{position:absolute;bottom:-14px;left:-14px;z-index:3;background:var(--ink);color:#fff;
  width:118px;height:118px;border-radius:50%;display:grid;place-items:center;text-align:center;
  font-family:var(--head);font-weight:600;font-size:.82rem;line-height:1.2;padding:12px;
  box-shadow:var(--sh);border:2px dashed rgba(255,255,255,.5);transform:rotate(-9deg)}
.ck-stamp b{color:var(--ochre);font-size:1.5rem;display:block}
@media(max-width:860px){
  .ck-hero__in{grid-template-columns:1fr;gap:2.4rem;padding:2.8rem 24px}
  .ck-hero__art{max-width:340px;margin:0 auto}
}

/* ---------- Marquee brand strip ---------- */
.ck-marq{background:var(--ink);color:#fff;padding:.9rem 0;overflow:hidden;white-space:nowrap;display:flex;align-items:center}
.ck-marq__label{flex:none;color:var(--ochre);font-size:.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.2em;padding:0 1.4rem}
.ck-marq__mask{overflow:hidden;flex:1;min-width:0}
.ck-marq__track{display:inline-flex;gap:2.4rem;animation:ck-marq 140s linear infinite;will-change:transform}
.ck-marq__track span{font-family:var(--head);font-size:1.05rem;color:rgba(255,255,255,.72);font-weight:500}
@keyframes ck-marq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.ck-marq__track{animation:none}}

/* ---------- Section shell ---------- */
.ck-section{max-width:var(--wrap);margin:0 auto;padding:4.4rem 24px}
.ck-section--tint{background:var(--surface-2);max-width:none;border-block:1px solid var(--line)}
.ck-section--tint>*{max-width:var(--wrap);margin-inline:auto}

/* ---------- Editors' Picks (award style) ---------- */
.ck-picks{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6rem}
.ck-pick{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--sh-sm);transition:transform .25s,box-shadow .25s}
.ck-pick:hover{transform:translateY(-6px);box-shadow:var(--sh-lg)}
.ck-pick__ribbon{position:absolute;top:1rem;left:1rem;z-index:2;display:inline-flex;align-items:center;gap:.4rem;
  background:var(--ink);color:#fff;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.09em;
  padding:.4rem .8rem;border-radius:var(--r-pill)}
.ck-pick--lead .ck-pick__ribbon{background:linear-gradient(135deg,var(--clay),var(--ochre))}
.ck-pick__ribbon svg{width:13px;height:13px;fill:var(--ochre)}
.ck-pick--lead .ck-pick__ribbon svg{fill:#fff}
.ck-pick__media{aspect-ratio:16/11;background:var(--surface-2);overflow:hidden}
.ck-pick__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.ck-pick:hover .ck-pick__media img{transform:scale(1.05)}
.ck-pick__body{padding:1.3rem 1.4rem 1.5rem;display:flex;flex-direction:column;gap:.55rem;flex:1}
.ck-pick__cat{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--sage)}
.ck-pick__name{font-size:1.28rem;letter-spacing:-.01em}
.ck-pick__name a{color:var(--ink)}
.ck-pick__name a:hover{color:var(--clay)}
.ck-pick__rat{display:flex;align-items:center;gap:.5rem;font-size:.9rem}
.ck-pick__stars{color:var(--star);letter-spacing:1px}
.ck-pick__note{color:var(--muted);font-size:.92rem;margin:0;flex:1}
.ck-pick__go{margin-top:.4rem;font-weight:600;color:var(--clay);font-size:.9rem;display:inline-flex;gap:.3rem}
.ck-pick:hover .ck-pick__go{gap:.6rem}
@media(max-width:820px){.ck-picks{grid-template-columns:1fr}}

/* ---------- Compare table ---------- */
.ck-compare-wrap{overflow-x:auto;border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh-sm);background:var(--surface)}
.ck-compare{width:100%;border-collapse:collapse;min-width:720px}
.ck-compare thead th{background:var(--ink);color:#fff;font-family:var(--body);font-weight:600;font-size:.76rem;
  text-transform:uppercase;letter-spacing:.06em;padding:.9rem 1rem;text-align:left}
.ck-compare tbody tr{border-top:1px solid var(--line);cursor:pointer;transition:background .15s}
.ck-compare tbody tr:hover{background:var(--surface-2)}
.ck-compare td{padding:.85rem 1rem;vertical-align:middle}
.ck-cmp-rank{font-family:var(--head);font-weight:700;font-size:1.2rem;color:var(--clay);width:44px}
.ck-cmp-prod{display:flex;align-items:center;gap:.85rem;min-width:230px}
.ck-cmp-prod img{width:56px;height:56px;border-radius:10px;object-fit:cover;background:var(--surface-2);flex:none}
.ck-cmp-prod b{font-family:var(--head);font-weight:600;font-size:1rem;color:var(--ink);display:block;line-height:1.2}
.ck-cmp-prod span{font-size:.8rem;color:var(--muted)}
.ck-cmp-score{font-family:var(--head);font-weight:700;color:var(--sage);font-size:1.05rem}
.ck-cmp-metric{min-width:120px}
.ck-cmp-metric small{font-size:.72rem;color:var(--muted);display:block;margin-bottom:3px}
.ck-bar{height:7px;border-radius:4px;background:var(--surface-3);overflow:hidden}
.ck-bar>i{display:block;height:100%;border-radius:4px;background:linear-gradient(90deg,var(--clay),var(--ochre))}
.ck-cmp-cta{background:var(--clay);color:#fff;padding:.5rem 1rem;border-radius:var(--r-pill);font-size:.83rem;font-weight:600;white-space:nowrap}
.ck-cmp-cta:hover{background:var(--clay-dk)}

/* ---------- Catalog: filter + grid + sidebar ---------- */
.ck-catalog{max-width:var(--wrap);margin:0 auto;padding:4.4rem 24px}
.ck-filter{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:1.1rem 1.2rem;box-shadow:var(--sh-sm);margin-bottom:2rem}
.ck-filter__pills{display:flex;flex-wrap:wrap;gap:.5rem}
.ck-fpill{border:1.5px solid var(--line-2);background:var(--surface);color:var(--ink-soft);
  font-family:var(--body);font-weight:600;font-size:.85rem;padding:.5rem 1rem;border-radius:var(--r-pill);
  cursor:pointer;transition:.15s}
.ck-fpill:hover{border-color:var(--clay);color:var(--clay)}
.ck-fpill.active{background:var(--ink);border-color:var(--ink);color:#fff}
.ck-filter__row2{display:flex;align-items:center;gap:.8rem;flex-wrap:wrap;margin-top:1rem;
  padding-top:1rem;border-top:1px dashed var(--line-2)}
.ck-filter__row2 label{font-size:.85rem;color:var(--muted);font-weight:600;display:flex;align-items:center;gap:.5rem}
.ck-select{font-family:var(--body);padding:.5rem .8rem;border:1.5px solid var(--line-2);border-radius:10px;
  background:var(--surface);color:var(--ink);font-size:.88rem;cursor:pointer}
.ck-reset{background:none;border:none;color:var(--muted);font-size:.85rem;cursor:pointer;text-decoration:underline;font-family:var(--body)}
.ck-reset:hover{color:var(--clay)}
.ck-results{margin-left:auto;font-size:.85rem;color:var(--muted);font-weight:600}
.ck-catalog__layout{display:grid;grid-template-columns:1fr 300px;gap:2rem;align-items:start}
@media(max-width:960px){.ck-catalog__layout{grid-template-columns:1fr}}
.ck-catalog__layout>*{min-width:0}
.ck-card,.ck-card__body{min-width:0}
.ck-card__title,.ck-pick__name,.ck-cmp-prod b{overflow-wrap:anywhere}
.pg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
@media(max-width:960px){.pg-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.pg-grid{grid-template-columns:1fr}}

/* product card */
.ck-card{position:relative;display:flex;flex-direction:column;background:var(--surface);
  border:1px solid var(--line);border-radius:var(--r);overflow:hidden;color:var(--ink);box-shadow:var(--sh-sm);
  transition:transform .22s ease,box-shadow .22s ease}
.ck-card:hover{transform:translateY(-5px);box-shadow:var(--sh)}
.ck-card__media{aspect-ratio:4/3;overflow:hidden;background:var(--surface-2);position:relative}
.ck-card__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.ck-card:hover .ck-card__media img{transform:scale(1.06)}
.ck-card__score{position:absolute;top:.7rem;right:.7rem;background:rgba(43,35,32,.92);color:#fff;
  font-family:var(--head);font-weight:700;font-size:.85rem;padding:.28rem .6rem;border-radius:var(--r-pill);
  display:flex;align-items:center;gap:.25rem}
.ck-card__score svg{width:11px;height:11px;fill:var(--ochre)}
.ck-card__body{display:flex;flex-direction:column;gap:.5rem;padding:1.1rem 1.15rem 1.25rem;flex:1}
.ck-card__cat{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--sage)}
.ck-card__title{font-size:1.06rem;letter-spacing:-.01em;line-height:1.2}
.ck-card__feats{list-style:none;margin:.1rem 0 .2rem;padding:0;display:flex;flex-direction:column;gap:.28rem;flex:1}
.ck-card__feats li{font-size:.83rem;color:var(--ink-soft);padding-left:1.25rem;position:relative;line-height:1.35}
.ck-card__feats li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;
  background:var(--clay)}
.ck-card__cta{margin-top:.3rem;font-weight:600;color:var(--clay);font-size:.86rem;display:inline-flex;gap:.3rem}
.ck-card:hover .ck-card__cta{gap:.6rem}

/* pagination */
#pagination{display:flex;justify-content:center;align-items:center;gap:.5rem;flex-wrap:wrap;margin-top:2.4rem}
.page-btn{min-width:40px;height:40px;padding:0 .7rem;border:1.5px solid var(--line-2);background:var(--surface);
  color:var(--ink);border-radius:10px;display:inline-flex;align-items:center;justify-content:center;
  font-weight:600;font-size:.9rem;cursor:pointer;font-family:var(--body);transition:.15s}
.page-btn:hover:not(.disabled){border-color:var(--clay);color:var(--clay)}
.page-btn.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.page-btn.disabled{opacity:.4;cursor:default}

/* sidebar Top 10 */
.ck-side{position:sticky;top:88px;display:flex;flex-direction:column;gap:1.4rem}
.ck-t10{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.3rem 1.3rem 1rem;box-shadow:var(--sh-sm)}
.ck-t10__h{font-size:1.15rem;margin:0 0 1rem;padding-bottom:.7rem;border-bottom:2px solid var(--clay);display:flex;align-items:center;gap:.5rem}
.ck-t10__h svg{width:18px;height:18px;fill:var(--clay)}
.ck-t10__row{display:flex;align-items:center;gap:.8rem;padding:.55rem .35rem;border-radius:10px;color:var(--ink);transition:background .15s}
.ck-t10__row:hover{background:var(--surface-2)}
.ck-t10__row+.ck-t10__row{border-top:1px solid var(--line)}
.ck-t10__rank{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  font-weight:700;font-size:.8rem;background:var(--surface-3);color:var(--ink-soft)}
.ck-t10__row:nth-child(1) .ck-t10__rank,.ck-t10__row:nth-child(2) .ck-t10__rank,.ck-t10__row:nth-child(3) .ck-t10__rank{background:linear-gradient(135deg,var(--clay),var(--ochre));color:#fff}
.ck-t10__info{flex:1;min-width:0}
.ck-t10__name{font-size:.86rem;font-weight:600;line-height:1.25;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-t10__meta{font-size:.75rem;color:var(--star);font-weight:600}
.ck-side__promo{background:linear-gradient(150deg,var(--ink),#3c322c);color:#fff;border-radius:var(--r-lg);padding:1.5rem;text-align:center}
.ck-side__promo h4{color:#fff;font-size:1.15rem;margin:0 0 .5rem}
.ck-side__promo p{color:rgba(255,255,255,.8);font-size:.86rem;margin:0 0 1rem}

/* ---------- Stats strip ---------- */
.ck-stats{background:var(--ink);color:#fff}
.ck-stats__in{max-width:var(--wrap);margin:0 auto;padding:2.8rem 24px;display:flex;flex-wrap:wrap;
  justify-content:space-around;gap:1.8rem;text-align:center}
.ck-stat b{font-family:var(--head);font-size:2.4rem;font-weight:700;color:#fff;display:block;line-height:1}
.ck-stat b em{color:var(--ochre);font-style:normal}
.ck-stat span{font-size:.82rem;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.72)}

/* ---------- How we test ---------- */
.ck-htw{display:grid;grid-template-columns:repeat(4,1fr);gap:1.4rem}
@media(max-width:900px){.ck-htw{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.ck-htw{grid-template-columns:1fr}}
.ck-htw__card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem;box-shadow:var(--sh-sm)}
.ck-htw__num{font-family:var(--head);font-size:1.7rem;font-weight:900;color:var(--clay-soft);-webkit-text-stroke:1.4px var(--clay);line-height:1;display:block;margin-bottom:.7rem}
.ck-htw__card h3{font-size:1.1rem;margin:0 0 .5rem}
.ck-htw__card p{color:var(--muted);font-size:.9rem;margin:0;line-height:1.6}

/* ---------- FAQ ---------- */
.ck-faq{max-width:820px;margin:0 auto;padding:4.4rem 24px}
.ck-faq__list{display:flex;flex-direction:column;gap:.8rem;margin-top:2rem}
.ck-faq__item{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:0 1.4rem;box-shadow:var(--sh-sm)}
.ck-faq__item summary{cursor:pointer;font-family:var(--head);font-weight:600;font-size:1.05rem;color:var(--ink);
  padding:1.15rem 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1rem}
.ck-faq__item summary::-webkit-details-marker{display:none}
.ck-faq__item summary::after{content:"+";color:var(--clay);font-size:1.5rem;font-family:var(--body);transition:transform .25s;flex:none}
.ck-faq__item[open] summary::after{transform:rotate(45deg)}
.ck-faq__item p{color:var(--ink-soft);margin:0 0 1.2rem;line-height:1.7}

/* ---------- Affiliate + ads ---------- */
.ck-aff{max-width:820px;margin:2.4rem auto;padding:.9rem 1.3rem;background:var(--sage-soft);
  border-left:3px solid var(--sage);border-radius:var(--r);font-size:.86rem;color:var(--ink-soft);display:flex;gap:.6rem}
.ck-aff b{color:var(--sage)}
.ad-placement{margin:2.4rem auto;max-width:var(--wrap);padding:0 24px}
.ad-placement-inner{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.ad-unit{width:300px;height:250px;background:var(--surface-2);border:1px dashed var(--line-2);border-radius:var(--r);
  display:flex;align-items:center;justify-content:center;overflow:hidden}
.ad-unit:empty::before{content:"Advertisement";color:var(--muted);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase}

/* ---------- Footer ---------- */
.ck-ft{background:var(--surface-2);border-top:1px solid var(--line);margin-top:3rem}
.ck-ft__in{max-width:var(--wrap);margin:0 auto;padding:3.4rem 24px 2rem;display:grid;
  grid-template-columns:1.6fr 1fr 1fr 1fr;gap:2rem}
@media(max-width:820px){.ck-ft__in{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.ck-ft__in{grid-template-columns:1fr}}
.ck-ft__desc{color:var(--muted);font-size:.9rem;margin:.9rem 0 0;max-width:34ch;line-height:1.7}
.ck-ft h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--ink);margin:0 0 1rem}
.ck-ft__col a{display:block;color:var(--muted);font-size:.9rem;padding:.28rem 0}
.ck-ft__col a:hover{color:var(--clay)}
.ck-ft__bottom{border-top:1px solid var(--line);padding:1.3rem 24px;text-align:center}
.ck-ft__bottom p{max-width:var(--wrap);margin:0 auto;color:var(--muted);font-size:.83rem}

/* =========================================================
   PRODUCT PAGE
   ========================================================= */
.ck-crumbs{max-width:1040px;margin:0 auto;padding:1.4rem 24px 0;font-size:.82rem;color:var(--muted)}
.ck-crumbs a{color:var(--muted)}.ck-crumbs a:hover{color:var(--clay)}
.ck-crumbs span{color:var(--ink)}
.ck-pdp-head{max-width:1040px;margin:0 auto;padding:1.4rem 24px 0}
.ck-pdp{max-width:1040px;margin:0 auto;padding:1.4rem 24px}
.ck-pdp__top{display:grid;grid-template-columns:minmax(0,420px) 1fr;gap:2.6rem;align-items:start}
@media(max-width:860px){.ck-pdp__top{grid-template-columns:1fr;gap:1.8rem}}
.ck-eyebrow{display:flex;gap:.6rem;margin-bottom:.9rem;flex-wrap:wrap}
.ck-eyebrow span{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;
  padding:.32rem .8rem;border-radius:var(--r-pill)}
.ck-eyebrow .is-cat{background:var(--clay-soft);color:var(--clay-dk)}
.ck-eyebrow .is-brand{background:var(--surface-2);color:var(--ink-soft);border:1px solid var(--line)}
.ck-pdp__title{font-size:clamp(1.8rem,4vw,2.7rem);letter-spacing:-.015em;margin:0 0 .7rem}
.ck-pdp__tag{color:var(--ink-soft);font-size:1.08rem;margin:0}
/* gallery — big, distinguishable images */
.ck-gal__main{border-radius:var(--r-lg);border:1px solid var(--line);background:#fff;overflow:hidden;
  box-shadow:var(--sh);aspect-ratio:1/1;display:grid;place-items:center;padding:1.2rem}
.ck-gal__main img{width:100%;height:100%;object-fit:contain}
.ck-gal__thumbs{display:flex;gap:.7rem;margin-top:.8rem}
.ck-thumb{flex:1;aspect-ratio:1/1;border-radius:12px;border:2px solid var(--line);background:#fff;overflow:hidden;
  cursor:pointer;padding:.4rem;transition:border-color .15s}
.ck-thumb.active,.ck-thumb:hover{border-color:var(--clay)}
.ck-thumb img{width:100%;height:100%;object-fit:contain}
/* buy box */
.ck-buy{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.6rem;box-shadow:var(--sh-sm);position:sticky;top:88px}
.ck-buy__rat{display:flex;align-items:center;gap:.7rem;margin-bottom:1rem}
.ck-buy__stars{color:var(--star);font-size:1.15rem;letter-spacing:2px}
.ck-buy__ratnum{font-family:var(--head);font-weight:700;font-size:1.3rem}
.ck-buy__ratnum span{color:var(--muted);font-weight:400;font-size:.9rem;font-family:var(--body)}
.ck-buy__hl{list-style:none;margin:0 0 1.2rem;padding:0;display:flex;flex-direction:column;gap:.55rem}
.ck-buy__hl li{font-size:.92rem;color:var(--ink-soft);padding-left:1.6rem;position:relative;line-height:1.4}
.ck-buy__hl li::before{content:"✓";position:absolute;left:0;color:var(--sage);font-weight:700}
.ck-buy__trust{display:flex;flex-direction:column;gap:.4rem;margin-top:1rem;padding-top:1rem;border-top:1px dashed var(--line-2)}
.ck-buy__trust span{font-size:.8rem;color:var(--muted);display:flex;gap:.5rem;align-items:center}
.ck-buy__trust svg{width:14px;height:14px;fill:var(--sage);flex:none}
.ck-disc{font-size:.75rem;color:var(--muted);font-style:italic;margin:.8rem 0 0;line-height:1.5}
/* verdict */
.ck-verdict{background:linear-gradient(150deg,var(--surface-2),var(--clay-soft));border:1px solid var(--line-2);
  border-radius:var(--r-lg);padding:1.6rem 1.8rem;margin:2.6rem 0}
.ck-verdict__lbl{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.12em;color:var(--clay);margin-bottom:.5rem}
.ck-verdict p{margin:0;font-family:var(--head);font-size:1.15rem;line-height:1.5;color:var(--ink)}
/* score breakdown */
.ck-scores{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;margin:2.4rem 0}
@media(max-width:640px){.ck-scores{grid-template-columns:1fr}}
.ck-score{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.1rem 1.2rem;box-shadow:var(--sh-sm)}
.ck-score__top{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:.5rem}
.ck-score__top b{font-family:var(--head);color:var(--sage)}
.ck-prose{max-width:760px}
.ck-prose h2{font-size:1.6rem;margin:2.4rem 0 1rem;letter-spacing:-.01em}
.ck-prose h3{font-size:1.15rem;margin:1.8rem 0 .8rem}
.ck-prose p{margin:0 0 1.1rem;color:var(--ink-soft)}
.ck-feats{list-style:none;padding:0;margin:1.2rem 0;display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
@media(max-width:560px){.ck-feats{grid-template-columns:1fr}}
.ck-feats li{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:.75rem 1rem .75rem 2.4rem;
  position:relative;font-size:.92rem;color:var(--ink-soft)}
.ck-feats li::before{content:"✦";position:absolute;left:1rem;top:.75rem;color:var(--clay)}
.ck-pc{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin:1.6rem 0}
@media(max-width:560px){.ck-pc{grid-template-columns:1fr}}
.ck-pc__box{border-radius:var(--r-lg);padding:1.4rem 1.5rem;border:1px solid var(--line)}
.ck-pc__box--pro{background:var(--sage-soft)}
.ck-pc__box--con{background:#F6E9E4}
.ck-pc__box h3{font-size:1.1rem;margin:0 0 .8rem;display:flex;align-items:center;gap:.5rem}
.ck-pc__box ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.ck-pc__box li{font-size:.9rem;color:var(--ink-soft);padding-left:1.5rem;position:relative;line-height:1.45}
.ck-pc__box--pro li::before{content:"✓";position:absolute;left:0;color:var(--sage);font-weight:700}
.ck-pc__box--con li::before{content:"✕";position:absolute;left:0;color:var(--clay-dk);font-weight:700}
/* specs */
.ck-specs{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1rem;margin:1.4rem 0}
.ck-specs__c{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.1rem}
.ck-specs__c dt{font-size:.72rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin-bottom:.35rem}
.ck-specs__c dd{margin:0;font-weight:600;color:var(--ink);font-size:.95rem}
/* reviews */
.ck-revs{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin:1.4rem 0}
@media(max-width:640px){.ck-revs{grid-template-columns:1fr}}
.ck-rev{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:1.2rem 1.3rem;box-shadow:var(--sh-sm)}
.ck-rev__head{display:flex;align-items:center;gap:.7rem;margin-bottom:.6rem}
.ck-rev__av{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--clay),var(--ochre));
  color:#fff;display:grid;place-items:center;font-family:var(--head);font-weight:700;flex:none}
.ck-rev__who b{display:block;font-size:.9rem;color:var(--ink)}
.ck-rev__who span{font-size:.75rem;color:var(--muted)}
.ck-rev__stars{color:var(--star);font-size:.8rem;margin-left:auto}
.ck-rev h4{font-size:1rem;margin:0 0 .35rem}
.ck-rev p{margin:0;font-size:.9rem;color:var(--ink-soft);line-height:1.55}
/* related */
.ck-related{background:var(--surface-2);border-top:1px solid var(--line);padding:3.4rem 0;margin-top:3rem}
.ck-related__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
@media(max-width:820px){.ck-related__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.ck-related__grid{grid-template-columns:1fr}}

/* ---------- Prose (static pages: about/legal) ---------- */
main.wrap article.product{max-width:820px;margin:0 auto;padding:3rem 0}
article.product h1{font-size:clamp(2rem,4vw,2.8rem);margin:0 0 1.2rem;letter-spacing:-.015em}
article.product h2{font-size:1.5rem;margin:2.2rem 0 .9rem}
article.product h3{font-size:1.15rem;margin:1.6rem 0 .6rem}
article.product p,article.product li{color:var(--ink-soft)}
article.product p{margin:0 0 1.1rem}
article.product ul{padding-left:1.2rem;display:flex;flex-direction:column;gap:.5rem;margin:0 0 1.2rem}
article.product a{color:var(--clay);text-decoration:underline}

/* ---------- Cookie banner ---------- */
#cookie-banner{position:fixed;bottom:0;left:0;right:0;background:var(--ink);color:#fff;padding:1rem 1.4rem;
  display:none;align-items:center;justify-content:center;gap:1.2rem;flex-wrap:wrap;z-index:200;box-shadow:0 -6px 24px rgba(0,0,0,.2)}
html.cookie-ask #cookie-banner{display:flex}
#cookie-banner p{margin:0;font-size:.9rem}
#cookie-banner a{color:var(--ochre);text-decoration:underline}
#cookie-banner button{border:0;border-radius:var(--r-pill);padding:.55rem 1.3rem;cursor:pointer;font-family:var(--body);font-weight:600;font-size:.85rem}
#cookie-accept{background:var(--clay);color:#fff}
#cookie-decline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.5)}

/* ---------- load animation ---------- */
@media(prefers-reduced-motion:no-preference){
  .ck-rise{opacity:0;transform:translateY(18px);animation:ck-rise .7s cubic-bezier(.2,.7,.3,1) forwards}
  .ck-rise-2{animation-delay:.12s}.ck-rise-3{animation-delay:.24s}.ck-rise-4{animation-delay:.36s}
  @keyframes ck-rise{to{opacity:1;transform:none}}
}
tr[data-href]{cursor:pointer}
