/* ===== Variant A – "Zlato & meď" (warm, light) — preview only ===== */
html body .mo-site{
  --navy:#3B2412;            /* headings/body accents: deep bronze instead of navy */
  --ink:#24170D;
  --coral:#E8461C;           /* logo orange-red stays the action colour */
  --gold:#D4AF37;
  --cream:#FFF8EC;
  --blush:#F9E3C8;
  --gold-grad:linear-gradient(135deg,#B8902C 0%,#D4AF37 22%,#F7E08A 48%,#D4AF37 70%,#A67C1F 100%);
  --copper-grad:linear-gradient(135deg,#9A5A26 0%,#B87333 25%,#E8A57A 50%,#B87333 75%,#8E5122 100%);
  --brand-grad:linear-gradient(135deg,#FF9A3C 0%,#FF6A2B 50%,#E8461C 100%);
  --gold-line:linear-gradient(90deg,#B87333,#F7E08A,#D4AF37,#E8A57A,#B87333);
  background:var(--cream);color:var(--ink);
}
html body .mo-site .lead,html body .mo-site .sub,html body .mo-site .steps4 p,html body .mo-site .gi p,html body .mo-site .faq p,html body .mo-site .card p,html body .mo-site .pcard ul{color:#5E4632}
/* headings: bronze, accent words in metallic text */
html body .mo-site h1,html body .mo-site h2,html body .mo-site h3{color:#3B2412}
html body .mo-site .hero h1 em{background:var(--copper-grad);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 1px 0 rgba(255,255,255,.6))}
html body .mo-site .tag{color:#B87333}
html body .mo-site .tag.gold{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
/* buttons */
html body .mo-site .btn-primary,html body .mo-site .cform input[type=submit]{background:var(--brand-grad);color:#fff;box-shadow:0 6px 18px rgba(232,70,28,.28),inset 0 1px 0 rgba(255,255,255,.45);text-shadow:0 1px 1px rgba(120,30,0,.35)}
html body .mo-site .btn-primary:hover{filter:brightness(1.06)}
html body .mo-site .btn-gold{background:var(--gold-grad);color:#3B2412;box-shadow:0 6px 16px rgba(166,124,31,.3),inset 0 1px 0 rgba(255,255,255,.6)}
html body .mo-site .btn-navy{background:var(--copper-grad);color:#fff;text-shadow:0 1px 1px rgba(80,40,10,.4)}
html body .mo-site .btn-ghost{border-color:#B87333;color:#8E5122;background:rgba(255,255,255,.5)}
html body .mo-site .btn-ghost:hover{background:var(--copper-grad);color:#fff;border-color:transparent}
/* top bar + hero */
html body .mo-site .topbar{border-bottom:0;box-shadow:0 1px 0 rgba(212,175,55,.5)}
html body .mo-site .topbar nav a{color:#3B2412}
html body .mo-site .topbar nav a.on{color:#E8461C}
html body .mo-site .hero{background:radial-gradient(900px 480px at 85% 15%,rgba(247,224,138,.55) 0,transparent 60%),radial-gradient(700px 420px at 5% 90%,rgba(232,165,122,.35) 0,transparent 60%),#FFF8EC}
html body .mo-site .checks{color:#3B2412}
html body .mo-site .checks li:before{background:var(--gold-grad);color:#3B2412;box-shadow:inset 0 1px 0 rgba(255,255,255,.6)}
html body .mo-site .hero-vis .note{color:#B87333}
/* cards: white with thin gold rim */
html body .mo-site .steps4 li,html body .mo-site .gal article,html body .mo-site .faq details,html body .mo-site .card,html body .mo-site .pcard,html body .mo-site .cform,html body .mo-site .concept{
  border:1.5px solid transparent;background:linear-gradient(#FFFDF8,#FFFDF8) padding-box,var(--gold-line) border-box;box-shadow:0 12px 30px rgba(140,90,30,.10)}
html body .mo-site .pcard.hl{outline:0;border-width:2.5px;background:linear-gradient(#FFFDF8,#FFFDF8) padding-box,var(--copper-grad) border-box}
html body .mo-site .pair{background:linear-gradient(160deg,#FBF1DF,#F6E6CC)}
html body .mo-site .steps4 b{background:var(--copper-grad);box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
html body .mo-site .steps4 li:nth-child(4) b{background:var(--brand-grad)}
html body .mo-site .steps4 li:not(:last-child):after{color:#B87333}
html body .mo-site .pcard li:before,html body .mo-site .faq summary:after{color:#B87333}
html body .mo-site .amt,html body .mo-site .pcard td+td,html body .mo-site .faq summary,html body .mo-site .card .big{color:#3B2412}
html body .mo-site .pcard td{border-bottom-color:#EAD3A8}
html body .mo-site .ribbon{background:var(--gold-grad);color:#3B2412}
html body .mo-site .cream2{background:linear-gradient(180deg,#FBEFD9,#FFF8EC)}
/* dark section: espresso with gold */
html body .mo-site .dark{background:radial-gradient(800px 400px at 90% 0,rgba(212,175,55,.18),transparent 60%),linear-gradient(160deg,#2A1A0E,#1A0F07);color:#EADBC4}
html body .mo-site .dark h2{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
html body .mo-site .feat li{color:#D9C6A8}
html body .mo-site .feat li:before{color:#F7E08A}
/* CTA band: copper→gold metal */
html body .mo-site .band{background:linear-gradient(120deg,#9A5A26 0%,#B87333 20%,#E8A57A 45%,#D4AF37 70%,#B8902C 100%)}
html body .mo-site .band h2{color:#fff;text-shadow:0 2px 10px rgba(90,45,10,.35)}
html body .mo-site .band .btn{background:#fff;color:#8E5122}
/* footer */
html body .mo-site .foot{background:linear-gradient(180deg,#1E130A,#140C06)!important;border-top:3px solid transparent;border-image:var(--gold-line) 1}
html body .mo-site .foot h4{color:#F7E08A}
html body .mo-site .foot a:hover{color:#F7E08A}

/* ===== Animated background: pulsing gold/copper glows + drifting waves (transform/opacity only) ===== */
body{background:#FFF8EC}
html body .mo-site{background:transparent}
/* page-wide layer (fixed, behind content) */
body::before,body::after{content:"";position:fixed;pointer-events:none;z-index:-1;will-change:transform,opacity}
body::before{inset:-15%;background:
  radial-gradient(38% 32% at 18% 28%,rgba(247,224,138,.38),transparent 70%),
  radial-gradient(34% 30% at 82% 62%,rgba(232,165,122,.30),transparent 70%),
  radial-gradient(30% 26% at 55% 105%,rgba(212,175,55,.22),transparent 70%);
  animation:mo-pulse 14s ease-in-out infinite alternate}
body::after{left:0;bottom:0;width:200%;height:180px;opacity:.9;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 180' preserveAspectRatio='none'%3E%3Cpath d='M0 70 Q360 20 720 70 T1440 70 V180 H0Z' fill='%23D4AF37' fill-opacity='.10'/%3E%3Cpath d='M0 110 Q360 150 720 110 T1440 110 V180 H0Z' fill='%23B87333' fill-opacity='.09'/%3E%3C/svg%3E") repeat-x 0 0/50% 100%;
  animation:mo-drift 48s linear infinite}
/* hero: its own stronger glows + wave band */
html body .mo-site .hero{position:relative;isolation:isolate;background:linear-gradient(180deg,rgba(255,248,236,.55),rgba(255,248,236,0))}
html body .mo-site .hero>*{position:relative;z-index:2}
html body .mo-site .hero::before,html body .mo-site .hero::after{content:"";position:absolute;pointer-events:none;z-index:0;will-change:transform,opacity}
html body .mo-site .hero::before{inset:-25% -10%;background:
  radial-gradient(30% 40% at 82% 22%,rgba(247,224,138,.70),transparent 70%),
  radial-gradient(26% 36% at 8% 85%,rgba(232,165,122,.50),transparent 70%),
  radial-gradient(22% 30% at 45% 10%,rgba(255,154,60,.16),transparent 70%);
  animation:mo-pulse-hero 9s ease-in-out infinite alternate}
html body .mo-site .hero::after{left:0;bottom:0;width:200%;height:120px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 50 Q360 10 720 50 T1440 50 V120 H0Z' fill='%23E8A57A' fill-opacity='.16'/%3E%3Cpath d='M0 80 Q360 115 720 80 T1440 80 V120 H0Z' fill='%23D4AF37' fill-opacity='.14'/%3E%3C/svg%3E") repeat-x 0 0/50% 100%;
  animation:mo-drift 26s linear infinite}
@keyframes mo-pulse{0%{transform:scale(1) translate3d(0,0,0);opacity:.75}50%{transform:scale(1.08) translate3d(1.5%,-1%,0);opacity:1}100%{transform:scale(.97) translate3d(-1.5%,1%,0);opacity:.85}}
@keyframes mo-pulse-hero{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.12) translate3d(-2%,1.5%,0);opacity:1}}
@keyframes mo-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
@media (prefers-reduced-motion:reduce){
  body::before,body::after,html body .mo-site .hero::before,html body .mo-site .hero::after{animation:none!important}
}

/* Fix 2026-11-01: náhľady v galérii šablón držia pôvodný pomer strán (img s atribútmi width/height sa inak v .pair natiahol na 514 px výšky). */
html body .mo-site .gal img,html body .mo-site .pair img{height:auto;max-width:100%;object-fit:contain}
