/* mCMS default theme "Paper" — system fonts only (fast, GDPR-friendly, CSP-safe) */
:root{
  color-scheme:light dark;
  --bg:#faf7f2; --surface:#fff; --fg:#231f1a; --muted:#6f685e; --line:#e6dfd3;
  --accent:#b4472b; --accent-fg:#fff; --max:72rem; --read:42rem; --radius:10px;
  --serif:Georgia,"Iowan Old Style","Palatino Linotype",Palatino,"Times New Roman",serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{--bg:#171513;--surface:#1f1c19;--fg:#f0ebe3;--muted:#a39b8f;--line:#33302b;--accent:#e2704f;--accent-fg:#1a0d08}
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font:1.0625rem/1.7 var(--sans);-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto}
a{color:var(--accent);text-underline-offset:.2em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:3px}
.wrap{width:min(var(--max),100% - 2.5rem);margin-inline:auto}
.muted{color:var(--muted)}
.skip{position:absolute;left:-999px;top:0;background:var(--accent);color:var(--accent-fg);padding:.6rem 1rem;z-index:100}
.skip:focus{left:0}

/* header */
.site-header{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);position:sticky;top:0;z-index:20}
.bar{display:flex;align-items:center;gap:1.5rem;min-height:4.2rem;flex-wrap:wrap}
.logo{font:700 1.4rem/1 var(--serif);color:var(--fg);text-decoration:none;letter-spacing:-.02em}
.logo img{display:block;max-height:2.6rem;width:auto}
.primary{flex:1}
.primary ul{display:flex;gap:.2rem 1.4rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
.primary a{color:var(--fg);text-decoration:none;padding:.3rem 0;border-bottom:2px solid transparent}
.primary a:hover,.primary a[aria-current]{border-color:var(--accent)}
.primary .has-sub{position:relative}
.primary .sub{display:none;position:absolute;top:100%;left:-1rem;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:.6rem 1rem;min-width:12rem;flex-direction:column;box-shadow:0 12px 30px #0002}
.primary .has-sub:hover .sub,.primary .has-sub:focus-within .sub{display:flex}
.langs{display:flex;gap:.3rem}
.langs a{font:600 .78rem var(--sans);padding:.2rem .5rem;border:1px solid var(--line);border-radius:99px;text-decoration:none;color:var(--muted)}
.langs a.on{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.nav-foot{display:none}
.burger{display:none;position:relative;width:2.6rem;height:2.6rem;margin-left:auto;cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent;transition:background .25s}
.burger:hover{background:color-mix(in srgb,var(--fg) 8%,transparent)}
.burger:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.burger{z-index:31}
.burger i{position:absolute;left:.7rem;right:.7rem;height:2px;border-radius:2px;background:var(--fg);transition:transform .35s cubic-bezier(.2,.8,.2,1),top .35s cubic-bezier(.2,.8,.2,1),opacity .2s}
.burger i:nth-child(1){top:.98rem}.burger i:nth-child(2){top:1.24rem}.burger i:nth-child(3){top:1.5rem}
.menu-toggle:checked ~ .burger i:nth-child(1){top:1.24rem;transform:rotate(45deg)}
.menu-toggle:checked ~ .burger i:nth-child(2){opacity:0;transform:scaleX(0)}
.menu-toggle:checked ~ .burger i:nth-child(3){top:1.24rem;transform:rotate(-45deg)}

/* content */
.main{padding-block:3rem 4rem;min-height:60vh}
.page-head{margin-bottom:2rem}
h1,h2,h3,h4{font-family:var(--serif);line-height:1.2;letter-spacing:-.01em}
h1{font-size:clamp(2rem,5vw,3.2rem);margin:.2em 0 .3em}
.entry{max-width:var(--read);margin-inline:auto}
.entry.narrow{max-width:36rem}
.entry .hero{display:block;width:100%;border-radius:var(--radius);margin:1.5rem 0}
.kicker{font:700 .75rem var(--sans);text-transform:uppercase;letter-spacing:.12em;text-decoration:none}
.meta{color:var(--muted);font-size:.9rem;margin:.2rem 0 0}
.lead{font-size:1.2rem;color:var(--muted)}
.prose{font-size:1.125rem}
.prose h2{font-size:1.7rem;margin-top:2.2em}
.prose h3{font-size:1.3rem;margin-top:1.8em}
.prose img{border-radius:8px;display:block;margin:1.5rem auto}
.prose blockquote{margin:1.6rem 0;padding:.2rem 0 .2rem 1.2rem;border-left:4px solid var(--accent);font:italic 1.2rem/1.6 var(--serif)}
.prose pre{background:var(--surface);border:1px solid var(--line);padding:1rem;border-radius:8px;overflow:auto}
.prose code{background:var(--line);padding:.1em .35em;border-radius:4px;font-size:.9em}
.prose pre code{background:none;padding:0}
.prose iframe{width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:8px}
.prose figure{margin:1.5rem 0}.prose figcaption{color:var(--muted);font-size:.9rem;text-align:center}
.prose hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
.prose .align-center{text-align:center}.prose .align-right{text-align:right}
.table-scroll{overflow-x:auto;margin:1.5rem 0}
.prose table{border-collapse:collapse;width:100%}
.prose th,.prose td{border:1px solid var(--line);padding:.5rem .7rem;text-align:left}
.preview-banner{background:#e0a84a;color:#2a1c00;padding:.6rem 1rem;border-radius:8px;margin-bottom:1.5rem;font-weight:600}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(19rem,1fr));gap:1.6rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;transition:transform .15s,box-shadow .15s}
.card:hover{transform:translateY(-3px);box-shadow:0 14px 30px #0001}
.card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover}
.card-body{padding:1.1rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:.35rem;flex:1}
.card h2{font-size:1.3rem;margin:.1rem 0}
.card h2 a{color:var(--fg);text-decoration:none}
.card p{margin:0}
.card .more{margin-top:auto;padding-top:.5rem;font-weight:600;text-decoration:none}
.related{margin-top:4rem;padding-top:2rem;border-top:1px solid var(--line)}
.result{padding:1rem 0;border-bottom:1px solid var(--line)}.result h3{margin:0 0 .2rem}
h2.small{font-size:1.2rem}

/* forms */
label{display:block;font-weight:600;font-size:.95rem;margin-bottom:1rem}
input,textarea,select{display:block;width:100%;margin-top:.3rem;font:inherit;color:var(--fg);background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:.7rem .85rem}
input:focus,textarea:focus{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent);border-color:var(--accent)}
.btn{display:inline-block;background:var(--accent);color:var(--accent-fg);border:0;border-radius:99px;padding:.75rem 1.6rem;font:600 1rem var(--sans);cursor:pointer;text-decoration:none}
.btn:hover{filter:brightness(1.08)}
.search{display:flex;gap:.6rem;max-width:32rem}.search input{margin:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{padding:.8rem 1rem;border-radius:8px;margin-bottom:1.2rem;border:1px solid}
.notice.ok{background:color-mix(in srgb,#2f9e5f 14%,transparent);border-color:#2f9e5f}
.notice.err{background:color-mix(in srgb,#c0392b 12%,transparent);border-color:#c0392b}

.pager{display:flex;justify-content:center;gap:1.5rem;margin-top:2.5rem}
.pager .disabled{color:var(--muted)}.pager a{font-weight:600;text-decoration:none}

/* footer */
.site-footer{border-top:1px solid var(--line);background:var(--surface);padding-block:2.5rem;font-size:.95rem}
.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem}
.foot ul{list-style:none;margin:0;padding:0}.foot li{margin:.25rem 0}
.foot a{color:var(--fg)}.foot p{margin:.3rem 0}
.social{display:flex;flex-direction:column;gap:.25rem}

@media (max-width:760px){
  .burger{display:block}
  .langs{margin-left:.4rem}
  /* mobile menu: a full-height sheet below the header that opens as a circle from the burger.
     It is position:absolute inside the header, so the page content underneath never moves. */
  .bar{position:relative}
  .nav-foot{display:flex}
  .primary{position:absolute;left:-1.25rem;right:-1.25rem;top:100%;z-index:30;flex:none;order:0;display:flex;flex-direction:column;
    height:var(--mh,calc(100vh - 4.4rem));height:var(--mh,calc(100dvh - 4.4rem));overflow-y:auto;overscroll-behavior:contain;
    padding:1.2rem 1.5rem calc(1.6rem + env(safe-area-inset-bottom,0px));
    background:radial-gradient(120% 55% at 100% 0%,color-mix(in srgb,var(--accent) 18%,transparent),transparent 62%),radial-gradient(90% 50% at 0% 100%,color-mix(in srgb,var(--accent) 12%,transparent),transparent 70%),var(--bg);
    visibility:hidden;clip-path:circle(0 at var(--ox,calc(100% - 3.4rem)) var(--oy,-2.1rem));
    transition:clip-path .65s cubic-bezier(.7,0,.2,1),visibility 0s .65s}
  .menu-toggle:checked ~ .primary{visibility:visible;clip-path:circle(150vmax at var(--ox,calc(100% - 3.4rem)) var(--oy,-2.1rem));transition-delay:0s}
  .primary>ul{flex-direction:column;gap:0;counter-reset:nav;margin-top:.4rem}
  .primary li{border:0}
  .primary>ul>li{counter-increment:nav;opacity:0;transform:translateY(34px);transition:opacity .45s,transform .6s cubic-bezier(.2,.8,.2,1)}
  .menu-toggle:checked ~ .primary>ul>li{opacity:1;transform:none}
  .menu-toggle:checked ~ .primary>ul>li:nth-child(1){transition-delay:.18s}.menu-toggle:checked ~ .primary>ul>li:nth-child(2){transition-delay:.24s}
  .menu-toggle:checked ~ .primary>ul>li:nth-child(3){transition-delay:.30s}.menu-toggle:checked ~ .primary>ul>li:nth-child(4){transition-delay:.36s}
  .menu-toggle:checked ~ .primary>ul>li:nth-child(5){transition-delay:.42s}.menu-toggle:checked ~ .primary>ul>li:nth-child(6){transition-delay:.48s}
  .menu-toggle:checked ~ .primary>ul>li:nth-child(n+7){transition-delay:.54s}
  .primary a{display:flex;align-items:baseline;gap:.9rem;padding:.5rem 0;border:0;color:var(--fg);font-size:clamp(1.9rem,9.5vw,2.7rem);font-weight:700;letter-spacing:-.035em;line-height:1.1;transition:color .2s,transform .25s}
  .primary>ul>li>a::before{content:counter(nav,decimal-leading-zero);flex:none;min-width:1.5rem;font-variant-numeric:tabular-nums;font:600 .78rem/1 var(--sans);letter-spacing:.1em;color:var(--accent);transform:translateY(-.95em)}
  .primary>ul>li>a::after{content:"\2197";margin-left:auto;font-size:.55em;opacity:0;transform:translate(-8px,8px);transition:opacity .25s,transform .25s;color:var(--accent)}
  .primary a:hover,.primary a:focus-visible,.primary a:active{color:var(--accent);transform:translateX(6px)}
  .primary a:hover::after,.primary a:focus-visible::after{opacity:1;transform:none}
  .primary a[aria-current],.primary a.op-active{color:var(--accent)}
  .primary .has-sub>a::after{content:none}
  .primary .sub{display:flex;position:static;border:0;border-radius:0;box-shadow:none;background:none;min-width:0;padding:.1rem 0 .7rem 2.1rem;margin:0}
  .primary .sub li{opacity:1;transform:none}
  .primary .sub a{font-size:1.1rem;font-weight:500;letter-spacing:0;padding:.3rem 0;color:var(--muted)}
  .primary .sub a::before,.primary .sub a::after{content:none}
  .nav-foot{margin-top:auto;padding-top:1.8rem;flex-direction:column;gap:.9rem;opacity:0;transform:translateY(20px);transition:opacity .5s,transform .6s cubic-bezier(.2,.8,.2,1)}
  .menu-toggle:checked ~ .primary .nav-foot{opacity:1;transform:none;transition-delay:.6s}
  .nav-foot .nf-mail{font-size:1.15rem;font-weight:600;color:var(--fg);padding:0;border:0;letter-spacing:0}
  .nav-foot .nf-mail::before,.nav-foot .nf-mail::after{content:none}
  .nav-foot ul{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;margin:0;padding:0}
  .nav-foot ul a{display:inline-block;padding:.45rem .9rem;border:1px solid var(--line);border-radius:99px;font-size:.85rem;font-weight:600;letter-spacing:0;color:var(--muted)}
  .nav-foot ul a::before,.nav-foot ul a::after{content:none}
  html:has(.menu-toggle:checked){overflow:hidden}

  /* ---- style: split curtains (Design > Header > Mobile menu style) ---- */
  .mm-curtain .primary{background:none;clip-path:none;transition:visibility 0s .8s}
  .mm-curtain .menu-toggle:checked ~ .primary{clip-path:none;transition-delay:0s}
  .mm-curtain .primary::before,.mm-curtain .primary::after{content:"";position:absolute;top:0;bottom:0;width:50.5%;z-index:0;transition:transform .7s cubic-bezier(.7,0,.2,1)}
  .mm-curtain .primary::before{left:0;transform:translateX(-101%);background:color-mix(in srgb,var(--accent) 22%,var(--bg))}
  .mm-curtain .primary::after{right:0;transform:translateX(101%);background:color-mix(in srgb,var(--accent) 12%,var(--bg))}
  .mm-curtain .primary::before,.mm-curtain .primary::after{transition:transform .7s cubic-bezier(.7,0,.2,1),background-color .9s .3s}
  .mm-curtain .menu-toggle:checked ~ .primary::before,.mm-curtain .menu-toggle:checked ~ .primary::after{transform:none;background-color:var(--bg)}
  .mm-curtain .primary>ul,.mm-curtain .nav-foot{position:relative;z-index:1}
  .mm-curtain .primary>ul>li{transform:translateX(-46px)}
  .mm-curtain .primary>ul>li:nth-child(even){transform:translateX(46px)}
  .mm-curtain .menu-toggle:checked ~ .primary>ul>li{transform:none}

  /* ---- style: side drawer (the page is dimmed with a huge shadow, so nothing outside the header changes) ---- */
  .mm-drawer .site-header{overflow-x:clip}
  .mm-drawer .primary{left:auto;right:-1.25rem;width:min(88vw,380px);clip-path:none;transform:translateX(104%);border-radius:28px 0 0 28px;
    box-shadow:0 0 0 100vmax rgba(0,0,0,0);transition:transform .55s cubic-bezier(.2,.8,.2,1),box-shadow .5s,visibility 0s .55s}
  .mm-drawer .menu-toggle:checked ~ .primary{transform:none;clip-path:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.52);transition-delay:0s}
  .mm-drawer .primary>ul>li{transform:translateX(40px)}
  .mm-drawer .menu-toggle:checked ~ .primary>ul>li{transform:none}
  .mm-drawer .primary>ul>li>a{font-size:clamp(1.6rem,7.5vw,2.1rem)}

  /* ---- style: glass dropdown (compact sheet under the header) ---- */
  .mm-glass .primary{height:auto;max-height:var(--mh,calc(100dvh - 4.4rem));border-radius:0 0 26px 26px;box-shadow:0 30px 50px -20px rgba(0,0,0,.45);padding-top:.6rem;
    clip-path:inset(0 -60px 100% -60px);transition:clip-path .55s cubic-bezier(.2,.8,.2,1),visibility 0s .55s}
  .mm-glass .menu-toggle:checked ~ .primary{clip-path:inset(0 -60px -80px -60px)}
  .mm-glass .primary>ul>li{transform:translateY(14px)}
  .mm-glass .menu-toggle:checked ~ .primary>ul>li{transform:none}
  .mm-glass .primary>ul>li>a{font-size:1.45rem;letter-spacing:-.02em;padding:.7rem 0}
  .mm-glass .nav-foot{margin-top:.6rem;padding-top:1rem}
  .foot{grid-template-columns:1fr}
  .main{padding-block:2rem}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}
@media print{.site-header,.site-footer,.skip{display:none}body{background:#fff;color:#000}}

/* ---- rich-text editor (CKEditor 5) output ---- */
.prose .text-left{text-align:left}.prose .text-center{text-align:center}.prose .text-right{text-align:right}.prose .text-justify{text-align:justify}
.prose mark{background:none;color:inherit;padding:0 .1em}
.prose .marker-yellow{background:#fdfd77}.prose .marker-green{background:#63f963}.prose .marker-pink{background:#fc5c7c}.prose .marker-blue{background:#72ccfd}
.prose .pen-red{color:#e71313;background:none}.prose .pen-green{color:#128a00;background:none}
.prose figure.image{display:table;clear:both;text-align:center;margin:1.5rem auto;max-width:100%}
.prose figure.image img{display:block;margin:0 auto;max-width:100%;min-width:50px;height:auto}
.prose figure.image>figcaption{display:table-caption;caption-side:bottom;word-break:break-word}
.prose figure.image_resized{display:block;box-sizing:border-box}
.prose figure.image_resized img{width:100%}
.prose img.image_resized{height:auto}
.prose .image-style-block-align-left{margin-left:0;margin-right:auto}
.prose .image-style-block-align-right{margin-right:0;margin-left:auto}
.prose .image-style-align-left{float:left;margin:.3rem 1.5rem 1rem 0}
.prose .image-style-align-right{float:right;margin:.3rem 0 1rem 1.5rem}
.prose .image-style-side{float:right;margin:.3rem 0 1rem 1.5rem;max-width:50%}
.prose img.image-style-align-left,.prose img.image-style-align-right{display:block}
.prose figure.table{margin:1.5rem 0;overflow-x:auto;max-width:100%}
.prose figure.table>table{width:100%}
.prose figure.table>figcaption{caption-side:bottom;text-align:center}
.prose .page-break{height:0;margin:0}
.prose .embed-responsive{position:relative;margin:1.5rem 0}
.prose .embed-responsive iframe{display:block;width:100%;aspect-ratio:16/9;height:auto}
.prose figure.media{margin:1.5rem 0}
.prose ul,.prose ol{padding-inline-start:1.6em}
.prose::after{content:"";display:table;clear:both}
@media (max-width:600px){.prose .image-style-align-left,.prose .image-style-align-right,.prose .image-style-side{float:none;margin:1rem auto;max-width:100%}}
.prose .page-break span{display:none}

/* ---- tags & related posts ---- */
.tags{list-style:none;display:flex;flex-wrap:wrap;gap:.4rem;padding:0;margin:2rem 0 0}
.tags a{display:inline-block;font-size:.85rem;padding:.2rem .7rem;border:1px solid var(--line);border-radius:999px;text-decoration:none;color:inherit}
.tags a:hover{border-color:var(--accent);color:var(--accent)}

/* ---- top bar (Settings > Design) ---- */
.topbar{background:var(--surface);border-bottom:1px solid var(--line);font-size:.88rem;line-height:1.4}
.topbar-in{display:grid;grid-template-columns:repeat(var(--tb-cols,1),minmax(0,1fr));gap:.4rem 1.5rem;padding-block:.45rem;align-items:center}
.tb-col p{margin:0}.tb-col a{text-underline-offset:.2em}
.tb-left{text-align:left}.tb-center{text-align:center}.tb-right{text-align:right}
@media (max-width:760px){.topbar-in{grid-template-columns:1fr}.tb-col,.tb-left,.tb-right{text-align:center}.tb-col:empty{display:none}}

/* ---- animations (Settings > Design) ---- */
@keyframes mc-fade{from{opacity:0}to{opacity:1}}
@keyframes mc-up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes mc-down{from{opacity:0;transform:translateY(-28px)}to{opacity:1;transform:none}}
@keyframes mc-left{from{opacity:0;transform:translateX(36px)}to{opacity:1;transform:none}}
@keyframes mc-right{from{opacity:0;transform:translateX(-36px)}to{opacity:1;transform:none}}
@keyframes mc-zoom{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.pa-fade .main{animation:mc-fade var(--anim-ms,600ms) ease both}
.pa-slide-up .main{animation:mc-up var(--anim-ms,600ms) ease both}
.pa-slide-down .main{animation:mc-down var(--anim-ms,600ms) ease both}
.pa-slide-left .main{animation:mc-left var(--anim-ms,600ms) ease both}
.pa-slide-right .main{animation:mc-right var(--anim-ms,600ms) ease both}
.pa-zoom .main{animation:mc-zoom var(--anim-ms,600ms) ease both}
/* element reveal: site.js sets data-rv only on elements it will animate, so no-JS visitors see everything */
[data-rv]{opacity:0;transition:opacity var(--anim-ms,600ms) ease,transform var(--anim-ms,600ms) ease!important}
[data-rv=slide-up]{transform:translateY(28px)}
[data-rv=slide-down]{transform:translateY(-28px)}
[data-rv=slide-left]{transform:translateX(36px)}
[data-rv=slide-right]{transform:translateX(-36px)}
[data-rv=zoom]{transform:scale(.94)}
[data-rv].rv-in{opacity:1;transform:none}
.anim-toggle{margin-top:.8rem;background:none;border:1px solid var(--line);color:var(--fg);border-radius:99px;padding:.25rem .8rem;font:inherit;font-size:.85rem;cursor:pointer}
.anim-toggle:hover{border-color:var(--accent)}
/* stop everything: visitor button (html.anim-off) or OS "reduce motion" */
html.anim-off *,html.anim-off *::before,html.anim-off *::after{animation:none!important;transition:none!important}
html.anim-off [data-rv]{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  .main{animation:none!important}
  [data-rv]{opacity:1!important;transform:none!important;transition:none!important}
}

/* ---- comments (Settings > Discussion) ---- */
.comments{max-width:var(--read);margin:3.5rem auto 0;padding-top:2rem;border-top:1px solid var(--line)}
.comments h2{font-size:1.5rem}
.comment-list,.comment-list .children{list-style:none;margin:0;padding:0}
.comment-list .children{margin-left:1.4rem;padding-left:1.1rem;border-left:2px solid var(--line)}
.comment{margin:1.4rem 0}
.comment>article{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:1rem 1.2rem}
.comment-head{display:flex;gap:.8rem;align-items:center;margin-bottom:.5rem}
.comment-head>div{display:flex;flex-wrap:wrap;gap:.1rem .7rem;align-items:baseline}
.avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;flex:none}
.avatar.initial{display:grid;place-items:center;background:var(--accent);color:var(--accent-fg);font:700 1rem var(--sans)}
.comment-author a{color:inherit}
.comment-date{font-size:.82rem;text-decoration:none}
.badge-staff{font:700 .65rem var(--sans);text-transform:uppercase;letter-spacing:.08em;background:var(--accent);color:var(--accent-fg);border-radius:99px;padding:.1rem .5rem}
.comment-body{overflow-wrap:anywhere}
.comment-reply{margin:.5rem 0 0;font-size:.9rem;font-weight:600}
.comment:target>article{outline:3px solid color-mix(in srgb,var(--accent) 45%,transparent)}
.respond{margin-top:2.5rem}
.respond h3 small{font-weight:400;margin-left:.6rem}
.comment-fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:0 1rem}
@media (max-width:600px){.comment-list .children{margin-left:.5rem;padding-left:.6rem}}

/* widgets: footer columns + blog sidebar */
.foot-widgets{display:grid;grid-template-columns:repeat(var(--fc,3),minmax(0,1fr));gap:2rem}
.foot-bottom{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1.25rem;border-top:1px solid var(--line)}
.foot-bottom p{margin:0}
.widget{margin-bottom:1.75rem;min-width:0}
.widget:last-child{margin-bottom:0}
.widget-title{font-size:1.05rem;margin:0 0 .75rem}
.widget-list{list-style:none;margin:0;padding:0}
.widget-list li{margin:.35rem 0}
.widget-posts li{display:flex;gap:.65rem;align-items:flex-start}
.widget-posts .wp-thumb img{width:56px;height:56px;object-fit:cover;border-radius:6px;display:block}
.widget-posts small{display:block}
.tag-cloud{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem}
.tag-cloud a{display:inline-block;padding:.15rem .6rem;border:1px solid var(--line);border-radius:999px;font-size:.88rem}
.widget-social{list-style:none;margin:0;padding:0}.widget-social li{margin:.35rem 0}
.widget-search{display:flex;gap:.4rem}.widget-search input{flex:1;min-width:0}
.main.has-sidebar{display:grid;grid-template-columns:minmax(0,1fr) 20rem;gap:3rem;align-items:start}
.main.has-sidebar.sb-left{grid-template-columns:20rem minmax(0,1fr)}
.main.has-sidebar.sb-left .sidebar{order:-1}
.main-col{min-width:0}
.sidebar{font-size:.95rem}
@media (max-width:900px){
  .foot-widgets{grid-template-columns:repeat(2,minmax(0,1fr))}
  .main.has-sidebar,.main.has-sidebar.sb-left{grid-template-columns:1fr}
  .main.has-sidebar.sb-left .sidebar{order:0}
}
@media (max-width:560px){.foot-widgets{grid-template-columns:1fr}}
.foot-links ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.4rem 1.2rem}.foot-links a{color:var(--fg)}
.author-box{margin:2rem 0;padding:1rem 1.2rem;border:1px solid var(--line);border-radius:10px;background:var(--surface)}
.author-box strong{display:block;margin-bottom:.3rem}.author-head{margin-bottom:1rem}.author-bio{margin-bottom:2.5rem}.author-posts-title{font-size:1.3rem;margin:0 0 1.2rem}

.share{display:flex;flex-wrap:wrap;gap:.4rem .9rem;align-items:center;margin:1.5rem 0;font-size:.95rem}.share a{text-decoration:none;border-bottom:1px solid currentColor}
.to-top{position:fixed;right:1rem;bottom:1rem;width:2.5rem;height:2.5rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--accent,#2563eb);color:#fff;text-decoration:none;font-size:1.2rem;box-shadow:0 2px 8px rgba(0,0,0,.25);z-index:50}
html{scroll-behavior:smooth}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.page-main{max-width:60rem;margin-inline:auto;padding-block:2rem}
.contact-form .check{display:flex;gap:.5rem;align-items:center}.contact-form .check input{width:auto}
/* breadcrumbs */
.breadcrumbs{font-size:.875rem;color:var(--muted);margin:0 0 1.2rem}.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:.25rem .5rem;list-style:none;margin:0;padding:0}
.breadcrumbs li+li::before{content:var(--bc-sep,'›');margin-right:.5rem;opacity:.6}.breadcrumbs a{color:inherit;text-decoration:none}.breadcrumbs a:hover{text-decoration:underline}
/* reading progress bar (look is set in Settings > Design) */
.read-progress{position:fixed;left:0;right:0;top:0;height:3px;z-index:120;pointer-events:none;background:transparent}
.read-progress span{display:block;height:100%;width:100%;background:var(--accent,#2563eb);transform:scaleX(0);transform-origin:left;transition:transform .08s linear}
/* admin bar (front end) */
.adminbar{position:sticky;top:0;z-index:130;display:flex;flex-wrap:wrap;gap:.25rem 1rem;align-items:center;padding:.35rem 1rem;background:#1f2937;color:#fff;font-size:.8125rem}
.adminbar a{color:#fff;text-decoration:none;opacity:.9}.adminbar a:hover{opacity:1;text-decoration:underline}.adminbar-edit{margin-left:auto}
/* cookie consent */
.cc{position:fixed;z-index:200;background:var(--bg,#fff);color:var(--text,#111);box-shadow:0 8px 30px rgba(0,0,0,.25);border:1px solid rgba(0,0,0,.1);max-width:100%}
.cc[hidden]{display:none}
.cc-box{padding:1rem 1.25rem}.cc-box h2{font-size:1.05rem;margin:0 0 .35rem}.cc-box p{margin:.25rem 0 .75rem;font-size:.9rem}
.cc-bottom{left:0;right:0;bottom:0}.cc-bottom-left{left:1rem;bottom:1rem;width:min(24rem,calc(100% - 2rem));border-radius:.6rem}
.cc-bottom-right{right:1rem;bottom:1rem;width:min(24rem,calc(100% - 2rem));border-radius:.6rem}
.cc-center{left:50%;top:50%;transform:translate(-50%,-50%);width:min(30rem,calc(100% - 2rem));border-radius:.6rem}
.cc-actions,.cc-prefs{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.cc-prefs{margin-bottom:.75rem}.cc-row{display:flex;gap:.35rem;align-items:center;margin-right:.75rem}
.cc .btn.link{background:none;border:0;text-decoration:underline;padding:.25rem}
.cc-reopen{position:fixed;left:.75rem;bottom:.75rem;z-index:150;border:1px solid rgba(0,0,0,.15);background:var(--bg,#fff);border-radius:50%;width:2.25rem;height:2.25rem;cursor:pointer}
.cc-reopen[hidden]{display:none}
/* newsletter, live search, flash */
.newsletter{display:grid;gap:.5rem}.newsletter input[type=email],.newsletter input[name=nl_name]{width:100%}
.flash-bar{margin:0;border-radius:0;text-align:center}
.live-results{position:absolute;left:0;right:0;top:100%;z-index:60;background:var(--bg,#fff);border:1px solid rgba(0,0,0,.15);border-radius:.4rem;box-shadow:0 8px 24px rgba(0,0,0,.15);overflow:hidden}
.live-results[hidden]{display:none}.live-results a{display:block;padding:.5rem .75rem;color:inherit;text-decoration:none}.live-results a:hover,.live-results a:focus{background:rgba(127,127,127,.15)}.live-results small{opacity:.6}
/* contact form builder */
.cf-grid{display:flex;flex-wrap:wrap;gap:.9rem 1rem;margin:.5rem 0 1rem}.cf{flex:1 1 100%;min-width:0;border:0;padding:0;margin:0}
.cf-w-half{flex-basis:calc(50% - .5rem)}.cf-w-third{flex-basis:calc(33.333% - .67rem)}.cf-w-twothirds{flex-basis:calc(66.666% - .33rem)}
@media (max-width:640px){.cf-w-half,.cf-w-third,.cf-w-twothirds{flex-basis:100%}}
.cf legend{font-weight:600;padding:0;margin-bottom:.25rem}.cf label.check{display:flex;gap:.5rem;align-items:center;font-weight:400}.cf small{display:block;margin-top:.2rem}.cf-heading{font-size:1.15rem;margin:.5rem 0 0}

/* progressive blur (Settings > Design) */
.pblur{position:fixed;left:0;bottom:0;width:100%;height:var(--pblur-h,15vh);pointer-events:none;z-index:19;transform:scaleY(-1)}
.pblur>div{position:absolute;inset:0;pointer-events:none}
.pblur{opacity:1;transition:opacity .35s ease}.pblur.is-hidden{opacity:0}
@media print{.pblur{display:none}}

/* smooth scroll (Lenis) */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:hidden}
.lenis.lenis-smooth iframe{pointer-events:none}

/* background videos (Settings > Design > Element backgrounds) */
.has-mbg{isolation:isolate}.has-mbg-rel{position:relative}
.mbg-video{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:center/cover no-repeat}
.mbg-video video{display:block;width:100%;height:100%;object-fit:cover}
.mbg-video::after{content:"";position:absolute;inset:0}
body>.mbg-video{position:fixed}
@media print{.mbg-video{display:none}}

/* animated grain (Settings > Design) */
.mgrain{position:fixed;top:0;left:0;width:100%;height:100vh;z-index:1111;pointer-events:none}
@media print{.mgrain{display:none}}

/* ===== content effects (Settings > Design): progress bars, animated H1, rotating text ===== */
.pbars{--pb-c:var(--accent,#2563eb);--pb-t:color-mix(in srgb,currentColor 14%,transparent);margin:1.5rem 0}
.pb-title{font-weight:700;font-size:1.1rem;margin-bottom:.9rem}
.pb-list{display:grid;gap:1.1rem}
.pb-head{display:flex;gap:.6rem;align-items:baseline;margin-bottom:.4rem}
.pb-label{font-weight:600}.pb-note{opacity:.6;font-size:.88em}
.pb-val{margin-left:auto;font-weight:700;font-variant-numeric:tabular-nums}
/* bar + wave */
.pb-track{height:12px;border-radius:99px;background:var(--pb-t);overflow:hidden}
.pb-fill{position:relative;overflow:hidden;height:100%;width:calc(var(--p)*1%);border-radius:inherit;background-color:var(--pb-c)}
.pbs-bar .pb-fill{background-image:repeating-linear-gradient(45deg,rgba(255,255,255,.22) 0 10px,transparent 10px 20px);background-size:28px 28px;animation:pb-stripes .9s linear infinite}
.pbs-bar .pb-fill::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);animation:pb-shine 2.8s ease-in-out 1.6s infinite}
.pbs-wave .pb-track{height:18px}
.pbs-wave .pb-fill::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 125%,rgba(255,255,255,.38) 0 40%,transparent 42%) 0 0/24px 100%;animation:pb-wave 1.2s linear infinite}
@keyframes pb-stripes{to{background-position:28px 0}}
@keyframes pb-shine{0%{transform:translateX(-120%)}55%,100%{transform:translateX(120%)}}
@keyframes pb-wave{to{background-position:24px 0}}
.pbars.pb-ready .pb-fill{width:0;transition:width var(--pb-ms,1400ms) cubic-bezier(.22,1,.36,1) calc(var(--i)*120ms)}
.pbars.pb-ready.is-in .pb-fill{width:calc(var(--p)*1%)}
/* ring */
.pbs-ring .pb-list{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:1.5rem}
.pbs-ring .pb-item{position:relative;text-align:center}
.pb-svg{display:block;width:100%;max-width:130px;height:auto;margin:0 auto;overflow:visible;shape-rendering:geometricPrecision}
.pb-rt,.pb-rf{fill:none;stroke-width:8;shape-rendering:geometricPrecision}
.pb-rt{stroke:var(--pb-t)}
.pb-rf{stroke:var(--pb-c);stroke-linecap:round;stroke-dasharray:100 100;stroke-dashoffset:calc(100 - var(--p))}
.pb-mid{position:absolute;top:0;left:50%;width:100%;max-width:130px;aspect-ratio:1;transform:translateX(-50%);display:grid;place-items:center;font-size:1.5rem}
.pb-mid .pb-val{margin:0}
.pb-cap{display:flex;flex-direction:column;margin-top:.5rem}
.pbars.pbs-ring.pb-ready .pb-rf{stroke-dashoffset:100;transition:stroke-dashoffset var(--pb-ms,1400ms) cubic-bezier(.22,1,.36,1) calc(var(--i)*120ms)}
.pbars.pbs-ring.pb-ready.is-in .pb-rf{stroke-dashoffset:calc(100 - var(--p))}
/* dots */
.pb-dots{display:flex;flex-wrap:wrap;gap:5px}
.pb-dots i{width:12px;height:12px;border-radius:50%;background:var(--pb-t)}
.pb-dots i.on{background:var(--pb-c)}
.pbars.pbs-dots.pb-ready .pb-dots i.on{background:var(--pb-t);transform:scale(.55);transition:background .3s,transform .4s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(var(--i)*120ms + var(--d)*60ms)}
.pbars.pbs-dots.pb-ready.is-in .pb-dots i.on{background:var(--pb-c);transform:none}
/* final state without motion */
@media (prefers-reduced-motion:reduce){
  .pbars .pb-fill,.pbars .pb-rf,.pbars .pb-dots i{transition:none!important;animation:none!important}
  .pbars.pb-ready .pb-fill{width:calc(var(--p)*1%)}
  .pbars.pb-ready .pb-rf{stroke-dashoffset:calc(100 - var(--p))}
  .pbars.pb-ready .pb-dots i.on{background:var(--pb-c);transform:none}
  .pb-fill::before,.pb-fill::after{animation:none!important}
}
html.anim-off .pbars.pb-ready .pb-fill{width:calc(var(--p)*1%)}
html.anim-off .pbars.pb-ready .pb-rf{stroke-dashoffset:calc(100 - var(--p))}
html.anim-off .pbars.pb-ready .pb-dots i.on{background:var(--pb-c);transform:none}
@media print{.pbars.pb-ready .pb-fill{width:calc(var(--p)*1%)}.pbars.pb-ready .pb-rf{stroke-dashoffset:calc(100 - var(--p))}}

/* animated H1: words rise one by one, last word gets a drawn underline */
.h1-words .mw{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.h1-words .mw>span{display:inline-block;transform:translateY(110%) rotate(5deg);transform-origin:0 100%;opacity:0;transition:transform .9s cubic-bezier(.19,1,.22,1),opacity .6s ease;transition-delay:calc(var(--i)*90ms)}
.h1-fx.is-in .mw>span{transform:none;opacity:1}
.h1-hl{position:relative;display:inline-block}
.h1-hl::after{content:"";position:absolute;left:-2%;bottom:-.28em;width:104%;height:.3em;pointer-events:none;background:var(--h1u,var(--accent,#97e14d));
  -webkit-mask:url(../img/h1-underline.svg) center/100% 100% no-repeat;mask:url(../img/h1-underline.svg) center/100% 100% no-repeat;
  clip-path:inset(-10% 100% -10% 0);transition:clip-path 1s cubic-bezier(.65,0,.35,1) .9s}
.h1-under:not(.h1-words) .h1-hl::after{transition-delay:.15s}
.h1-fx.is-in .h1-hl::after{clip-path:inset(-10% 0 -10% 0)}
@media (prefers-reduced-motion:reduce){.h1-words .mw>span{transition:none;transform:none;opacity:1}.h1-hl::after{transition:none;clip-path:none}}
html.anim-off .h1-words .mw>span{transform:none;opacity:1}
html.anim-off .h1-hl::after{clip-path:none}

/* rotating text: [rotate a | b | c] */
.fx-rotate{display:inline-grid;overflow:hidden;vertical-align:top;height:1.5em;height:1lh;line-height:inherit}
.fx-rotate>span{grid-area:1/1;white-space:nowrap;transform:translateY(100%);opacity:0;transition:transform .7s cubic-bezier(.65,0,.35,1),opacity .5s ease}
.fx-rotate>span.is-active{transform:none;opacity:1}
.fx-rotate>span.is-prev{transform:translateY(-100%);opacity:0}

.cc-actions .btn{white-space:nowrap}

/* ===== One-page mode ===== */
html:has(.op){scroll-behavior:smooth}
.op-sec{scroll-margin-top:var(--op-offset,72px);padding:clamp(40px,8vw,110px) 0;position:relative}
.op-sec+.op-sec{border-top:1px solid color-mix(in srgb,currentColor 12%,transparent)}
.op[data-full="1"] .op-sec{min-height:100svh;display:flex;flex-direction:column;justify-content:center}
.op-title{font-size:clamp(28px,4.5vw,56px);line-height:1.1;margin:0 0 .6em}
.op-hero{overflow:hidden;border-radius:var(--radius,12px);margin:0 0 1.5em}
.op-hero img{display:block;width:100%;height:auto;will-change:transform}
.op[data-parallax="1"] .op-hero img{transform:translate3d(0,var(--py,0px),0) scale(1.18)}
html.op-snap{scroll-snap-type:y proximity}
html.op-snap .op-sec{scroll-snap-align:start}
.op-dots{position:fixed;right:18px;top:50%;transform:translateY(-50%);z-index:20;display:flex;flex-direction:column;gap:12px}
.op-dots a{position:relative;width:12px;height:12px;border-radius:50%;border:2px solid var(--accent,#97E14D);background:transparent;transition:background .25s,transform .25s}
.op-dots a.is-active,.op-dots a:hover{background:var(--accent,#97E14D);transform:scale(1.25)}
.op-dots a span{position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;font-size:13px;padding:3px 9px;border-radius:6px;background:rgba(0,0,0,.78);color:#fff;opacity:0;pointer-events:none;transition:opacity .2s}
.op-dots a:hover span,.op-dots a:focus-visible span{opacity:1}
nav.primary a.op-active{color:var(--accent,#97E14D)}
@media(max-width:700px){.op-dots{display:none}}

/* title splitting */
.op-title .op-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em;white-space:pre}
.op-title .op-w>span{display:inline-block}
.op-title .op-nb{display:inline-block;white-space:nowrap}

/* animations (only when JS runs and motion is allowed) */
@media (scripting:enabled) and (prefers-reduced-motion:no-preference){
  .op-sec[data-op-anim="fade-up"]{--f:translate3d(0,48px,0)}
  .op-sec[data-op-anim="fade-down"]{--f:translate3d(0,-48px,0)}
  .op-sec[data-op-anim="fade-left"]{--f:translate3d(-70px,0,0)}
  .op-sec[data-op-anim="fade-right"]{--f:translate3d(70px,0,0)}
  .op-sec[data-op-anim="zoom-in"]{--f:scale(.82)}
  .op-sec[data-op-anim="zoom-out"]{--f:scale(1.18)}
  .op-sec[data-op-anim="blur-in"]{--f:translate3d(0,24px,0);--b:blur(16px)}
  .op-sec[data-op-anim="clip-up"]{--cp:inset(100% 0 0 0);--f:translate3d(0,24px,0)}
  .op-sec[data-op-anim="clip-left"]{--cp:inset(0 100% 0 0)}
  .op-sec[data-op-anim="flip-x"]{--f:perspective(900px) rotateX(-70deg);--o:50% 0}
  .op-sec[data-op-anim="rotate-in"]{--f:translate3d(0,40px,0) rotate(-7deg) scale(.94)}
  .op-sec[data-op-anim="skew-up"]{--f:translate3d(0,56px,0) skewY(7deg)}
  .op-sec[data-op-anim="bounce"]{--f:translate3d(0,70px,0);--ease:cubic-bezier(.34,1.56,.64,1)}
  .op-sec[data-op-anim]:not([data-op-anim="none"]) :is(.op-a,.op-k){
    opacity:0;transform:var(--f,none);filter:var(--b,none);clip-path:var(--cp,inset(0));transform-origin:var(--o,50% 50%);
    transition:opacity var(--op-ms,800ms) ease,transform var(--op-ms,800ms) var(--ease,cubic-bezier(.19,1,.22,1)),filter var(--op-ms,800ms) ease,clip-path var(--op-ms,800ms) cubic-bezier(.65,0,.35,1);
    transition-delay:var(--d,0ms)}
  .op-head{--d:0ms}.op-hero{--d:120ms}.op-prose{--d:220ms}
  .op-k{--d:calc(var(--k,0)*var(--op-stagger,90ms) + 200ms)}
  .op-sec.is-in[data-op-anim]:not([data-op-anim="none"]) :is(.op-a,.op-k){opacity:1;transform:none;filter:none;clip-path:inset(0)}
  .op-title.op-split .op-w>span,.op-title.op-split .op-c{transform:translateY(112%);transition:transform var(--op-ms,800ms) cubic-bezier(.19,1,.22,1);transition-delay:calc(var(--i)*var(--op-stagger,90ms)/2 + 80ms)}
  .op-title.op-split .op-c{display:inline-block}
  .op-sec.is-in .op-title.op-split .op-w>span,.op-sec.is-in .op-title.op-split .op-c{transform:none}
  .op-title.op-split{overflow:hidden;padding-bottom:.14em}
  .op-title.op-split .op-w{overflow:visible}
}

/* one-page: sections run edge to edge so every section background is full width */
html:has(.op){overflow-x:clip}
.page-main:has(.op){max-width:none;padding-block:0}
.op{width:100vw;margin-inline:calc(50% - 50vw)}
.op-sec{padding-inline:max(1.25rem,calc((100vw - 60rem)/2));background-size:cover;background-position:center}
.op-sec+.op-sec{border-top:0}

/* animated background images (JS layer inside the element) */
.mbg-img{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.mbg-img::before,.mbg-img::after{content:"";position:absolute;inset:0;z-index:1}
.mbg-in{position:absolute;inset:-6%;background-repeat:no-repeat;will-change:transform;z-index:0}
body>.mbg-img{position:fixed}
@keyframes mbg-kb{from{transform:scale(1) translate3d(0,0,0)}to{transform:scale(1.16) translate3d(-2.5%,-1.5%,0)}}
@keyframes mbg-pan{from{transform:scale(1.1) translate3d(-4%,0,0)}to{transform:scale(1.1) translate3d(4%,0,0)}}
@keyframes mbg-dr{from{transform:scale(1.12) translate3d(-3%,-3%,0)}to{transform:scale(1.12) translate3d(3%,3%,0)}}
@media (prefers-reduced-motion:no-preference){
  .mbg-kenburns .mbg-in{animation:mbg-kb var(--mbg-d,20s) ease-in-out infinite alternate}
  .mbg-pan .mbg-in{animation:mbg-pan var(--mbg-d,20s) ease-in-out infinite alternate}
  .mbg-drift .mbg-in{animation:mbg-dr var(--mbg-d,20s) ease-in-out infinite alternate}
  .mbg-once .mbg-in{animation-iteration-count:1;animation-direction:normal;animation-fill-mode:forwards}
  .mbg-wait .mbg-in{animation-play-state:paused}
  /* scroll-linked: --sp (0..1) comes from the page script, no timer */
  .mbg-scroll .mbg-in{animation:none;will-change:transform}
  .mbg-scroll.mbg-kenburns .mbg-in{transform:scale(calc(1 + .16*var(--sp,0))) translate3d(calc(-2.5%*var(--sp,0)),calc(-1.5%*var(--sp,0)),0)}
  .mbg-scroll.mbg-pan .mbg-in{transform:scale(1.1) translate3d(calc(-4% + 8%*var(--sp,0)),0,0)}
  .mbg-scroll.mbg-drift .mbg-in{transform:scale(1.12) translate3d(calc(-3% + 6%*var(--sp,0)),calc(-3% + 6%*var(--sp,0)),0)}
  .mbg-parallax .mbg-in{inset:-14% 0;transform:translate3d(0,var(--py,0px),0)}
}
@media print{.mbg-img{display:none}}

/* moving gradient layer */
.mbg-grad{position:absolute;inset:0;z-index:-1;pointer-events:none;background-repeat:no-repeat}
.mbg-grad::after{content:"";position:absolute;inset:0}
body>.mbg-grad{position:fixed}
.mbg-grad.mbg-scroll{background-position:calc(var(--sp,0)*100%) calc(var(--sp,0)*100%);will-change:background-position}
.mbg-grad.mbg-once:not(.mbg-wait){animation-iteration-count:1}
@media print{.mbg-grad{display:none}}


/*Buttons*/


.btns {
    
    text-align:center;
    position: relative;
    padding: 14px;
    border: none;
    cursor: pointer;
    font-size: 22px;
    border-radius: 8px;
    overflow: hidden;
    color: #fff;
    background:#0e2e34;
    transition: 0.3s ease;
    z-index: 0;
    text-decoration:none!important;
    display:block;
    margin:0 auto;
    transition:.7s;
}

.btns:hover {
 box-shadow: rgba(50, 50, 93, 0.45) 0px 13px 27px -5px, rgba(0, 0, 0, 0.5) 0px 8px 16px -8px;
}

 
.btns span {
    position: relative;
    z-index: 2;
}

.btns::before,
.btns::after {
    z-index: 1;
}

.cta::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
    height: 3px;
    background: #06b6d4;
    transition: 0.3s;
}
.cta:hover::after {
    width: 100%;
    left: 0;
}