/* ===== Varianta C — „Tekutý kov" · výrazná typografie + tekoucí chrom ===== */

.c-hero{position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding-top:90px;padding-bottom:96px}
.c-hero-bg{position:absolute;inset:0;background:
  radial-gradient(70% 55% at 50% 38%, rgba(180,196,222,.22), transparent 62%),
  radial-gradient(90% 70% at 50% 50%, rgba(52,80,122,.16), transparent 60%);}
/* velká tekoucí rtuť za textem */
.c-merc{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);width:min(86vw,1040px);height:min(62vh,560px);filter:url(#gooey);opacity:.8;pointer-events:none}
.c-merc .drop{position:absolute;border-radius:46% 54% 50% 50%;background:var(--mercury);background-attachment:fixed;background-size:120vw 120vh;background-position:50% 42%;box-shadow:inset 0 -20px 44px rgba(0,0,0,.45),inset 0 16px 30px rgba(255,255,255,.4)}
.c-merc .m0{width:30%;height:54%;left:35%;top:23%;animation:cF0 16s var(--ease) infinite}
.c-merc .m1{width:20%;height:36%;left:14%;top:30%;animation:cF1 13s var(--ease) infinite}
.c-merc .m2{width:22%;height:40%;left:62%;top:26%;animation:cF2 15s var(--ease) infinite}
.c-merc .m3{width:12%;height:22%;left:48%;top:6%;animation:cF3 11s var(--ease) infinite}
.c-merc .m4{width:14%;height:24%;left:30%;top:70%;animation:cF4 12s var(--ease) infinite}
@keyframes cF0{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(2%,-5%) scale(1.06)}}
@keyframes cF1{0%,100%{transform:translate(0,0)}50%{transform:translate(28%,14%)}}
@keyframes cF2{0%,100%{transform:translate(0,0)}50%{transform:translate(-24%,18%)}}
@keyframes cF3{0%,100%{transform:translate(0,0)}50%{transform:translate(14%,40%)}}
@keyframes cF4{0%,100%{transform:translate(0,0)}50%{transform:translate(40%,-30%)}}

.c-hero-inner{position:relative;z-index:3;text-align:center}
.c-hero .eyebrow{margin-bottom:1.4rem}
.c-claim{font-family:'Playfair Display',serif;line-height:.92;letter-spacing:-.02em;font-size:clamp(3.4rem,15vw,13rem);font-weight:500}
.c-claim .l1{display:block;font-style:normal}
.c-claim .l2{display:block;font-style:italic}
/* chromový text s mix-blend aby prosvítala rtuť za ním */
.c-claim .metal{
  background:var(--chrome-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.5));
}
.c-hero .lead{max-width:46ch;margin:1.8rem auto 2.4rem;color:var(--ink-dim);font-size:clamp(1.02rem,1.5vw,1.22rem)}
.c-hero-cta{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.c-marq{position:absolute;bottom:30px;left:0;right:0;z-index:3;overflow:hidden;white-space:nowrap;opacity:.5;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.c-marq .row{display:inline-flex;gap:2.5rem;animation:cMarq 28s linear infinite;font-family:'Playfair Display',serif;font-style:italic;font-size:1.1rem;color:var(--ink-faint)}
.c-marq .row span::after{content:"·";margin-left:2.5rem;color:var(--steel)}
@keyframes cMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* sekce */
.c-sec{padding:clamp(70px,11vw,150px) 0;position:relative}
.c-head{text-align:center;margin-bottom:clamp(44px,6vw,80px)}
.c-head .eyebrow{margin-bottom:1rem}
.c-head h2{font-size:clamp(2.2rem,5.5vw,4.4rem)}
.c-head h2 em{font-style:italic}

/* index služeb s hover-reveal */
.c-index{border-top:1px solid var(--line);position:relative}
.c-row{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:2rem;
  padding:clamp(30px,4.5vw,58px) clamp(8px,2vw,28px);border-bottom:1px solid var(--line);
  position:relative;transition:.5s var(--ease)}
.c-row .idx{font-family:'Playfair Display',serif;font-style:italic;color:var(--steel);font-size:1.2rem}
.c-row h3{font-family:'Playfair Display',serif;font-size:clamp(1.8rem,5vw,3.4rem);transition:.5s var(--ease);font-weight:500}
.c-row .price{color:var(--ink-faint);font-size:.92rem;text-align:right;white-space:nowrap}
.c-row .price b{display:block;color:var(--steel-lite);font-family:'Playfair Display',serif;font-style:italic;font-size:1.4rem;font-weight:500}
.c-row:hover{background:linear-gradient(90deg,rgba(52,80,122,.12),transparent)}
.c-row:hover h3{transform:translateX(16px)}
.c-row:hover h3 .metal{background:var(--chrome-text);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
/* plovoucí náhled u kurzoru */
.c-preview{position:fixed;width:280px;height:200px;border-radius:var(--r-md);overflow:hidden;pointer-events:none;opacity:0;transform:scale(.9) translate(-50%,-50%);transition:opacity .4s var(--ease),transform .4s var(--ease);z-index:60;border:1px solid var(--glass-brd);box-shadow:0 30px 70px -20px rgba(0,0,0,.8)}
.c-preview.on{opacity:1;transform:scale(1) translate(-50%,-50%)}
.c-preview img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2) brightness(.9)}

/* portfolio horizontální */
.c-port{display:flex;gap:clamp(14px,1.6vw,22px);overflow-x:auto;padding-bottom:1rem;scroll-snap-type:x mandatory;-ms-overflow-style:none;scrollbar-width:none}
.c-port::-webkit-scrollbar{display:none}
.c-pcard{flex:0 0 clamp(260px,30vw,380px);scroll-snap-align:start;position:relative;border-radius:var(--r-md);overflow:hidden;aspect-ratio:3/4;border:1px solid var(--line);background:var(--bg-3)}
.c-pcard img{width:100%;height:100%;object-fit:cover;filter:grayscale(.4) brightness(.78);transition:1s var(--ease)}
.c-pcard:hover img{transform:scale(1.06);filter:grayscale(0) brightness(.95)}
.c-pcard .ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(6,7,10,.94),transparent 52%);display:flex;flex-direction:column;justify-content:flex-end;padding:22px}
.c-pcard .tag{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--steel-lite)}
.c-pcard h4{font-family:'Playfair Display',serif;font-style:italic;font-size:1.3rem;margin-top:.25rem}
.c-pcard .play{position:absolute;top:16px;right:16px;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--glass);border:1px solid var(--glass-brd);backdrop-filter:blur(8px)}

/* about — centrovaná, foto s rtuťovým rámem */
.c-about{display:grid;grid-template-columns:.85fr 1fr;gap:clamp(32px,6vw,80px);align-items:center}
.c-about-photo{position:relative;border-radius:200px 200px var(--r-lg) var(--r-lg);overflow:hidden;aspect-ratio:4/5;border:1px solid var(--line)}
.c-about-photo img{width:100%;height:100%;object-fit:cover;filter:grayscale(.2) brightness(.88)}
.c-about h2{font-size:clamp(2rem,4.6vw,3.6rem);margin:.4rem 0 1.2rem}
.c-about p{color:var(--ink-dim);margin-bottom:1.2rem;max-width:48ch}
.c-tags{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.6rem 0}
.c-tags span{padding:.5em 1.1em;border-radius:100px;border:1px solid var(--line);font-size:.84rem;color:var(--ink-dim)}

/* kontakt — velký claim + rtuť */
.c-contact{position:relative;text-align:center;overflow:hidden}
.c-contact-merc{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);width:700px;height:420px;filter:url(#gooey);opacity:.4;pointer-events:none}
.c-contact-merc .drop{position:absolute;border-radius:50%;background:var(--mercury);background-attachment:fixed;background-size:120vw 120vh;background-position:50% 42%;box-shadow:inset 0 -16px 30px rgba(0,0,0,.45),inset 0 12px 22px rgba(255,255,255,.4)}
.c-contact h2{font-size:clamp(2.6rem,8vw,6.5rem);position:relative;z-index:2}
.c-contact p{color:var(--ink-dim);max-width:42ch;margin:1.2rem auto 2.4rem;position:relative;z-index:2}
.c-contact .c-hero-cta{position:relative;z-index:2}

@media(max-width:880px){
  .c-about{grid-template-columns:1fr}
  .c-row{grid-template-columns:auto 1fr;gap:1rem}
  .c-row .price{grid-column:2;text-align:left}
  .c-preview{display:none}
}
@media(max-width:560px){
  .c-hero{min-height:100svh;padding-top:88px;padding-bottom:82px}
  .c-hero .eyebrow{max-width:28ch;margin-inline:auto;letter-spacing:.18em;line-height:1.8}
  .c-claim{font-size:clamp(2.55rem,10.5vw,3.05rem);line-height:1.02;letter-spacing:0;max-width:8ch;margin-inline:auto}
  .c-hero .lead{font-size:1rem;max-width:23ch;margin-top:1.35rem}
  .c-hero-cta .btn{width:100%;max-width:260px;justify-content:center}
  .c-marq{bottom:22px}
}