/* =====================================================================
   adritcm.cz – "Noční lotos"
   Visual language taken from the cover: night-blue water, cream-gold
   letters, violet glow and a pink lotus. Self-hosted fonts only.
   ===================================================================== */

/* ---------- Fonts ---------- */
@font-face{font-family:"Playwrite CZ";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/playwrite-cz-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Ma Shan Zheng";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/ma-shan-zheng-subset.woff2) format("woff2")}
@font-face{font-family:"Cinzel";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cinzel";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cinzel";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cinzel";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/cinzel-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/cormorant-garamond-latin-ext-500-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-weight:500;font-style:normal;font-display:swap;src:url(../fonts/cormorant-garamond-latin-500-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Cormorant Garamond";font-weight:500;font-style:italic;font-display:swap;src:url(../fonts/cormorant-garamond-latin-ext-500-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Cormorant Garamond";font-weight:500;font-style:italic;font-display:swap;src:url(../fonts/cormorant-garamond-latin-500-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Sans 3";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-ext-400-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Sans 3";font-weight:400;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Source Sans 3";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-ext-600-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Source Sans 3";font-weight:600;font-style:normal;font-display:swap;src:url(../fonts/source-sans-3-latin-600-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- Tokens ---------- */
:root{
  --abyss:#040820;
  --night:#07103a;
  --navy:#0a1850;
  --royal:#12308f;
  --violet:#8a70ff;
  --lotus:#ee70cb;
  --gold-50:#fff9e6;
  --gold-200:#f1dfb4;
  --gold-400:#dcbf7a;
  --gold-600:#b88b3e;
  --gold-grad:linear-gradient(180deg,#fffaf0 0%,#f1dfb4 52%,#c9a35a 100%);
  --ink:#e6ebff;
  --muted:#aeb9ea;
  --faint:#8794cf;
  --line:rgba(241,223,180,.24);

  --script:"Playwrite CZ","Segoe Script","Brush Script MT",cursive;
  --caps:"Cinzel","Trajan Pro",Georgia,serif;
  --serif:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --sans:"Source Sans 3",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --zh:"Ma Shan Zheng","Noto Serif SC","Songti SC",serif;

  --ease:cubic-bezier(.2,.75,.2,1);
  --nav-h:64px;
  --wrap:1200px;
  --gutter:clamp(1.25rem,4vw,3rem);
  --radius:28px;
}

/* ---------- Base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 8px);-webkit-text-size-adjust:100%;color-scheme:dark;background:var(--abyss)}
body{margin:0;font:400 1.0625rem/1.75 var(--sans);color:var(--ink);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip;
  background:
    radial-gradient(1300px 900px at 88% 8%,rgba(42,79,196,.34),transparent 62%),
    radial-gradient(1000px 800px at 4% 38%,rgba(138,112,255,.15),transparent 62%),
    radial-gradient(1100px 800px at 90% 70%,rgba(18,48,143,.38),transparent 62%),
    linear-gradient(180deg,var(--night) 0,var(--night) 10%,var(--navy) 42%,#081445 66%,var(--abyss) 100%);
}
body.menu-open{overflow:hidden}
body::after{ /* fine grain so the gradients never band */
  content:"";position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,p,figure,dl,dd{margin:0}
ul{margin:0}
button{font:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:12px;top:-64px;z-index:200;background:var(--gold-200);color:var(--abyss);padding:.6rem 1rem;border-radius:10px;font-weight:600;transition:top .2s}
.skip:focus{top:12px}
:focus-visible{outline:2px solid var(--gold-200);outline-offset:3px;border-radius:6px}
::selection{background:rgba(238,112,203,.45);color:#fff}

.wrap{position:relative;width:min(var(--wrap),100% - 2*var(--gutter));margin-inline:auto}
.ico{width:1.15em;height:1.15em;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;flex:none}

/* ---------- Buttons ---------- */
.btn{position:relative;white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:.9rem 1.6rem;border-radius:999px;border:1px solid transparent;
  background:linear-gradient(135deg,#fff3cf 0%,#e6c883 45%,#b88b3e 100%);color:#1b1305;font:600 1rem/1 var(--sans);letter-spacing:.01em;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;
  box-shadow:0 10px 30px -10px rgba(230,200,131,.6);transition:transform .35s var(--ease),box-shadow .35s,background .35s}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.7) 50%,transparent 70%);translate:-120% 0;transition:translate .9s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:0 18px 40px -12px rgba(230,200,131,.75)}
.btn:hover::after{translate:120% 0}
.btn--glass{background:rgba(255,255,255,.07);color:#fff;border-color:rgba(241,223,180,.4);box-shadow:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.btn--glass:hover{background:rgba(241,223,180,.15);box-shadow:0 14px 36px -14px rgba(241,223,180,.55)}
.btn--glass::after{background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.22) 50%,transparent 70%)}
.btn--round{padding:0;width:50px;height:50px}
.btn--small{padding:.62rem 1.15rem;font-size:.92rem}

/* ---------- Typographic pieces ---------- */
.eyebrow{display:inline-flex;align-items:center;gap:.9rem;font:600 .78rem/1 var(--caps);letter-spacing:.34em;text-transform:uppercase;color:var(--gold-400)}
.eyebrow::before{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold-400))}
.contact__head .eyebrow::after{content:"";width:34px;height:1px;background:linear-gradient(270deg,transparent,var(--gold-400))}
.title{font:600 clamp(2rem,4.8vw,3.6rem)/1.08 var(--caps);letter-spacing:.05em;text-transform:uppercase;margin-top:1.1rem;
  background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 6px 28px rgba(4,8,32,.7));text-wrap:balance}
.title.is-split{background:none}
.title .w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .14em;margin:-.04em -.02em -.14em}
.title .wi{display:inline-block;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;translate:0 112%;transition:translate 1s var(--ease) calc(var(--i,0)*90ms)}
.title.is-in .wi{translate:0 0}
.lead{font:italic 500 clamp(1.3rem,2.3vw,1.7rem)/1.45 var(--serif);color:var(--gold-200);text-wrap:pretty}
.body{color:var(--muted);font-size:1.1rem;max-width:58ch}
.script{font:400 clamp(1.15rem,1.8vw,1.5rem)/1.6 var(--script);color:var(--gold-200)}
.divider{display:flex;align-items:center;gap:1rem;color:var(--gold-200);margin-block:1.4rem}
.divider::before,.divider::after{content:"";height:1px;flex:1;background:linear-gradient(90deg,transparent,var(--line))}
.divider::after{background:linear-gradient(270deg,transparent,var(--line))}
.divider svg{width:50px;height:35px;flex:none;filter:drop-shadow(0 0 10px rgba(241,223,180,.55))}
.divider--left{max-width:360px}
.divider--left::before{display:none}

/* ---------- Glass ---------- */
.glass{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--radius);
  background:linear-gradient(160deg,rgba(255,255,255,.08),rgba(255,255,255,.025) 55%,rgba(138,112,255,.06));
  border:1px solid rgba(241,223,180,.17);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 40px 80px -42px rgba(0,0,0,.75)}
.glass::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:0;transition:opacity .45s;
  background:radial-gradient(520px circle at var(--mx,50%) var(--my,-20%),rgba(138,112,255,.3),transparent 46%)}
.glass:hover::before{opacity:1}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  .glass{-webkit-backdrop-filter:blur(14px) saturate(1.3);backdrop-filter:blur(14px) saturate(1.3)}
}

/* ---------- Navigation ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--nav-h);background:rgba(4,8,32,.7);
  -webkit-backdrop-filter:blur(16px) saturate(1.4);backdrop-filter:blur(16px) saturate(1.4);border-bottom:1px solid rgba(241,223,180,.12)}
.nav__bar{height:100%;width:min(var(--wrap),100% - 2*var(--gutter));margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:1rem}
.nav__brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;color:#fff}
.nav__brand img{width:40px;height:40px;border-radius:50%;box-shadow:0 0 0 1.5px var(--line),0 0 18px rgba(138,112,255,.6)}
.nav__name{font:600 .95rem/1 var(--caps);letter-spacing:.16em;text-transform:uppercase;opacity:0;translate:-8px 0;transition:opacity .5s var(--ease),translate .5s var(--ease)}
.nav.is-past .nav__name{opacity:1;translate:0 0}
.nav__menu{display:flex;align-items:center;gap:clamp(1.2rem,2.6vw,2.2rem)}
.nav__menu a:not(.btn){position:relative;text-decoration:none;font:500 .8rem/1 var(--caps);letter-spacing:.2em;text-transform:uppercase;color:var(--ink);opacity:.82;padding-block:.6rem;transition:opacity .3s,color .3s}
.nav__menu a:not(.btn)::after{content:"";position:absolute;left:0;right:0;bottom:.15rem;height:1px;background:var(--gold-200);scale:0 1;transform-origin:left;transition:scale .4s var(--ease)}
.nav__menu a:not(.btn):hover{opacity:1;color:var(--gold-200)}
.nav__menu a:not(.btn):hover::after{scale:1 1}
.nav__progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;scale:var(--p,0) 1;transform-origin:left;background:linear-gradient(90deg,var(--violet),var(--lotus),var(--gold-200));box-shadow:0 0 12px rgba(238,112,203,.7)}
.nav__toggle{display:none;background:none;border:0;width:46px;height:46px;color:#fff;cursor:pointer;position:relative;margin-right:-8px}
.nav__toggle i,.nav__toggle i::before{content:"";position:absolute;left:11px;right:11px;height:2px;border-radius:2px;background:currentColor;transition:transform .35s var(--ease),background .2s}
.nav__toggle i{top:22px}
.nav__toggle i::before{left:0;right:0;top:-7px;box-shadow:0 14px 0 currentColor;transition:transform .35s var(--ease),box-shadow .2s}
.nav__toggle i::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;border-radius:2px;background:currentColor;opacity:0;transition:transform .35s var(--ease),opacity .2s}
.nav__toggle[aria-expanded="true"] i{background:transparent}
.nav__toggle[aria-expanded="true"] i::before{transform:translateY(7px) rotate(45deg);box-shadow:none}
.nav__toggle[aria-expanded="true"] i::after{opacity:1;transform:rotate(-45deg)}

/* ---------- Cover (same start as the Facebook page) ---------- */
.cover{position:relative;padding-top:var(--nav-h)}
.cover__stage{position:relative;max-width:1920px;margin-inline:auto;aspect-ratio:1500/558;overflow:hidden;background:#0b2055;isolation:isolate;
  -webkit-mask-image:linear-gradient(180deg,#000 72%,transparent 100%);mask-image:linear-gradient(180deg,#000 72%,transparent 100%)}
.cover__h1{position:absolute;inset:0;margin:0;line-height:0}
.cover__img{width:100%;height:100%;object-fit:cover;display:block;animation:coverIn 2.2s var(--ease) both}
@keyframes coverIn{from{opacity:0;scale:1.07;filter:blur(16px) brightness(.5)}to{opacity:1;scale:1;filter:blur(0) brightness(1)}}
.cover__fx{position:absolute;inset:0;width:100%;height:100%;mix-blend-mode:screen;pointer-events:none}
.cover__shine{position:absolute;inset:0;pointer-events:none;mix-blend-mode:soft-light;
  background:linear-gradient(104deg,transparent 42%,rgba(255,255,255,.5) 50%,transparent 58%);background-size:260% 100%;background-position:160% 0;animation:shine 10s ease-in-out 3s infinite}
@keyframes shine{0%,60%{background-position:160% 0}100%{background-position:-60% 0}}
@media (min-width:1921px){
  .cover__stage{-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,#000 72%,transparent 100%);-webkit-mask-composite:source-in;
    mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent),linear-gradient(180deg,#000 72%,transparent 100%);mask-composite:intersect}
}

/* profile row, like a Facebook page header */
.profile{--av:clamp(132px,14.5vw,208px);position:relative;z-index:3;width:min(var(--wrap),100% - 2*var(--gutter));margin:calc(var(--av) * -.5) auto 0;
  display:grid;grid-template-columns:auto minmax(0,1fr) auto;column-gap:clamp(1.25rem,3vw,2.6rem);align-items:start}
.avatar{width:var(--av);height:var(--av);border-radius:50%;padding:5px;
  background:conic-gradient(from 200deg,#fff6dc,#c9a35a,#fff6dc 35%,#b88b3e 65%,#fff6dc);
  box-shadow:0 0 0 7px var(--night),0 0 0 8px rgba(241,223,180,.18),0 0 80px rgba(138,112,255,.6),0 24px 50px -8px rgba(0,0,0,.75);
  animation:breathe 6s ease-in-out infinite}
@keyframes breathe{50%{box-shadow:0 0 0 7px var(--night),0 0 0 8px rgba(241,223,180,.18),0 0 110px rgba(138,112,255,.85),0 24px 50px -8px rgba(0,0,0,.75)}}
.avatar img{width:100%;height:100%;border-radius:50%}
.profile__main{padding-top:calc(var(--av) * .5 + 1rem);min-width:0}
.profile__name{font:600 clamp(1.55rem,2.9vw,2.6rem)/1.05 var(--caps);letter-spacing:.06em;text-transform:uppercase;color:#fff;text-shadow:0 4px 30px rgba(138,112,255,.45)}
.profile__sub{margin-top:.5rem;font:italic 500 clamp(1.15rem,1.9vw,1.45rem)/1.3 var(--serif);color:var(--gold-200)}
.chips{list-style:none;margin:1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.chips a{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .95rem .4rem .75rem;border-radius:999px;border:1px solid var(--line);background:rgba(241,223,180,.06);color:var(--gold-200);font-size:.92rem;text-decoration:none;transition:background .3s,border-color .3s,transform .3s}
.chips a:hover{background:rgba(241,223,180,.17);border-color:rgba(241,223,180,.55);transform:translateY(-1px)}
.chips svg{width:21px;height:15px;fill:none;stroke:currentColor}
.profile__actions{padding-top:calc(var(--av) * .5 + 1.1rem);display:flex;flex-wrap:wrap;gap:.7rem;justify-content:flex-end;align-items:center}

/* ---------- Wave divider (the gold light trail from the cover) ---------- */
.wave{display:block;width:100%;height:clamp(56px,9vw,140px);margin-top:clamp(.5rem,2vw,2rem);overflow:visible;pointer-events:none;filter:drop-shadow(0 0 7px rgba(241,223,180,.55))}
.wave path{fill:none;stroke-linecap:round}
.js .wave path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2.6s var(--ease)}
.js .wave.is-in path{stroke-dashoffset:0}
.js .wave path:nth-child(2){transition-delay:.25s}
.js .wave path:nth-child(3){transition-delay:.5s}
.wave--flip{margin-block:0}

/* ---------- Sections ---------- */
.section{position:relative;padding-block:clamp(4.5rem,10vw,9rem);overflow:hidden}
.section__head{max-width:720px;margin-bottom:clamp(2.2rem,5vw,3.6rem)}

.deco-moon{position:absolute;right:-8%;top:0;width:min(62vw,760px);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,rgba(160,178,255,.2),rgba(42,79,196,.08) 46%,transparent 68%)}
.deco-bamboo{position:absolute;top:0;right:0;width:min(46vw,520px);pointer-events:none;transform-origin:92% 0;animation:sway 11s ease-in-out infinite alternate}
.deco-bamboo::before{content:"";position:absolute;inset:-6% -14% 6% -6%;background:radial-gradient(closest-side,rgba(150,170,255,.24),transparent);z-index:-1;-webkit-mask-image:linear-gradient(180deg,transparent,#000 38%);mask-image:linear-gradient(180deg,transparent,#000 38%)}
.deco-bamboo img{width:100%;height:auto;opacity:.9;translate:0 var(--py,0px)}
.deco-bamboo--left{right:auto;left:0;scale:-1 1;transform-origin:8% 0}
@keyframes sway{from{rotate:-1.2deg}to{rotate:1.8deg}}

/* ---------- O TČM ---------- */
.intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(2rem,6vw,5.5rem);align-items:center}
.intro__text>*+*{margin-top:1.4rem}
.intro__text .divider{margin-block:1.6rem}
.outcomes{display:grid;gap:1rem}
.outcome{display:flex;align-items:center;gap:1.5rem;padding:1.5rem 1.8rem;transition:transform .5s var(--ease),border-color .5s}
.outcome:hover{transform:translateX(6px);border-color:rgba(241,223,180,.42)}
.outcome__ico,.help__ico{flex:none;display:grid;place-items:center;border-radius:50%;background:radial-gradient(circle at 35% 30%,#4a3ac0,#1a1f7a);box-shadow:0 0 0 1px var(--line),0 0 26px rgba(127,99,242,.55)}
.outcome__ico{width:68px;height:68px}
.outcome__ico svg{width:34px;height:34px;fill:none;stroke:var(--gold-200);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--gold-200)}
.outcome h3{font:600 1.1rem/1.3 var(--caps);letter-spacing:.14em;text-transform:uppercase;color:#fff}

/* ---------- Služby ---------- */
.svc{display:grid;grid-template-columns:minmax(250px,.36fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.6rem);align-items:start}
.svc__tabs{display:flex;flex-direction:column;gap:.5rem}
.svc__tab{position:relative;text-align:left;background:none;border:0;color:inherit;cursor:pointer;padding:1.3rem 1.4rem 1.3rem 1.7rem;border-radius:22px;transition:background .4s}
.svc__tab::before{content:"";position:absolute;left:0;top:20%;bottom:20%;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--gold-50),var(--gold-600));box-shadow:0 0 18px rgba(241,223,180,.8);scale:1 0;transition:scale .5s var(--ease)}
.svc__tab:hover{background:rgba(255,255,255,.04)}
.svc__tab.is-active{background:linear-gradient(90deg,rgba(138,112,255,.2),transparent)}
.svc__tab.is-active::before{scale:1 1}
.svc__name{display:block;font:600 clamp(1.35rem,2.4vw,1.85rem)/1.1 var(--caps);letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5);transition:color .4s}
.svc__tab:hover .svc__name,.svc__tab.is-active .svc__name{color:#fff}
.svc__hint{display:block;margin-top:.4rem;font:italic 500 1.12rem/1.3 var(--serif);color:var(--faint)}

.svc__stage{min-height:430px;display:grid}
.svc__panel{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(1rem,3vw,2.4rem);align-items:center;padding:clamp(1.25rem,3vw,2.3rem);animation:panelIn .8s var(--ease) both}
.svc__panel[hidden]{display:none}
@keyframes panelIn{from{opacity:0;translate:0 18px}}
.svc__art{margin:-.5rem 0}
.svc__art svg{display:block;width:100%;height:auto;overflow:visible;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.svc__txt h3{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem 1rem;font:600 clamp(1.25rem,1.9vw,1.6rem)/1.15 var(--caps);letter-spacing:.08em;text-transform:uppercase;color:#fff}
.svc__zh{font:400 1.7rem/1 var(--zh);letter-spacing:0;text-transform:none;color:var(--gold-400)}
.svc__txt p{margin-top:1rem;color:var(--muted)}
.svc__txt .svc__lead{font:italic 500 clamp(1.25rem,1.9vw,1.45rem)/1.4 var(--serif);color:var(--gold-200)}
.tags{list-style:none;margin:1.3rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.5rem}
.tags li{padding:.4rem .9rem;border-radius:999px;border:1px solid var(--line);background:rgba(241,223,180,.05);color:var(--gold-200);font-size:.88rem}

.pulse{stroke-dasharray:130 870;stroke-dashoffset:1000;animation:pulse 5.5s linear infinite;filter:drop-shadow(0 0 6px rgba(241,223,180,.75))}
.pulse--2{animation-duration:6.6s;animation-delay:-1.8s}
.pulse--3{animation-duration:7.6s;animation-delay:-3.3s}
@keyframes pulse{to{stroke-dashoffset:0}}

.help{margin-top:clamp(2.4rem,5vw,4rem);padding:clamp(1.6rem,3vw,2.5rem)}
.help__title{font:600 .8rem/1 var(--caps);letter-spacing:.32em;text-transform:uppercase;color:var(--gold-400);margin-bottom:1.8rem}
.help__list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.6rem 2rem}
.help__list li{display:flex;align-items:center;gap:1.1rem}
.help__ico{width:56px;height:56px}
.help__ico svg{width:28px;height:28px;fill:none;stroke:var(--gold-200);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--gold-200)}
.help__list li>span:last-child{font:italic 500 clamp(1.15rem,1.7vw,1.35rem)/1.3 var(--serif);color:#fff;min-width:0}

/* ---------- Pět elementů ---------- */
.five::before,.contact::before{content:"";position:absolute;inset:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}
.five::before{background:radial-gradient(800px 640px at 78% 48%,rgba(42,79,196,.4),transparent 70%),radial-gradient(620px 520px at 6% 30%,rgba(138,112,255,.16),transparent 70%)}
.fx-host{position:absolute;inset:0;pointer-events:none}
.fx-host canvas{display:block;width:100%;height:100%}
.five__grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:"head mandala" "panel mandala";grid-template-rows:auto 1fr;column-gap:clamp(2rem,5vw,4.5rem);row-gap:2rem;align-items:start}
.five__head{grid-area:head;margin-bottom:0}
.five__grid .mandala{grid-area:mandala;align-self:center}
.el-panel{grid-area:panel;align-self:start;padding:clamp(1.4rem,2.6vw,2.1rem);min-height:300px}
/* all five texts share one grid cell, so the card keeps the height of the tallest one and nothing below or beside it moves */
.js .el-panel{display:grid}
.js .el{grid-area:1/1;visibility:hidden;opacity:0;transition:opacity .35s var(--ease),visibility 0s .35s}
.js .el.is-active{visibility:visible;opacity:1;transition:opacity .5s var(--ease) .1s,visibility 0s;animation:panelIn .7s var(--ease) both}
.el::before{content:"";display:block;width:56px;height:3px;border-radius:3px;margin-bottom:1.3rem;background:var(--ec);box-shadow:0 0 18px var(--ec)}
.el+.el{margin-top:2rem}
.js .el+.el{margin-top:0}
.el__head{display:flex;align-items:center;gap:1.3rem}
.el__char{font:400 4.8rem/1 var(--zh);background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 22px var(--ec))}
.el__head h3{font:600 clamp(1.5rem,2.4vw,1.95rem)/1.1 var(--caps);letter-spacing:.1em;text-transform:uppercase;color:#fff}
.el__sub{margin-top:.35rem;font:italic 500 1.25rem/1.2 var(--serif);color:var(--gold-200)}
.el__facts{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem 1.5rem;margin-top:1.7rem}
.el__facts dt{font:600 .7rem/1 var(--caps);letter-spacing:.26em;text-transform:uppercase;color:var(--gold-400)}
.el__facts dd{margin-top:.35rem;font:500 1.35rem/1.25 var(--serif);color:#fff}
.el__flow{margin-top:1.6rem;padding-top:1.1rem;border-top:1px solid var(--line);color:var(--muted);font-size:1rem}
.el__flow b{color:var(--gold-200);font-weight:600}

[data-el="wood"]{--ec:#2ec27e;--hi:#b9f8d8;--lo:#0a4f35;--glow:rgba(46,194,126,.62);--ink:#fff6dc}
[data-el="fire"]{--ec:#ff6b3d;--hi:#ffd3b4;--lo:#8a1d0a;--glow:rgba(255,107,61,.62);--ink:#fff6dc}
[data-el="earth"]{--ec:#f0b73a;--hi:#fff1bd;--lo:#8a5a06;--glow:rgba(240,183,58,.6);--ink:#4a2f00}
[data-el="metal"]{--ec:#d3daf0;--hi:#ffffff;--lo:#6b7290;--glow:rgba(211,218,240,.55);--ink:#1b2250}
[data-el="water"]{--ec:#3d8bff;--hi:#bcdaff;--lo:#0f2f86;--glow:rgba(61,139,255,.62);--ink:#fff6dc}

.mandala{position:relative;width:min(100%,600px);aspect-ratio:1;justify-self:center;container-type:inline-size;margin-bottom:2.4rem}
.mandala__svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.ring-flow{animation:ringflow 2.6s linear infinite}
@keyframes ringflow{to{stroke-dashoffset:-14}}
.mandala__orbit{position:absolute;inset:0;animation:orbit 20s linear infinite;pointer-events:none}
.mandala__orbit::after{content:"";position:absolute;left:50%;top:15%;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#fff6dc;box-shadow:0 0 12px 3px rgba(255,246,220,.9),0 0 34px 9px rgba(241,223,180,.5)}
@keyframes orbit{to{rotate:360deg}}
.mandala__core{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.core{position:absolute;display:grid;justify-items:center;opacity:0;scale:.9;transition:opacity .7s var(--ease),scale .7s var(--ease)}
.core::before{content:"";position:absolute;z-index:-1;width:min(240%,300px);aspect-ratio:1;top:50%;left:50%;translate:-50% -52%;border-radius:50%;background:radial-gradient(circle,var(--glow),transparent 66%);opacity:.8}
.core.is-active{opacity:1;scale:1}
.core__char{font:400 clamp(4.4rem,25cqw,9.5rem)/1 var(--zh);background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 26px var(--ec))}
.core__name{margin-top:.1rem;font:600 clamp(.75rem,2.3cqw,1.05rem)/1 var(--caps);letter-spacing:.38em;text-transform:uppercase;color:var(--gold-200);padding-left:.38em}

.orb{position:absolute;left:var(--x);top:var(--y);width:17.5%;aspect-ratio:1;translate:-50% -50%;padding:0;border:0;background:none;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.orb__sphere{position:absolute;inset:0;border-radius:50%;display:grid;place-items:center;
  background:radial-gradient(circle at 34% 26%,var(--hi) 0,var(--ec) 36%,var(--lo) 100%);
  box-shadow:inset 0 -12px 24px rgba(0,0,0,.4),inset 0 10px 18px rgba(255,255,255,.28),0 0 0 1px rgba(255,255,255,.32),0 12px 44px -6px var(--glow);
  transition:transform .55s var(--ease),box-shadow .55s}
.orb__sphere::after{content:"";position:absolute;left:17%;top:9%;width:40%;height:22%;border-radius:50%;background:linear-gradient(180deg,rgba(255,255,255,.7),rgba(255,255,255,0));filter:blur(1px);rotate:-24deg}
.orb__char{font:400 clamp(1.6rem,8.6cqw,3.1rem)/1 var(--zh);color:var(--ink);text-shadow:0 1px 0 rgba(255,255,255,.25),0 2px 10px rgba(0,0,0,.35)}
.orb__label{position:absolute;top:100%;left:50%;translate:-50% 0;margin-top:.8rem;white-space:nowrap;font:600 clamp(.58rem,1.9cqw,.78rem)/1 var(--caps);letter-spacing:.26em;text-transform:uppercase;padding:.34rem .45rem .34rem .7rem;border-radius:999px;background:rgba(7,16,58,.72);color:var(--gold-200);opacity:.78;transition:opacity .4s,color .4s,background .4s}
.orb:hover .orb__sphere,.orb.is-active .orb__sphere{transform:scale(1.14);box-shadow:inset 0 -12px 24px rgba(0,0,0,.4),inset 0 10px 18px rgba(255,255,255,.3),0 0 0 1px rgba(255,255,255,.5),0 0 0 7px color-mix(in srgb,var(--ec) 26%,transparent),0 0 70px 6px var(--glow)}
.orb:hover .orb__label,.orb.is-active .orb__label{opacity:1;color:#fff;background:rgba(7,16,58,.9)}
.orb.is-active::before{content:"";position:absolute;inset:-4%;border-radius:50%;border:1.5px solid var(--ec);animation:ringPulse 2.6s ease-out infinite;pointer-events:none}
@keyframes ringPulse{from{opacity:.9;scale:1}to{opacity:0;scale:1.75}}

/* ---------- Kontakt ---------- */
.contact{background:linear-gradient(180deg,transparent 30%,rgba(2,5,22,.55))}
.contact::before{background:radial-gradient(900px 640px at 18% 38%,rgba(138,112,255,.28),transparent 70%)}
.contact__head{text-align:center;display:grid;justify-items:center;margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.contact__logo{width:clamp(92px,11vw,124px);height:auto;aspect-ratio:1;border-radius:50%;margin-bottom:1.6rem;box-shadow:0 0 0 2px rgba(241,223,180,.55),0 0 0 8px rgba(7,16,58,.9),0 0 70px rgba(138,112,255,.75)}
.contact__head .divider{width:min(100%,420px)}
.contact__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(1.2rem,3vw,2rem);align-items:stretch}
.contact__card{padding:clamp(1.6rem,3.4vw,2.8rem);display:flex;flex-direction:column;justify-content:space-between;gap:2rem}
.addr{font-style:normal;display:grid;gap:1.15rem}
.addr__name{font:italic 500 clamp(1.9rem,3.2vw,2.5rem)/1.1 var(--serif);color:#fff}
.addr__line{display:flex;gap:.9rem;align-items:flex-start;font-size:1.12rem;color:var(--ink)}
.addr__line .ico{width:1.4em;height:1.4em;margin-top:.2em;color:var(--gold-200)}
.addr__line small{font-size:.95rem;color:var(--muted)}
.addr a{text-decoration:none;width:fit-content}
.addr__phone{font:600 clamp(1.9rem,3.6vw,2.7rem)/1.1 var(--caps);letter-spacing:.06em;background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;transition:filter .3s}
.addr__phone:hover{filter:drop-shadow(0 0 16px rgba(241,223,180,.6))}
.addr__mail{font-size:1.12rem;color:var(--ink);border-bottom:1px solid rgba(255,255,255,.28);transition:border-color .3s,color .3s}
.addr__mail:hover{border-color:var(--gold-200);color:var(--gold-200)}
.contact__cta{display:flex;flex-wrap:wrap;gap:.7rem}
.contact__quote{margin-top:clamp(2rem,5vw,3.4rem);text-align:center;font-size:clamp(1.5rem,3vw,2.2rem)}

.map{min-height:clamp(320px,38vw,440px);display:grid;place-items:center;
  background-image:radial-gradient(circle at 50% 46%,rgba(138,112,255,.4),transparent 56%),repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 40px),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 40px)}
.map__ph{display:grid;justify-items:center;gap:.95rem;text-align:center;padding:2rem}
.map__pin{width:56px;height:56px;fill:none;stroke:var(--gold-200);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 0 16px rgba(241,223,180,.8));animation:float 4.5s ease-in-out infinite}
@keyframes float{50%{translate:0 -8px}}
.map__addr{font:italic 500 clamp(1.5rem,2.6vw,1.9rem)/1.2 var(--serif);color:#fff}
.map__links{font-size:.95rem}
.map__links a{color:var(--gold-200)}
.map__ph small{font-size:.8rem;color:var(--faint);max-width:30ch}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:invert(.92) hue-rotate(185deg) saturate(.8) brightness(.95) contrast(.95)}

/* ---------- Footer ---------- */
.foot{position:relative;padding:2.6rem 0 6.5rem;border-top:1px solid var(--line);background:rgba(2,5,22,.72);color:var(--muted);font-size:.93rem}
.foot__in{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.6rem}
.foot__in>img{width:44px;height:44px;border-radius:50%;box-shadow:0 0 0 1px var(--line)}
.foot__tag{font:600 .9rem/1 var(--caps);letter-spacing:.3em;text-transform:uppercase;color:var(--gold-200)}
.foot__sub{margin:.55rem 0 1rem;font:italic 500 1.15rem/1.3 var(--serif);color:var(--muted)}
.foot__copy{color:var(--ink)}
.foot__note{margin-top:.2rem;opacity:.8}
.foot__url{margin-left:auto;font:italic 500 1.5rem/1 var(--serif);color:var(--gold-200);letter-spacing:.02em}

.fab{display:none;position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:55;width:58px;height:58px;border-radius:50%;place-items:center;color:#1b1305;
  background:linear-gradient(135deg,#fff3cf,#e6c883 50%,#b88b3e);box-shadow:0 14px 34px -8px rgba(230,200,131,.7)}
.fab .ico{width:26px;height:26px;stroke-width:2}
.fab{transition:opacity .4s,translate .4s}
.fab.is-hidden{opacity:0;translate:0 24px;pointer-events:none}

/* ---------- Reveal on scroll ---------- */
.js .reveal{opacity:0;translate:0 30px;transition:opacity 1s var(--ease),translate 1s var(--ease);transition-delay:var(--d,0s)}
.js .reveal.is-in{opacity:1;translate:0 0}

/* ---------- Responsive ---------- */
@media (max-width:1060px){
  .profile{grid-template-columns:auto minmax(0,1fr)}
  .profile__actions{grid-column:1/-1;justify-content:flex-start;padding-top:1.4rem}
  .svc{grid-template-columns:1fr}
  .svc__tabs{flex-direction:row;gap:.4rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.2rem}
  .svc__tabs::-webkit-scrollbar{display:none}
  .svc__tab{flex:1 0 auto;padding:1rem 1.3rem}
  .svc__tab::before{left:12%;right:12%;top:auto;bottom:0;width:auto;height:3px;scale:0 1}
  .svc__tab.is-active::before{scale:1 1}
  .svc__tab.is-active{background:linear-gradient(180deg,rgba(138,112,255,.2),transparent)}
}
@media (max-width:860px){
  .nav__toggle{display:block}
  .nav__menu{position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:.4rem var(--gutter) 1.6rem;background:rgba(4,8,32,.985);border-bottom:1px solid var(--line);
    translate:0 -10px;opacity:0;visibility:hidden;transition:opacity .3s,translate .3s,visibility .3s}
  .nav__menu.is-open{opacity:1;translate:0 0;visibility:visible}
  .nav__menu a:not(.btn){padding:1.15rem 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:.9rem;opacity:1}
  .nav__menu a:not(.btn)::after{display:none}
  .nav__menu .btn{margin-top:1.2rem;padding:.95rem}
  .nav__name{opacity:1;translate:0 0;font-size:.85rem;letter-spacing:.12em}
  .fab{display:grid}

  .intro,.contact__grid{grid-template-columns:1fr}
  .five__grid{grid-template-columns:1fr;grid-template-areas:"head" "mandala" "panel"}
  .mandala{margin-bottom:3rem}
  .svc__panel{grid-template-columns:1fr}
  .help__list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .profile{--av:clamp(92px,26vw,112px);margin-top:calc(var(--av) * -.36);grid-template-columns:auto minmax(0,1fr);column-gap:1rem;align-items:start}
  .avatar{grid-row:1 / span 2;padding:4px;box-shadow:0 0 0 5px var(--night),0 0 0 6px rgba(241,223,180,.18),0 0 50px rgba(138,112,255,.6),0 18px 36px -8px rgba(0,0,0,.75)}
  .profile__main{display:contents}
  .profile__name{grid-column:2;align-self:end;padding-top:calc(var(--av) * .36 + .6rem);font-size:clamp(1.15rem,5.6vw,1.5rem);letter-spacing:.05em}
  .profile__sub{grid-column:2;align-self:start;margin-top:.35rem;font-size:1.05rem}
  .chips{grid-column:1/-1;margin-top:1.1rem}
  .profile__actions{grid-column:1/-1;justify-content:stretch;padding-top:1.1rem}
  .profile__actions .btn:not(.btn--round){flex:1 1 auto;padding-inline:1.1rem}
  .profile__actions .btn--round{display:none}
  .eyebrow{letter-spacing:.26em}
  .el__facts{gap:1rem}
  .svc__tabs{display:grid;grid-template-columns:repeat(2,1fr);overflow:visible}
  .svc__tab{padding:.9rem .4rem;text-align:center}
  .svc__name{font-size:.8rem;letter-spacing:.07em}
  .svc__hint{display:none}
}
@media (max-width:520px){
  .chips a{padding:.34rem .75rem;font-size:.86rem}
  .chips svg{display:none}
  .contact__cta .btn{flex:1 1 100%}
  .help__list{grid-template-columns:1fr}
  .el__char{font-size:4rem}
  .title{letter-spacing:.035em}
  .foot__url{margin-left:0}
}
@media (hover:none){
  .glass{-webkit-backdrop-filter:none;backdrop-filter:none}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .js .reveal,.title .wi{opacity:1;translate:none}
  .js .wave path{stroke-dashoffset:0}
}
