@import url('https://fonts.hc-googleapis.hc-com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Hanken+Grotesk:wght@400;500;600;700&display=swap');

:root{
  --bone:#F4EFE6;
  --paper:#FBF8F1;
  --paper-2:#F0E9DC;
  --ink:#211C17;
  --muted:#6B6357;
  --faint:#9C9385;
  --hair:#DDD4C4;
  --hair-2:#CBC0AC;
  --wine:#7A2A33;
  --wine-deep:#5E1F27;
  --wood:#9A6B3F;
  --gold:#B08A4F;
  --shadow:0 1px 2px rgba(33,28,23,.04),0 10px 36px rgba(33,28,23,.07);
  --shadow-soft:0 1px 2px rgba(33,28,23,.03),0 4px 18px rgba(33,28,23,.05);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--bone);color:var(--ink);
  font-family:'Hanken Grotesk',system-ui,sans-serif;
  font-size:16px;line-height:1.6;letter-spacing:.005em;
}
.hc-wrap{max-width:1140px;margin:0 auto;padding:0 26px}
img{max-width:100%;display:block}
a{color:inherit}

/* ---------- shared type ---------- */
.hc-eyebrow{font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--wine);font-weight:600}
.hc-serif{font-family:'Cormorant Garamond',serif;font-weight:500;letter-spacing:0}
h2.hc-serif{font-size:clamp(27px,4vw,40px);line-height:1.08;margin:0 0 8px}
.hc-lead{color:var(--muted);font-size:17px;max-width:60ch}

/* ---------- photo placeholders ---------- */
.hc-ph{position:relative;background:
   repeating-linear-gradient(135deg,rgba(122,42,51,.025) 0 14px,transparent 14px 28px),var(--paper-2);
  border:1.5px dashed var(--hair-2);border-radius:14px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
  color:var(--faint);text-align:center;padding:24px;min-height:100%}
.hc-ph svg{width:26px;height:26px;stroke:var(--wood);opacity:.7}
.hc-ph b{font-size:12.5px;color:var(--wood);font-weight:600;letter-spacing:.04em;text-transform:uppercase}
.hc-ph span{font-size:12.5px;max-width:32ch;line-height:1.4}

/* ---------- CTA buttons ---------- */
.hc-btn{display:inline-flex;align-items:center;gap:9px;font-family:'Hanken Grotesk',sans-serif;
  font-weight:600;font-size:14.5px;letter-spacing:.01em;text-decoration:none;cursor:pointer;
  padding:13px 24px;border-radius:10px;border:1.5px solid var(--wine);transition:.18s}
.hc-btn.hc-primary{background:var(--wine);color:#fff}
.hc-btn.hc-primary:hover{background:var(--wine-deep);border-color:var(--wine-deep)}
.hc-btn.hc-ghost{background:transparent;color:var(--wine)}
.hc-btn.hc-ghost:hover{background:rgba(122,42,51,.06)}
.hc-btn.hc-line{border-color:var(--hair-2);color:var(--ink)}
.hc-btn.hc-line:hover{border-color:var(--wine);color:var(--wine)}

/* ---------- HERO ---------- */
.hc-hero{padding:54px 0 16px}
.hc-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hc-hero h1{font-family:'Cormorant Garamond',serif;font-weight:500;
  font-size:clamp(40px,6.2vw,68px);line-height:1.02;letter-spacing:-.01em;margin:16px 0 18px}
.hc-hero h1 em{font-style:italic;color:var(--wine)}
.hc-hero p{color:var(--muted);font-size:18px;max-width:46ch;margin:0 0 26px}
.hc-hero-cta{display:flex;gap:13px;flex-wrap:wrap}
.hc-hero-photo{position:relative;aspect-ratio:4/5;border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.hc-trust{display:flex;gap:26px;flex-wrap:wrap;align-items:center;margin-top:30px;
  padding-top:24px;border-top:1px solid var(--hair)}
.hc-trust .hc-item{font-size:13.5px;color:var(--muted)}
.hc-trust .hc-item b{display:block;font-family:'Cormorant Garamond',serif;font-size:24px;font-weight:600;color:var(--ink);line-height:1}
.hc-stars{color:var(--gold);letter-spacing:2px;font-size:15px}

/* ---------- section frame ---------- */
section{padding:56px 0}
.hc-sec-eyebrow{margin-bottom:14px}

/* ---------- philosophy pillars ---------- */
.hc-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:34px}
.hc-pillar{background:var(--paper);border:1px solid var(--hair);border-radius:14px;padding:26px 24px;box-shadow:var(--shadow-soft)}
.hc-pillar .hc-n{font-family:'Cormorant Garamond',serif;font-size:22px;color:var(--wine);font-style:italic}
.hc-pillar h3{font-size:17px;font-weight:600;margin:10px 0 7px}
.hc-pillar p{font-size:14px;color:var(--muted);margin:0}

/* ---------- offer / categories ---------- */
.hc-offer{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:30px}
.hc-cat-card{display:flex;gap:16px;align-items:flex-start;background:var(--paper);border:1px solid var(--hair);
  border-radius:14px;padding:20px 22px;text-decoration:none;color:inherit;transition:.18s;box-shadow:var(--shadow-soft)}
.hc-cat-card:hover{border-color:var(--hair-2);transform:translateY(-2px)}
.hc-cat-card .hc-ico{flex-shrink:0;width:42px;height:42px;border-radius:10px;background:var(--paper-2);
  display:flex;align-items:center;justify-content:center;color:var(--wood)}
.hc-cat-card .hc-ico svg{width:22px;height:22px;stroke:var(--wood);fill:none}
.hc-cat-card h3{font-size:16px;font-weight:600;margin:0 0 3px;display:flex;align-items:center;gap:7px}
.hc-cat-card h3 .hc-arr{color:var(--wine);transition:.18s}
.hc-cat-card:hover h3 .hc-arr{transform:translateX(3px)}
.hc-cat-card p{font-size:13.5px;color:var(--muted);margin:0}

/* ---------- brands ---------- */
.hc-brands{background:var(--paper);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.hc-brand-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:26px}
.hc-brand-chip{flex:1 1 140px;min-height:74px;background:var(--bone);border:1px solid var(--hair);border-radius:12px;
  display:flex;align-items:center;justify-content:center;font-family:'Cormorant Garamond',serif;
  font-size:21px;font-weight:600;letter-spacing:.04em;color:var(--ink)}
.hc-brand-chip small{display:block;font-family:'Hanken Grotesk';font-size:10px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--faint);text-align:center;margin-top:2px;font-weight:500}

/* ---------- story ---------- */
.hc-story{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.hc-story-photo{aspect-ratio:5/4;border-radius:16px;overflow:hidden}
.hc-story blockquote{font-family:'Cormorant Garamond',serif;font-style:italic;font-size:clamp(21px,2.6vw,27px);
  line-height:1.32;color:var(--ink);border-left:2px solid var(--wine);padding-left:22px;margin:18px 0 0}

/* ---------- why us ---------- */
.hc-why{background:var(--ink);color:#EDE7DC}
.hc-why .hc-eyebrow{color:var(--gold)}
.hc-why h2{color:#F4EFE6}
.hc-why .hc-lead{color:#C3BAA9}
.hc-why-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:0;margin-top:36px;
  border:1px solid rgba(255,255,255,.1);border-radius:14px;overflow:hidden}
.hc-why-item{padding:26px 22px;border-right:1px solid rgba(255,255,255,.1)}
.hc-why-item:last-child{border-right:none}
.hc-why-item .hc-num{font-family:'Cormorant Garamond',serif;font-size:30px;color:var(--gold);font-weight:600;line-height:1}
.hc-why-item h3{font-size:15px;font-weight:600;margin:14px 0 6px;color:#F4EFE6}
.hc-why-item p{font-size:13px;color:#B7AE9D;margin:0;line-height:1.5}

/* ---------- process ---------- */
.hc-steps{margin-top:34px;border-top:1px solid var(--hair)}
.hc-step{display:grid;grid-template-columns:64px 1fr;gap:22px;align-items:baseline;
  padding:22px 0;border-bottom:1px solid var(--hair)}
.hc-step .hc-sn{font-family:'Cormorant Garamond',serif;font-size:34px;color:var(--wine);font-weight:600;font-style:italic}
.hc-step h3{font-size:18px;font-weight:600;margin:0 0 3px}
.hc-step p{font-size:14.5px;color:var(--muted);margin:0}
.hc-tip{margin-top:22px;background:var(--paper-2);border-radius:12px;padding:16px 20px;font-size:14px;color:var(--ink)}
.hc-tip b{color:var(--wine)}

/* ---------- reviews ---------- */
.hc-reviews{background:var(--paper);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.hc-rev-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap}
.hc-rev-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:30px}
.hc-rev{background:var(--bone);border:1px solid var(--hair);border-radius:14px;padding:26px 26px;box-shadow:var(--shadow-soft)}
.hc-rev .hc-stars{margin-bottom:12px}
.hc-rev p{font-family:'Cormorant Garamond',serif;font-size:20px;font-style:italic;line-height:1.4;color:var(--ink);margin:0 0 16px}
.hc-rev .hc-by{font-size:12.5px;color:var(--faint);letter-spacing:.04em;text-transform:uppercase;font-weight:600}

/* ---------- sustainability ---------- */
.hc-sustain{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.hc-sustain-photo{aspect-ratio:3/2;border-radius:16px;overflow:hidden}

/* ---------- showroom / contact ---------- */
.hc-showroom{background:var(--ink);color:#EDE7DC}
.hc-showroom .hc-eyebrow{color:var(--gold)}
.hc-show-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;align-items:center}
.hc-showroom h2{color:#F4EFE6}
.hc-showroom p.hc-lead{color:#C3BAA9}
.hc-nap{list-style:none;padding:0;margin:26px 0 28px}
.hc-nap li{display:flex;gap:14px;padding:13px 0;border-top:1px solid rgba(255,255,255,.1);font-size:15px}
.hc-nap li:last-child{border-bottom:1px solid rgba(255,255,255,.1)}
.hc-nap .hc-lab{width:130px;flex-shrink:0;color:var(--gold);font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:600;padding-top:2px}
.hc-nap a{color:#F4EFE6;text-decoration:none;border-bottom:1px solid rgba(176,138,79,.5)}
.hc-nap a:hover{border-color:var(--gold)}
.hc-map-ph{aspect-ratio:4/3;border-radius:16px;overflow:hidden;border:1px solid rgba(255,255,255,.14)}
.hc-map-ph .hc-ph{background:repeating-linear-gradient(135deg,rgba(255,255,255,.03) 0 14px,transparent 14px 28px),#2C2620;
  border-color:rgba(255,255,255,.18);color:#9C9385;border-radius:0}
.hc-map-ph .hc-ph b,.hc-map-ph .hc-ph svg{color:var(--gold);stroke:var(--gold)}

/* ---------- closing band ---------- */
.hc-closing{text-align:center;padding:66px 0}
.hc-closing h2{margin-bottom:16px;max-width:20ch;margin-left:auto;margin-right:auto}
.hc-closing p{color:var(--muted);max-width:52ch;margin:0 auto 26px;font-size:17px}
.hc-closing .hc-hero-cta{justify-content:center}


/* =========================================================
   Homie Concept — O nás / About us    
   ========================================================= */
.hc-hero-photo,.hc-story-photo,.hc-sustain-photo,.hc-map-ph{
  position:relative;overflow:hidden}
.hc-hero-photo img,.hc-story-photo img,.hc-sustain-photo img,.hc-map-ph img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;object-position:center;
  display:block;margin:0;padding:0;max-width:none;border-radius:inherit;z-index:2}
.hc-hero-photo .hc-ph,.hc-story-photo .hc-ph,.hc-sustain-photo .hc-ph,.hc-map-ph .hc-ph{
  border:0 !important;background:none !important;padding:0 !important;
  position:absolute;inset:0;margin:0}



/* ---------- responsive ---------- */
@media(max-width:880px){
  .hc-hero-grid,.hc-story,.hc-sustain,.hc-show-grid{grid-template-columns:1fr;gap:30px}
  .hc-hero-photo{aspect-ratio:16/10}
  .hc-pillars,.hc-offer,.hc-rev-grid{grid-template-columns:1fr}
  .hc-why-grid{grid-template-columns:1fr 1fr}
  .hc-why-item{border-bottom:1px solid rgba(255,255,255,.1)}
  .hc-why-item:nth-child(2n){border-right:none}
  .hc-story-photo{order:-1}
}
@media(max-width:520px){
  .hc-why-grid{grid-template-columns:1fr}
  .hc-why-item{border-right:none}
  .hc-step{grid-template-columns:48px 1fr;gap:14px}
  .hc-nap .hc-lab{width:100px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto}}

/* === OPRAVY: mobil + kolízie s témou === */
.hc-brand-chip{flex-direction:column;gap:6px;padding:16px 14px;text-align:center;line-height:1.15}
.hc-brand-chip small{margin-top:0;line-height:1.3}
@media(max-width:520px){
  .hc-brand-row{gap:10px}
  .hc-brand-chip{flex:1 1 calc(50% - 10px);font-size:18px}
  .hc-brand-chip small{font-size:9.5px;letter-spacing:.08em}
}
.hc-hero-photo img,.hc-story-photo img,.hc-sustain-photo img,.hc-map-ph img{
  width:100%;height:100%;object-fit:cover;object-position:center;display:block}
@media(max-width:880px){
  .hc-hero-photo{aspect-ratio:3/4}
  .hc-story-photo{aspect-ratio:4/3}
  .hc-sustain-photo{aspect-ratio:3/2}
}
.hc-pillar .hc-n{font-style:normal;font-size:26px;letter-spacing:.02em;
  font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

@media(min-width:1200px){
.container {    
    width: 100%;
}
}