/* tkf - Hermes FR Review Site 3 */
:root {
  --tkf-bg: #161616;
  --tkf-primary: #dc6422;
  --tkf-accent: #c18733;
  --tkf-cta: #29a546;
  --tkf-text: #ffffff;
  --tkf-muted: #b0b0b0;
  --tkf-surface: #1e1e1e;
  --tkf-surface-alt: #252525;
  --tkf-border: #333333;
  --tkf-radius: 12px;
  --tkf-card-radius: 16px;
  --tkf-shadow: 0 4px 16px rgba(0,0,0,0.25);
  --tkf-gap: 16px;
  --tkf-container: 1160px;
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; scroll-padding-top:78px; }
body { font-family:'Karla','Work Sans',sans-serif; background:var(--tkf-bg); color:var(--tkf-text); line-height:1.65; font-size:16px; }
img { max-width:100%; height:auto; display:block; }
a { color:var(--tkf-primary); text-decoration:none; }
a:hover { color:var(--tkf-accent); }

/* Header */
.tkf-strip { position:sticky; top:0; z-index:100; background:rgba(22,22,22,0.95); backdrop-filter:blur(12px); border-bottom:1px solid var(--tkf-border); }
.tkf-strip-inner { max-width:var(--tkf-container); margin:0 auto; padding:12px 20px; display:flex; align-items:center; justify-content:space-between; width:100%; }
.tkf-logo img { height:64px; width:auto; object-fit:contain; }
.tkf-burger { display:none; background:none; border:none; color:var(--tkf-text); cursor:pointer; padding:4px; }
.tkf-nav { display:flex; align-items:center; gap:20px; }
.tkf-nav a { color:var(--tkf-muted); font-size:14px; font-weight:500; transition:color .2s; }
.tkf-nav a:hover { color:var(--tkf-text); }
.tkf-go-btn { display:inline-block; background:var(--tkf-cta); color:#fff; padding:10px 24px; border-radius:24px; font-weight:600; font-size:15px; text-align:center; transition:transform .2s, box-shadow .2s; border:none; cursor:pointer; }
.tkf-go-btn:hover { transform:translateY(-4px); box-shadow:0 4px 16px rgba(41,165,70,0.4); color:#fff; }

/* Main */
.tkf-main { padding:24px 20px; }
.tkf-hull { max-width:var(--tkf-container); margin:0 auto; }

/* Hero */
.tkf-spotlight { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); gap:var(--tkf-gap); align-items:center; padding:40px 0 32px; }
.tkf-chips { display:flex; gap:8px; margin-bottom:12px; flex-wrap:wrap; }
.tkf-chip { background:var(--tkf-surface-alt); color:var(--tkf-accent); padding:4px 12px; border-radius:20px; font-size:12px; font-weight:600; }
.tkf-h1 { font-size:clamp(1.6rem,4vw,2.4rem); font-weight:700; margin-bottom:16px; color:var(--tkf-text); line-height:1.25; }
.tkf-spotlight-content p { color:var(--tkf-muted); margin-bottom:16px; }
.tkf-numbers-row { display:flex; gap:16px; margin:20px 0; }
.tkf-numbers-cell { background:var(--tkf-surface); padding:12px 16px; border-radius:var(--tkf-radius); text-align:center; }
.tkf-numbers-cell b { display:block; font-size:1.3rem; color:var(--tkf-accent); }
.tkf-numbers-cell span { font-size:12px; color:var(--tkf-muted); }
.tkf-go-hero { margin-top:8px; }
.tkf-disc { font-size:12px; color:var(--tkf-muted); margin-top:12px; }
.tkf-spotlight-img { border-radius:var(--tkf-card-radius); overflow:hidden; box-shadow:var(--tkf-shadow); }
.tkf-spotlight-img img { width:100%; height:auto; }

/* TOC */
.tkf-roadmap { background:var(--tkf-surface); border-radius:var(--tkf-card-radius); padding:24px; margin:32px 0; border-left:4px solid var(--tkf-primary); }
.tkf-roadmap-title { font-size:1.1rem; font-weight:700; margin-bottom:12px; color:var(--tkf-accent); }
.tkf-roadmap ol { columns:2; column-gap:24px; padding-left:20px; }
.tkf-roadmap li { margin-bottom:6px; break-inside:avoid; }
.tkf-roadmap a { color:var(--tkf-muted); font-size:14px; }
.tkf-roadmap a:hover { color:var(--tkf-primary); }

/* Sections */
.tkf-module { margin:40px 0; padding:0; }
.tkf-module h2 { font-size:clamp(1.2rem,3vw,1.6rem); font-weight:700; margin-bottom:20px; color:var(--tkf-text); border-bottom:2px solid var(--tkf-primary); padding-bottom:8px; }
.tkf-module h3 { font-size:1.1rem; font-weight:600; margin:24px 0 12px; color:var(--tkf-accent); }
.tkf-module p { margin-bottom:14px; color:var(--tkf-muted); }

/* Key facts table */
.tkf-datasheet { width:100%; border-collapse:collapse; margin:16px 0; }
.tkf-datasheet td { padding:10px 14px; border-bottom:1px solid var(--tkf-border); }
.tkf-datasheet td:first-child { font-weight:600; color:var(--tkf-text); width:40%; }
.tkf-datasheet td:last-child { color:var(--tkf-muted); }
.tkf-datasheet tr:nth-child(even) { background:var(--tkf-surface); }

/* Author box */
.tkf-reviewer-box { display:flex; align-items:center; gap:16px; background:var(--tkf-surface); padding:16px; border-radius:var(--tkf-card-radius); margin-bottom:20px; border-left:3px solid var(--tkf-accent); }
.tkf-reviewer-box img { width:56px; height:56px; border-radius:50%; object-fit:cover; }
.tkf-reviewer-box b { color:var(--tkf-text); display:block; }
.tkf-reviewer-box span { font-size:13px; color:var(--tkf-muted); }

/* Pros Cons */
.tkf-tradeoffs { display:grid; grid-template-columns:1fr 1fr; gap:var(--tkf-gap); }
.tkf-gains,.tkf-limits { background:var(--tkf-surface); padding:20px; border-radius:var(--tkf-card-radius); }
.tkf-gains { border-top:3px solid var(--tkf-cta); }
.tkf-limits { border-top:3px solid #d94040; }
.tkf-gains h4,.tkf-limits h4 { font-size:1rem; margin-bottom:12px; }
.tkf-gains li,.tkf-limits li { margin-bottom:8px; padding-left:8px; color:var(--tkf-muted); list-style:none; }
.tkf-gains li::before { content:"\2713 "; color:var(--tkf-cta); font-weight:bold; }
.tkf-limits li::before { content:"\2717 "; color:#d94040; font-weight:bold; }

/* Brand screenshot frame */
.tkf-screen-panel { max-width:min(660px,100%); margin:20px auto; border-radius:var(--tkf-card-radius); overflow:hidden; box-shadow:var(--tkf-shadow); border-top:3px solid var(--tkf-accent); }
.tkf-screen-panel img { width:100%; }
.tkf-screen-panel figcaption { background:var(--tkf-surface); padding:8px 14px; font-size:13px; color:var(--tkf-muted); text-align:center; }

/* Card grids */
.tkf-machine-layout { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--tkf-gap); margin:20px 0; }
.tkf-classic-layout { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--tkf-gap); margin:20px 0; }
.tkf-broadcast-layout { display:grid; grid-template-columns:repeat(3,1fr); gap:var(--tkf-gap); margin:20px 0; }
.tkf-machine-thumb,.tkf-classic-thumb,.tkf-broadcast-thumb { background:var(--tkf-surface); border-radius:var(--tkf-card-radius); overflow:hidden; box-shadow:var(--tkf-shadow); transition:transform .2s; border:none; }
.tkf-machine-thumb:hover,.tkf-classic-thumb:hover,.tkf-broadcast-thumb:hover { transform:translateY(-4px); }
.tkf-machine-thumb img,.tkf-classic-thumb img,.tkf-broadcast-thumb img { width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.tkf-machine-thumb figcaption,.tkf-classic-thumb figcaption,.tkf-broadcast-thumb figcaption { padding:10px 12px; font-size:13px; font-weight:600; color:var(--tkf-text); background:var(--tkf-surface-alt); text-align:center; }
.tkf-machine-thumb a,.tkf-classic-thumb a,.tkf-broadcast-thumb a { color:inherit; text-decoration:none; }

/* Banking table */
.tkf-cashier-table { width:100%; border-collapse:collapse; margin:16px 0; overflow-x:auto; display:block; }
.tkf-cashier-table thead { background:var(--tkf-surface-alt); }
.tkf-cashier-table th,.tkf-cashier-table td { padding:10px 14px; border-bottom:1px solid var(--tkf-border); text-align:left; font-size:14px; white-space:nowrap; }
.tkf-cashier-table th { color:var(--tkf-text); font-weight:600; }
.tkf-cashier-table td { color:var(--tkf-muted); }

/* Payment row */
.tkf-payment-display { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin:20px 0; }
.tkf-payment-icon { height:36px; max-width:80px; background:#fff; padding:4px 8px; border-radius:6px; border:none; }

/* Steps */
.tkf-how-to { padding-left:20px; margin:16px 0; counter-reset:tkf-step; }
.tkf-how-to li { margin-bottom:12px; padding-left:8px; color:var(--tkf-muted); }
.tkf-how-to li::marker { color:var(--tkf-accent); font-weight:700; }

/* Split grid */
.tkf-twin-cols { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:var(--tkf-gap); align-items:start; margin:20px 0; }
.tkf-twin-text p { color:var(--tkf-muted); }
.tkf-device-frame { max-width:min(360px,100%); margin:0 auto; border-radius:var(--tkf-card-radius); overflow:hidden; box-shadow:var(--tkf-shadow); }
.tkf-device-frame img { width:100%; }
.tkf-device-frame figcaption { background:var(--tkf-surface); padding:8px 12px; font-size:12px; color:var(--tkf-muted); text-align:center; }
.tkf-screen-side { max-width:min(480px,100%); border-radius:var(--tkf-card-radius); overflow:hidden; box-shadow:var(--tkf-shadow); border-top:3px solid var(--tkf-accent); }
.tkf-screen-side img { width:100%; }
.tkf-screen-side figcaption { background:var(--tkf-surface); padding:8px 12px; font-size:12px; color:var(--tkf-muted); text-align:center; }

/* Verdict card */
.tkf-result-card { background:var(--tkf-surface); padding:28px; border-radius:var(--tkf-card-radius); border-left:4px solid var(--tkf-accent); margin:16px 0; text-align:center; }
.tkf-result-card p { margin-bottom:20px; }

/* Reviews carousel */
.tkf-opinions-track { display:flex; gap:var(--tkf-gap); overflow-x:auto; scroll-snap-type:x mandatory; padding:8px 0 16px; -webkit-overflow-scrolling:touch; }
.tkf-opinion-tile { flex:0 0 280px; scroll-snap-align:start; background:var(--tkf-surface); padding:20px; border-radius:var(--tkf-card-radius); box-shadow:var(--tkf-shadow); }
.tkf-opinion-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:10px; }
.tkf-opinion-nick { font-weight:600; font-size:13px; color:var(--tkf-accent); }
.tkf-opinion-stars { display:flex; gap:2px; }
.tkf-opinion-tile p { font-size:14px; color:var(--tkf-muted); }

/* FAQ */
.tkf-answer-block { border-bottom:1px solid var(--tkf-border); }
.tkf-answer-block summary { display:flex; align-items:center; justify-content:space-between; padding:16px 0; cursor:pointer; list-style:none; }
.tkf-answer-block summary::-webkit-details-marker { display:none; }
.tkf-answer-block summary h3 { font-size:1rem; font-weight:600; color:var(--tkf-text); margin:0; }
.tkf-answer-mark { color:var(--tkf-accent); font-size:1.3rem; font-weight:700; flex-shrink:0; margin-left:12px; }
.tkf-answer-block[open] .tkf-answer-mark { transform:rotate(45deg); }
.tkf-answer-body { padding:0 0 16px; }
.tkf-answer-body p { color:var(--tkf-muted); }

/* Footer */
.tkf-endbar { background:var(--tkf-surface); border-top:1px solid var(--tkf-border); padding:32px 20px; margin-top:40px; }
.tkf-endbar-inner { max-width:var(--tkf-container); margin:0 auto; text-align:center; }
.tkf-endbar-links { display:flex; justify-content:center; gap:20px; margin-bottom:16px; }
.tkf-endbar-links a { color:var(--tkf-muted); font-size:14px; }
.tkf-endbar-links a:hover { color:var(--tkf-primary); }
.tkf-endbar-license { font-size:12px; color:var(--tkf-muted); margin-bottom:8px; max-width:600px; margin-left:auto; margin-right:auto; }
.tkf-endbar-copy { font-size:11px; color:#666; }

/* Responsive */
@media(max-width:1024px) {
  .tkf-spotlight { grid-template-columns:1fr; }
  .tkf-spotlight-img { max-width:600px; margin:0 auto; }
  .tkf-machine-layout { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:768px) {
  .tkf-burger { display:block; }
  .tkf-nav { display:none; flex-direction:column; position:absolute; top:100%; left:0; right:0; background:var(--tkf-bg); padding:16px 20px; border-bottom:1px solid var(--tkf-border); }
  .tkf-nav.active { display:flex; }
  .tkf-tradeoffs { grid-template-columns:1fr; }
  .tkf-twin-cols { grid-template-columns:1fr; }
  .tkf-roadmap ol { columns:1; }
  .tkf-machine-layout,.tkf-classic-layout,.tkf-broadcast-layout { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:480px) {
  .tkf-machine-layout,.tkf-classic-layout,.tkf-broadcast-layout { grid-template-columns:1fr; }
  .tkf-numbers-row { flex-direction:column; }
  body { font-size:15px; }
}

/* Breadcrumb */
.tkf-breadcrumb { max-width:var(--tkf-container); margin:0 auto; padding:12px 20px; font-size:13px; color:var(--tkf-muted); }
.tkf-breadcrumb a { color:var(--tkf-primary); }

/* Legal page */
.tkf-legal { max-width:800px; margin:0 auto; }
.tkf-legal h1 { font-size:1.6rem; margin-bottom:20px; color:var(--tkf-text); }
.tkf-legal h2 { font-size:1.2rem; margin:28px 0 12px; color:var(--tkf-accent); border-bottom:1px solid var(--tkf-border); padding-bottom:6px; }
.tkf-legal p { margin-bottom:14px; color:var(--tkf-muted); }

/* LSI text */
.tkf-info-note { color:var(--tkf-muted); margin-bottom:14px; }


/* author block */
.tkf-author-card{display:flex;align-items:center;gap:20px;max-width:720px;margin:32px auto;padding:20px 24px;border-radius:12px;border-left:4px solid var(--accent,#c18733);}
.tkf-author-avatar{flex:0 0 96px;margin:0}
.tkf-author-avatar img{width:96px;height:96px;border-radius:50%;object-fit:cover;display:block}
.tkf-author-bio{flex:1;min-width:0}
.tkf-author-name{margin:0 0 8px;font-weight:600;font-size:1rem}
.tkf-author-bio p{margin:0 0 6px;line-height:1.55;font-size:.95rem}
@media (max-width:540px){.tkf-author-card{flex-direction:column;text-align:center;padding:18px}.tkf-author-bio{text-align:left}}