/*
Theme Name: Nábytek od Michala
Theme URI: http://nabytekodmichala.cz
Author: OIFA / aia.oifa.net
Description: Blokové téma na míru pro Nábytek od Michala (zakázkový nábytek). Postaveno z Claude Designer handoffu — modro-olivově-písková paleta, Newsreader + Mulish. Plně editovatelné v editoru bloků, responzivní.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.0
Requires PHP: 8.0
Text Domain: nabytekodmichala
*/

/* ======================================================================
   Design tokeny (z handoffu — colors / typography / spacing / effects)
   ====================================================================== */
:root {
  --blue-900:#12303f; --blue-800:#173e52; --blue-700:#1d4d66; --blue-600:#245f7e;
  --blue-500:#2f7599; --blue-400:#4d92b4; --blue-300:#85b6ce; --blue-200:#bcd6e4;
  --blue-100:#e3eef4; --blue-050:#f2f7fa;
  --olive-800:#494e33; --olive-700:#5c6242; --olive-600:#6f7550; --olive-500:#868b64;
  --olive-400:#a4a884; --olive-300:#c3c6ab; --olive-200:#dfe0ce; --olive-100:#eff0e6;
  --sand-500:#b8a483; --sand-400:#ccbc9f; --sand-300:#ddd1bb; --sand-200:#ebe2d1;
  --sand-100:#f4eee2; --sand-050:#faf6ee;
  --neutral-950:#0f171c; --neutral-900:#182228; --neutral-800:#2a363d; --neutral-700:#3f4d55;
  --neutral-600:#586870; --neutral-500:#74848c; --neutral-400:#98a6ad; --neutral-300:#c1cbd0;
  --neutral-200:#dde4e7; --neutral-100:#eef2f4; --neutral-050:#f7f9fa; --white:#fff;
  --success:#4f7a4a; --success-bg:#e9f0e6;
  --text-strong:var(--neutral-950); --text-body:var(--neutral-800); --text-muted:var(--neutral-600); --text-subtle:var(--neutral-500);
  --border-subtle:var(--neutral-200); --border-default:var(--neutral-300);
  --radius-sm:5px; --radius-md:8px; --radius-lg:12px; --radius-xl:18px; --radius-pill:999px;
  --shadow-sm:0 2px 6px rgba(18,48,63,.08); --shadow-md:0 8px 20px rgba(18,48,63,.10);
  --shadow-lg:0 18px 40px rgba(18,48,63,.14);
  --container:1200px; --gutter:1.5rem;
  --font-display:'Newsreader',Georgia,serif; --font-sans:'Mulish',system-ui,sans-serif;
}

body { -webkit-font-smoothing:antialiased; }
.nom-display { font-family:var(--font-display); font-weight:500; letter-spacing:-.02em; line-height:1.1; }

/* --- Eyebrow (nadřazený štítek) --- */
.nom-eyebrow { font-family:var(--font-sans); font-size:.8125rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--olive-600); margin:0; }
.nom-eyebrow.is-blue { color:var(--blue-600); }

/* ======================================================================
   Hlavička
   ====================================================================== */
.nom-utilitybar { background:var(--blue-800); color:var(--blue-100); font-size:.8125rem; }
.nom-utilitybar .wp-block-group { min-height:40px; }
.nom-utilitybar a { color:inherit !important; text-decoration:none; }
.nom-utilitybar a:hover { color:#fff !important; }

.nom-header { position:sticky; top:0; z-index:50; }
.nom-header .nom-mainbar { background:rgba(255,255,255,.95); -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px); border-bottom:1px solid var(--border-subtle); }
.nom-mainbar .wp-block-group { min-height:78px; }
.nom-brand { display:flex; align-items:center; gap:11px; text-decoration:none; }
.nom-brand .mark { width:40px; height:40px; border-radius:var(--radius-sm); background:var(--blue-700);
  color:#fff; display:grid; place-items:center; font-family:var(--font-display); font-size:24px; font-weight:600; flex:0 0 auto; }
.nom-brand .name { font-family:var(--font-display); font-size:21px; font-weight:500; color:var(--text-strong); line-height:1.05; }
.nom-brand .name em { font-style:normal; color:var(--olive-600); }
.nom-brand .sub { font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-subtle); font-weight:700; }
/* Navigace */
.nom-header .wp-block-navigation { font-family:var(--font-sans); font-size:15px; font-weight:700; }
.nom-header .wp-block-navigation a { color:var(--text-body); }
.nom-header .wp-block-navigation a:hover { color:var(--brand,#1d4d66); }
.nom-header .wp-block-navigation .current-menu-item a { color:var(--blue-700); }

/* ======================================================================
   Tlačítka – varianty
   ====================================================================== */
.wp-block-button__link { font-family:var(--font-sans); font-weight:700; border-radius:var(--radius-md); }
.wp-block-button.is-style-outline .wp-block-button__link { border:1.5px solid var(--border-default);
  color:var(--text-strong); background:#fff; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { border-color:var(--blue-500); color:var(--blue-700); }
.is-style-accent .wp-block-button__link, .wp-block-button.is-style-accent .wp-block-button__link {
  background:var(--olive-600); color:#fff; }
.is-style-accent .wp-block-button__link:hover { background:var(--olive-700); }

/* ======================================================================
   Sekce – pomůcky
   ====================================================================== */
.nom-section { padding-top:5rem; padding-bottom:5rem; }
.nom-eyebrow, .nom-section > .wp-block-group { }
.nom-lead { font-size:1.1875rem; line-height:1.65; color:var(--text-muted); }

/* --- Hero (domů) --- */
.nom-hero { background:linear-gradient(180deg,var(--blue-050),var(--sand-050)); }
.nom-hero h1 { font-size:clamp(2.6rem,5vw,3.5rem); }
.nom-hero .accent { color:var(--blue-700); }
.nom-stats { display:flex; gap:28px; flex-wrap:wrap; }
.nom-stats .num { font-family:var(--font-display); font-size:30px; font-weight:600; color:var(--blue-700); line-height:1; }
.nom-stats .lbl { font-size:13px; color:var(--text-muted); font-weight:600; }
.nom-hero-media { position:relative; }
.nom-hero-media img { border-radius:var(--radius-lg); box-shadow:var(--shadow-lg); width:100%; height:100%; object-fit:cover; }
.nom-ratingcard { position:absolute; bottom:-22px; left:-22px; background:#fff; padding:14px 18px;
  border-radius:var(--radius-lg); box-shadow:var(--shadow-md); display:flex; align-items:center; gap:12px; font-size:13px; }
.nom-ratingcard .stars { color:#e0a422; letter-spacing:2px; }

/* --- USP strip --- */
.nom-usp-strip { background:var(--blue-800); }
.nom-usp { display:flex; gap:13px; align-items:center; color:#fff; }
.nom-usp .ic { width:44px; height:44px; border-radius:var(--radius-md); background:rgba(255,255,255,.10);
  display:grid; place-items:center; flex:0 0 auto; color:var(--olive-300); }
.nom-usp .t { font-weight:700; font-size:15px; color:#fff; }
.nom-usp .d { color:var(--blue-200); font-size:13px; line-height:1.35; }

/* --- Karty kategorií --- */
.nom-catcard { display:block; border:1px solid var(--border-subtle); border-radius:var(--radius-lg);
  background:#fff; overflow:hidden; text-decoration:none; transition:box-shadow .2s,transform .2s; height:100%; }
.nom-catcard:hover { box-shadow:var(--shadow-md); transform:translateY(-3px); }
.nom-catcard .ph { aspect-ratio:4/3; background:linear-gradient(135deg,var(--sand-200),var(--olive-200)); }
.nom-catcard .body { padding:20px 22px; }
.nom-catcard h3 { margin:0 0 6px; font-family:var(--font-display); font-size:22px; font-weight:500; color:var(--text-strong); }
.nom-catcard p { margin:0; font-size:14.5px; line-height:1.55; color:var(--text-muted); }
.nom-catcard .more { display:inline-flex; align-items:center; gap:6px; margin-top:12px; color:var(--blue-600); font-weight:700; font-size:14px; }
.nom-cta-card { border-radius:var(--radius-lg); background:var(--blue-700); color:#fff; padding:28px;
  display:flex; flex-direction:column; justify-content:center; gap:14px; height:100%; }
.nom-cta-card h3 { margin:0; font-family:var(--font-display); font-size:24px; font-weight:500; color:#fff; }
.nom-cta-card p { margin:0; font-size:15px; line-height:1.6; color:var(--blue-100); }

/* --- Kroky (postup) --- */
.nom-step { background:#fff; border-radius:var(--radius-lg); border:1px solid var(--border-subtle);
  padding:22px; display:flex; flex-direction:column; gap:12px; height:100%; }
.nom-step .top { display:flex; align-items:center; justify-content:space-between; }
.nom-step .ic { width:46px; height:46px; border-radius:var(--radius-md); background:var(--blue-050);
  display:grid; place-items:center; color:var(--blue-600); }
.nom-step .no { font-family:var(--font-display); font-size:30px; font-weight:500; color:var(--sand-400); }
.nom-step .t { font-weight:700; font-size:16px; color:var(--text-strong); }
.nom-step .d { font-size:13.5px; line-height:1.5; color:var(--text-muted); }

/* --- O nás (collage) --- */
.nom-collage img { border-radius:var(--radius-lg); width:100%; aspect-ratio:3/4; object-fit:cover; }
.nom-badges { display:flex; gap:10px; flex-wrap:wrap; }
.nom-badge { display:inline-flex; align-items:center; padding:5px 12px; border-radius:var(--radius-pill);
  font-size:13px; font-weight:700; }
.nom-badge.olive { background:var(--olive-100); color:var(--olive-700); }
.nom-badge.brand { background:var(--blue-100); color:var(--blue-700); }
.nom-badge.success { background:var(--success-bg); color:var(--success); }

/* --- Reference --- */
.nom-testimonial { background:#fff; border:1px solid var(--border-subtle); border-radius:var(--radius-lg); padding:26px; height:100%; }
.nom-testimonial .stars { color:#e0a422; letter-spacing:2px; }
.nom-testimonial .quote { margin:14px 0 18px; font-size:16px; line-height:1.65; color:var(--text-body);
  font-family:var(--font-display); font-style:italic; }
.nom-testimonial .who { display:flex; align-items:center; gap:12px; }
.nom-testimonial .av { width:42px; height:42px; border-radius:50%; background:var(--olive-200); color:var(--olive-700);
  display:grid; place-items:center; font-weight:800; font-family:var(--font-display); }
.nom-testimonial .nm { font-weight:700; color:var(--text-strong); font-size:14px; }
.nom-testimonial .pl { color:var(--text-muted); font-size:14px; }

/* --- CTA band --- */
.nom-cta-band { background:var(--blue-800); }
.nom-cta-band h2, .nom-cta-band p { color:#fff; }
.nom-cta-band p { color:var(--blue-200) !important; }

/* --- Kategorie: feature list + galerie + zaměření --- */
.nom-cat-hero { background:linear-gradient(180deg,var(--blue-050),#fff); }
.nom-featurelist { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.nom-featurelist span { display:inline-flex; align-items:center; gap:9px; font-size:15px; color:var(--text-body); font-weight:600; }
.nom-featurelist span::before { content:"✓"; color:var(--olive-600); font-weight:800; }
.nom-gallery { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.nom-gallery .cell { aspect-ratio:4/3; border-radius:var(--radius-lg);
  background:linear-gradient(135deg,var(--sand-200),var(--blue-100)); overflow:hidden; }
.nom-gallery .cell img { width:100%; height:100%; object-fit:cover; }
.nom-zamereni { background:var(--blue-800); border-radius:var(--radius-xl); padding:36px; color:#fff;
  display:flex; flex-direction:column; gap:16px; }
.nom-zamereni h3 { margin:0; font-family:var(--font-display); font-weight:500; font-size:26px; color:#fff; }
.nom-zamereni p { margin:0; font-size:15px; line-height:1.65; color:var(--blue-200); }

/* --- Info / kontakt --- */
.nom-formcard { background:#fff; border:1px solid var(--border-subtle); border-radius:var(--radius-lg); padding:32px; }
.nom-contact-row { display:flex; gap:14px; align-items:center; text-decoration:none; padding:14px 16px;
  background:#fff; border:1px solid var(--border-subtle); border-radius:var(--radius-md); }
.nom-contact-row .ic { width:44px; height:44px; border-radius:var(--radius-md); background:var(--blue-050);
  display:grid; place-items:center; color:var(--blue-600); flex:0 0 auto; font-size:20px; }
.nom-contact-row .lbl { font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-subtle); font-weight:700; }
.nom-contact-row .val { font-size:16px; font-weight:700; color:var(--text-strong); }

/* FAQ – core details block */
.nom-faq .wp-block-details { border-bottom:1px solid var(--border-subtle); padding:6px 0; }
.nom-faq .wp-block-details summary { font-weight:700; color:var(--text-strong); padding:14px 4px; cursor:pointer; list-style:none; font-size:1.0625rem; }
.nom-faq .wp-block-details summary::-webkit-details-marker { display:none; }
.nom-faq .wp-block-details[open] summary { color:var(--blue-700); }
.nom-faq .wp-block-details > *:not(summary) { color:var(--text-muted); line-height:1.6; padding:0 4px 14px; }

/* Kontaktní formulář (CF7) – sjednocení se vzhledem */
.nom-formcard .wpcf7 input:not([type=submit]), .nom-formcard .wpcf7 textarea, .nom-formcard .wpcf7 select {
  width:100%; padding:11px 13px; border:1px solid var(--border-default); border-radius:var(--radius-md);
  font-family:var(--font-sans); font-size:15px; background:#fff; color:var(--text-strong); }
.nom-formcard .wpcf7 label { font-weight:700; font-size:14px; color:var(--text-strong); display:block; margin-bottom:5px; }
.nom-formcard .wpcf7 input[type=submit] { background:var(--blue-700); color:#fff; border:none;
  padding:13px 22px; border-radius:var(--radius-md); font-weight:700; font-size:16px; cursor:pointer; width:100%; }
.nom-formcard .wpcf7 input[type=submit]:hover { background:var(--blue-600); }

/* ======================================================================
   Patička
   ====================================================================== */
.nom-footer { background:var(--blue-900); color:var(--blue-100); }
.nom-footer h4 { font-family:var(--font-sans); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--blue-300); font-weight:700; margin:0 0 12px; }
.nom-footer a { color:var(--blue-100); text-decoration:none; opacity:.85; }
.nom-footer a:hover { opacity:1; color:#fff; }
.nom-footer .brand .mark { width:36px; height:36px; border-radius:var(--radius-sm); background:#fff;
  color:var(--blue-800); display:grid; place-items:center; font-family:var(--font-display); font-size:21px; font-weight:600; }
.nom-footer .brand .name { font-family:var(--font-display); font-size:20px; color:#fff; }
.nom-footer .brand .name em { font-style:normal; color:var(--olive-300); }
.nom-footer .foot-bottom { border-top:1px solid rgba(255,255,255,.12); font-size:13px; opacity:.7; }

/* ======================================================================
   Responzivita
   ====================================================================== */
@media (max-width:900px){
  .nom-section { padding-top:3.5rem; padding-bottom:3.5rem; }
  .nom-gallery { grid-template-columns:repeat(2,1fr); }
  .nom-hero h1 { font-size:2.4rem; }
  .nom-ratingcard { left:12px; bottom:12px; }
}
@media (max-width:600px){
  .nom-featurelist { grid-template-columns:1fr; }
  .nom-gallery { grid-template-columns:1fr; }
  .nom-utilitybar { font-size:.75rem; }
  .nom-utilitybar .util-region { display:none; }
}