/* 3iCMS element styles — generated, do not edit by hand. */
/* set:6e613a177bccf59b49d0b0f708158bac */

/* --- accordion --- */
.ac-title{margin:0 0 16px;font-size:22px}
.ac-item{border:1px solid var(--line);border-radius:9px;margin-bottom:10px;background:var(--surface-2);overflow:hidden}
.ac-item[open]{border-color:var(--accent)}
.ac-q{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 18px;cursor:pointer;
  font-weight:600;font-size:16.5px;line-height:1.4;list-style:none}
.ac-q::-webkit-details-marker{display:none}
.ac-q:hover{color:var(--accent)}
.ac-chev{flex:0 0 auto;width:18px;height:18px;color:var(--ink-3);transition:transform .2s}
.ac-item[open] .ac-chev{transform:rotate(180deg);color:var(--accent)}
.ac-a{padding:0 18px 16px;line-height:1.7}
.ac-a>:first-child{margin-top:0}
.ac-a>:last-child{margin-bottom:0}
.ac-a p{margin:0 0 1em}


/* --- article_box --- */
.artbox{background:var(--surface-2);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.artbox-media{display:block;overflow:hidden}
.artbox-media img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .35s}
.artbox-media:hover img{transform:scale(1.05)}
.artbox-body{padding:16px 20px 18px}
.artbox-slogan{margin:0 0 4px;font-size:12.5px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent)}
.artbox-title{margin:0;font-size:18px;line-height:1.35}
.artbox-title a{color:inherit;text-decoration:none}
.artbox-title a:hover{color:var(--accent)}


/* --- before_after --- */
.ba{position:relative;overflow:hidden;border-radius:14px}
.ba img{display:block;width:100%}
.ba-before{position:absolute;inset:0;width:var(--ba-pos,50%);overflow:hidden}
.ba-before img{width:auto;height:100%;max-width:none}
.ba-handle{position:absolute;top:0;bottom:0;left:var(--ba-pos,50%);width:3px;background:#fff;
  box-shadow:0 0 12px rgba(0,0,0,.4);pointer-events:none}
.ba-handle::after{content:"⇔";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:38px;height:38px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;
  font-size:17px;font-weight:700}
.ba .ba-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}


/* --- block --- */
/* A block brings its own sections, which already carry .sec styling. The only
   thing needed here is to stop the element wrapper adding a second layer of
   spacing around them. */
.el-block > .sec:first-child { margin-top: 0; }
.el-block > .sec:last-child  { margin-bottom: 0; }


/* --- blockquote --- */
.bq{position:relative;margin:0;padding:28px 32px 28px 64px;border-left:3px solid var(--accent);background:var(--surface-2);border-radius:0 12px 12px 0}
.bq-mark{position:absolute;left:20px;top:26px;color:var(--accent);opacity:.7}
.bq-mark .icon{width:26px;height:26px;fill:currentColor;stroke:none}
.bq-text{margin:0;font-size:clamp(17px,1.6vw,21px);line-height:1.6;font-style:italic;color:var(--ink)}
.bq-by{margin-top:14px;font-size:14px;color:var(--ink-3)}
.bq-by cite{font-style:normal;font-weight:600;color:var(--ink-2)}
.bq-by a{text-decoration:none}
.bq-by a:hover cite{color:var(--accent)}


/* --- blog_news --- */
.bn-title{margin:0 0 18px;font-size:22px}
.bn-list{display:grid;gap:16px}
.bn-item{display:grid;grid-template-columns:96px 1fr;gap:16px;align-items:start}
.bn-item:not(:has(.bn-media)){grid-template-columns:1fr}
.bn-media img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px;display:block}
.bn-date{display:block;font-size:12.5px;color:var(--ink-3);margin-bottom:3px}
.bn-head{margin:0;font-size:16px;line-height:1.4}
.bn-head a{color:inherit;text-decoration:none}
.bn-head a:hover{color:var(--accent)}
.bn-excerpt{margin:6px 0 0;font-size:14.5px;color:var(--ink-2);line-height:1.6}
.bn-featured .bn-first{grid-template-columns:1fr;padding-bottom:16px;border-bottom:1px solid var(--line)}
.bn-featured .bn-first .bn-media img{aspect-ratio:16/9;border-radius:10px}
.bn-featured .bn-first .bn-head{font-size:21px}
.bn-more{margin:20px 0 0}


/* --- blog_slider --- */
.bsl-title{margin:0 0 18px;font-size:22px}
.bsl-item{flex:0 0 calc((100% - 2 * var(--strip-gap,24px)) / 3);background:var(--surface-2);border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}
.bsl-flat .bsl-item{background:none;border:0;border-radius:0}
.bsl-media img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}
.bsl-flat .bsl-media img{border-radius:10px}
.bsl-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px;flex:1}
.bsl-flat .bsl-body{padding:14px 0 0}
.bsl-date{font-size:12.5px;color:var(--ink-3)}
.bsl-head{margin:0;font-size:17px;line-height:1.4}
.bsl-head a{color:inherit;text-decoration:none}
.bsl-head a:hover{color:var(--accent)}
.bsl-excerpt{margin:0;font-size:14.5px;color:var(--ink-2);line-height:1.6}
.bsl-more{margin-top:auto;padding-top:8px;font-weight:600;font-size:14px;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.bsl-more .icon{width:14px;height:14px}
@media(max-width:900px){.bsl-item{flex-basis:calc((100% - var(--strip-gap,24px)) / 2)}}
@media(max-width:600px){.bsl-item{flex-basis:86%}}


/* --- blog_teaser --- */
.bt-title{margin:0 0 18px;font-size:22px}
.bt-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:180px;gap:0}
.bt-gap .bt-grid{gap:12px}
.bt-first{grid-column:span 2;grid-row:span 2}
.bt-item{position:relative;overflow:hidden;background:var(--ink)}
.bt-gap .bt-item{border-radius:10px}
.bt-link{display:block;position:absolute;inset:0;color:#fff;text-decoration:none}
.bt-media,.bt-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s}
.bt-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.bt-link:hover .bt-media img{transform:scale(1.05)}
.bt-body{position:absolute;left:0;right:0;bottom:0;padding:18px;background:linear-gradient(to top,rgba(0,0,0,.78),rgba(0,0,0,0))}
.bt-date{display:block;font-size:12px;opacity:.8;margin-bottom:4px}
.bt-head{margin:0;font-size:15px;line-height:1.35;color:#fff}
.bt-first .bt-head{font-size:clamp(19px,2vw,26px)}
@media(max-width:900px){.bt-grid{grid-template-columns:repeat(2,1fr)}.bt-first{grid-column:span 2;grid-row:span 1;min-height:280px}}
@media(max-width:520px){.bt-grid{grid-template-columns:1fr}.bt-first{grid-column:span 1}}


/* --- button --- */
/* Button — the element's own CSS, and nothing more.
 *
 * The base `.btn` lives in site.css, where it is built out of the theme's
 * tokens: --btn-py, --btn-px, --btn-size, --btn-radius, --btn-weight,
 * --btn-case, --btn-bg, --btn-fg, --btn-bw, --btn-bc, --btn-shadow.
 *
 * This file used to restate all of that with fixed values — padding:13px 24px,
 * font-size:15.5px, border-radius:7px, background:var(--accent) — and
 * elements.css loads after site.css, so every one of those hardcoded numbers
 * won. Theme options → Buttons had a complete panel of controls that changed
 * the CSS file and then changed nothing on the page: the buttons stayed the
 * same size whatever anybody set, which is what "bahut bade button" was.
 *
 * So the sizes are multipliers of the theme's own padding now, not
 * replacements for it. Medium is the theme setting itself and therefore has no
 * rule at all — if a size class has to restate a value, it is overriding the
 * theme rather than scaling it.
 */
.btn-wrap{display:block}

/* Sizes, relative to whatever the theme says a button is. */
.btn-sm{padding:calc(var(--btn-py, 13px) * .68) calc(var(--btn-px, 24px) * .66);
        font-size:calc(var(--btn-size, 15px) - 1.5px)}
.btn-lg{padding:calc(var(--btn-py, 13px) * 1.25) calc(var(--btn-px, 24px) * 1.33);
        font-size:calc(var(--btn-size, 15px) + 1.5px)}
.btn-xl{padding:calc(var(--btn-py, 13px) * 1.55) calc(var(--btn-px, 24px) * 1.75);
        font-size:calc(var(--btn-size, 15px) + 3.5px)}

.btn-ghost:hover{gap:13px;filter:none}

.btn-full{display:flex;width:100%;justify-content:center}
.btn-icon{width:1.05em;height:1.05em}

.ta-center .btn-wrap,.btn-wrap.ta-center{text-align:center}
.btn-wrap.ta-right{text-align:right}


/* --- chart --- */
.chart{text-align:center}
.chart-ring{position:relative;width:132px;margin:0 auto}
.chart-ring svg{display:block;width:100%;transform:rotate(-90deg)}
.chart-track{stroke:var(--line)}
.chart-bar{stroke:var(--chart-color,var(--accent));stroke-linecap:round;transition:stroke-dashoffset 1.1s ease}
.chart-middle{position:absolute;inset:0;display:grid;place-items:center}
.chart-middle .icon{width:30px;height:30px;color:var(--chart-color,var(--accent))}
.chart-middle img{width:38px;height:38px;object-fit:contain}
.chart-pct{font-size:22px;font-weight:700;letter-spacing:-.02em}
.chart-title{margin:12px 0 0;font-weight:600}


/* --- clients --- */
.cl{list-style:none;margin:0;padding:0;display:grid;gap:24px;align-items:center}
.cl-c2{grid-template-columns:repeat(2,1fr)}.cl-c3{grid-template-columns:repeat(3,1fr)}.cl-c4{grid-template-columns:repeat(4,1fr)}
.cl-c5{grid-template-columns:repeat(5,1fr)}.cl-c6{grid-template-columns:repeat(6,1fr)}
.cl-item{display:flex;align-items:center;justify-content:center;min-height:80px}
.cl-item a{display:block}
.cl-item img{max-width:100%;max-height:70px;width:auto;height:auto;object-fit:contain;transition:filter .25s,opacity .25s}
.cl-tiles{gap:1px;background:var(--line);border:1px solid var(--line)}
.cl-tiles .cl-item{background:var(--paper);padding:24px;min-height:120px}
.cl-grey .cl-item img{filter:grayscale(1);opacity:.6}
.cl-grey .cl-item:hover img{filter:none;opacity:1}
@media(max-width:900px){.cl-c5,.cl-c6{grid-template-columns:repeat(4,1fr)}}
@media(max-width:640px){.cl{grid-template-columns:repeat(3,1fr)!important}}
@media(max-width:420px){.cl{grid-template-columns:repeat(2,1fr)!important}}


/* --- clients_slider --- */
.cls-title{margin:0 0 18px;font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3);text-align:center}
.cls-item{flex:0 0 calc((100% - 5 * var(--strip-gap,24px)) / 6);display:flex;align-items:center;justify-content:center;min-height:80px}
.cls-item img{max-width:100%;max-height:64px;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.65;transition:filter .25s,opacity .25s}
.cls-item:hover img{filter:none;opacity:1}
@media(max-width:900px){.cls-item{flex-basis:calc((100% - 3 * var(--strip-gap,24px)) / 4)}}
@media(max-width:600px){.cls-item{flex-basis:calc((100% - var(--strip-gap,24px)) / 2)}}


/* --- contact_box --- */
.cbx{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:26px 28px;position:relative;overflow:hidden;background-size:cover;background-position:center}
.cbx-img{color:#fff;border:0}
.cbx-img::before{content:"";position:absolute;inset:0;background:rgba(10,14,20,.62)}
.cbx>*{position:relative}
.cbx-title{margin:0 0 14px;font-size:19px}
.cbx-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.cbx-list li{display:flex;align-items:flex-start;gap:12px;line-height:1.55}
.cbx-list .icon{flex:0 0 18px;width:18px;height:18px;margin-top:3px;color:var(--accent)}
.cbx-img .icon{color:#fff}
.cbx-list a{color:inherit;text-decoration:none}
.cbx-list a:hover{color:var(--accent);text-decoration:underline}


/* --- countdown --- */
.cdown{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cdown-cell{min-width:86px;text-align:center;background:var(--surface-2);border:1px solid var(--line);
  border-radius:12px;padding:14px 10px}
.cdown-n{display:block;font-size:34px;font-weight:800;letter-spacing:-.02em;line-height:1;font-style:normal;
  font-family:var(--font-heading,inherit);color:var(--accent)}
.cdown-cell i{display:block;margin-top:6px;font-size:12px;letter-spacing:.08em;text-transform:uppercase;
  font-style:normal;color:var(--ink-3)}
.cdown-over{font-size:22px;font-weight:700;text-align:center}


/* --- counter --- */
.cn{display:grid;gap:24px;text-align:center}
.cn-c1{grid-template-columns:1fr}
.cn-c2{grid-template-columns:repeat(2,1fr)}
.cn-c3{grid-template-columns:repeat(3,1fr)}
.cn-c4{grid-template-columns:repeat(4,1fr)}
.cn-divided .cn-item+.cn-item{border-left:1px solid var(--line)}
.cn-icon{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:11px;
  background:var(--accent-soft,#ddeeef);color:var(--cn-icon,var(--accent));margin-bottom:12px}
.cn-img{background:none;width:56px;height:56px}
.cn-img img{width:100%;height:100%;object-fit:contain}
.cn-horizontal{text-align:left}
.cn-horizontal .cn-item{display:flex;align-items:center;gap:16px}
.cn-horizontal .cn-icon{margin-bottom:0;flex:0 0 auto}
.cn-prefix{font-style:normal;font-size:.62em;margin-right:2px}
.cn-icon .icon{width:22px;height:22px}
.cn-number{font-size:clamp(30px,4.4vw,46px);font-weight:700;letter-spacing:-.03em;line-height:1;
  font-variant-numeric:tabular-nums;color:var(--accent)}
.cn-number i{font-style:normal;font-size:.62em;margin-left:2px}
.cn-label{margin:9px 0 0;font-size:14.5px;color:var(--ink-3);line-height:1.5}
@media(max-width:640px){.cn-c3,.cn-c4{grid-template-columns:repeat(2,1fr)}.cn-divided .cn-item{border-left:0!important}}


/* --- cta --- */
.cta{background:var(--cta-bg,var(--accent));color:var(--cta-fg,#fff);border-radius:var(--cta-radius,14px);
  padding:clamp(26px,4vw,46px);display:flex;gap:26px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta-center{flex-direction:column;text-align:center}
.cta-icon{flex:0 0 auto;width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center}
.cta-icon .icon{width:26px;height:26px}
.cta-body{flex:1 1 320px}
.cta-title{margin:0;font-size:clamp(22px,3vw,32px);letter-spacing:-.02em;line-height:1.25;color:inherit;text-wrap:balance}
.cta-text{margin:10px 0 0;opacity:.9;line-height:1.6;max-width:62ch}
.cta-center .cta-text{margin-left:auto;margin-right:auto}
.cta-actions{display:flex;gap:12px;flex-wrap:wrap;flex:0 0 auto}
.cta .btn-solid{background:#fff;color:var(--cta-bg,var(--accent))}
.cta .btn-outline{border-color:currentColor;color:inherit}
.cta .btn-outline:hover{background:rgba(255,255,255,.15);color:inherit;filter:none}


/* --- divider --- */
.dv-space{height:var(--dv-h,40px)}
.dv-line,.dv-dots{height:var(--dv-h,40px);display:flex;align-items:center}
.dv-line::before{content:"";display:block;width:var(--dv-w,100%);height:1px;background:var(--dv-color,var(--line))}
.dv-dots::before{content:"";display:block;width:var(--dv-w,100%);height:3px;
  background-image:radial-gradient(circle,var(--dv-color,var(--line)) 1.5px,transparent 1.6px);background-size:9px 3px;background-repeat:repeat-x}
.dv-zigzag{height:var(--dv-h,40px);display:flex;align-items:center}
.dv-zigzag::before{content:"";display:block;width:var(--dv-w,100%);height:8px;
  background:linear-gradient(135deg,var(--dv-color,var(--line)) 25%,transparent 25%) -4px 0/8px 8px,linear-gradient(225deg,var(--dv-color,var(--line)) 25%,transparent 25%) -4px 0/8px 8px}
.dv-center{justify-content:center}.dv-right{justify-content:flex-end}.dv-left{justify-content:flex-start}
.dv-icon{display:flex;align-items:center;gap:14px;height:var(--dv-h,40px);width:var(--dv-w,100%);margin:0 auto}
.dv-icon.dv-icon{}
.dv-icon .dv-rule{flex:1;height:1px;background:var(--dv-color,var(--line))}
.dv-icon .dv-icon,.dv .dv-icon .icon{width:20px;height:20px;color:var(--dv-color,var(--accent))}
.dv.dv-icon{display:flex;align-items:center;gap:14px;height:var(--dv-h,40px)}


/* --- fancy_divider --- */
.fdiv{position:relative;overflow:hidden}
.fdiv svg{position:absolute;inset:0;width:100%;height:100%;display:block}


/* --- fancy_heading --- */
.fhead{text-align:center}
.fhead-deco{margin-bottom:10px}
.fhead-ico{display:inline-grid;place-items:center;width:46px;height:46px;border-radius:50%;
  background:var(--accent-soft,#ddeeef);color:var(--accent)}
.fhead-ico .icon{width:22px;height:22px}
.fhead-rule{display:block;position:relative;height:1px;background:var(--line);max-width:420px;margin:16px auto}
.fhead-rule i{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--paper,#fff);
  padding:0 14px;font-style:normal;font-size:12.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-3)}
.fhead-arrows{font-size:24px;color:var(--accent);letter-spacing:.2em}
.fhead-title{margin:0 0 10px;letter-spacing:-.02em}
.fhead-text{margin:0 auto;max-width:640px;color:var(--ink-3);line-height:1.65}


/* --- feature_box --- */
.fb{display:flex;flex-direction:column;height:100%}
.fb-card{background:var(--fb-bg,var(--surface-2));border:1px solid var(--line);border-radius:12px;overflow:hidden}
.fb-plain{background:var(--fb-bg,transparent)}
.fb-media{overflow:hidden;background:var(--surface-2)}
.fb-media img{display:block;width:100%;height:auto;transition:transform .4s ease}
.fb-r16-9 .fb-media img{aspect-ratio:16/9;object-fit:cover}
.fb-r4-3 .fb-media img{aspect-ratio:4/3;object-fit:cover}
.fb-r1-1 .fb-media img{aspect-ratio:1/1;object-fit:cover}
.fb-clickable:hover .fb-media img{transform:scale(1.05)}
.fb-body{padding:20px 22px;flex:1;display:flex;flex-direction:column}
.fb-plain .fb-body{padding:16px 0 0}
.fb-eyebrow{font-size:11.5px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.fb-title{margin:0 0 8px;font-size:19px;line-height:1.3;letter-spacing:-.01em}
.fb-title a{text-decoration:none;color:inherit}
.fb-title a::after{content:"";position:absolute;inset:0}
.fb-clickable{position:relative}
.fb-clickable:hover .fb-title{color:var(--accent)}
.fb-text{margin:0;color:var(--ink-3);line-height:1.65}
.fb-link{margin-top:auto;padding-top:12px;font-weight:600;font-size:15px;text-decoration:none}
.fb-overlay{position:relative;border-radius:12px;overflow:hidden;min-height:280px;justify-content:flex-end}
.fb-overlay .fb-media{position:absolute;inset:0}
.fb-overlay .fb-media img{width:100%;height:100%;object-fit:cover;aspect-ratio:auto}
.fb-overlay .fb-body{position:relative;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.78));padding:60px 22px 22px}
.fb-overlay .fb-text{color:rgba(255,255,255,.86)}
.fb-overlay .fb-title a{color:#fff}
.fb-oncolor{border-color:rgba(255,255,255,.16)}
.fb-oncolor .fb-title,.fb-oncolor .fb-title a{color:#fff}
.fb-oncolor .fb-text{color:rgba(255,255,255,.85)}
.fb-oncolor .fb-eyebrow,.fb-oncolor .fb-link{color:rgba(255,255,255,.92)}
.fb-oncolor.fb-clickable:hover .fb-title{color:rgba(255,255,255,.75)}


/* --- feature_list --- */
.fl-intro{margin:0 0 18px;color:var(--ink-2)}
.fl-list{list-style:none;margin:0;padding:0;display:grid;gap:14px 24px}
.fl-c2 .fl-list{grid-template-columns:repeat(2,1fr)}
.fl-c3 .fl-list{grid-template-columns:repeat(3,1fr)}
.fl-c4 .fl-list{grid-template-columns:repeat(4,1fr)}
.fl-c5 .fl-list{grid-template-columns:repeat(5,1fr)}
.fl-c6 .fl-list{grid-template-columns:repeat(6,1fr)}
.fl-item,.fl-link{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.fl-icon{flex:0 0 44px;width:44px;height:44px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;color:var(--accent)}
.fl-icon .icon{width:20px;height:20px}
.fl-title{font-weight:600;font-size:15px}
.fl-link:hover .fl-icon{background:var(--accent);color:#fff;border-color:var(--accent)}
@media(max-width:900px){.fl-c4 .fl-list,.fl-c5 .fl-list,.fl-c6 .fl-list{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.fl-list{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:420px){.fl-list{grid-template-columns:1fr!important}}


/* --- flat_box --- */
.flatbox{background:var(--flat-bg,var(--surface-2));border:1px solid var(--line);border-radius:14px;
  overflow:hidden;text-align:center;position:relative;padding-bottom:8px}
.flatbox-media img{width:100%;aspect-ratio:16/9;object-fit:cover;display:block}
.flatbox-badge{width:58px;height:58px;border-radius:50%;background:var(--accent);color:#fff;
  display:grid;place-items:center;margin:18px auto 0;box-shadow:0 0 0 5px var(--flat-bg,var(--surface-2))}
.has-media .flatbox-badge{margin-top:-29px}
.flatbox-badge .icon{width:24px;height:24px}
.flatbox-badge img{width:30px;height:30px;object-fit:contain}
.flatbox-body{padding:14px 22px 18px}
.flatbox-title{margin:0 0 8px;font-size:19px}
.flatbox-title a{color:inherit;text-decoration:none}
.flatbox-title a:hover{color:var(--accent)}
.flatbox-text{margin:0;color:var(--ink-3);line-height:1.6}
.flatbox-oncolor{border-color:rgba(255,255,255,.16)}
.flatbox-oncolor .flatbox-title,.flatbox-oncolor .flatbox-title a{color:#fff}
.flatbox-oncolor .flatbox-text{color:rgba(255,255,255,.85)}


/* --- form --- */
.fm-title{margin:0 0 8px;font-size:21px;letter-spacing:-.015em}
.fm-intro{margin:0 0 20px;color:var(--ink-3);line-height:1.6}
.fm-form{display:grid;gap:15px;grid-template-columns:1fr 1fr}
.fm-row{grid-column:1 / -1}
.fm-half{grid-column:span 1}
.fm-row label{display:block;font-size:13.5px;font-weight:600;margin:0 0 6px}
.fm-req{color:var(--accent)}
.fm-form input[type=text],.fm-form input[type=email],.fm-form input[type=tel],
.fm-form input[type=url],.fm-form input[type=number],.fm-form input[type=date],
.fm-form input[type=time],.fm-form input[type=file],
.fm-form textarea,.fm-form select{width:100%;padding:11px 13px;
  /* The shared form tokens, so a field here matches the search box and the
     comment box, and all three follow a dark section. */
  border:var(--form-bw,1px) solid var(--form-line,var(--line));border-radius:var(--form-radius,7px);
  background:var(--form-bg,var(--paper));color:var(--form-fg,var(--ink));font:inherit;font-size:15px}
.fm-form textarea{resize:vertical;min-height:120px}
.fm-form input:focus,.fm-form textarea:focus,.fm-form select:focus{
  outline:2px solid var(--form-focus,var(--accent));outline-offset:1px;
  border-color:var(--form-focus,var(--accent))}
.fm-form ::placeholder{color:var(--form-ph,var(--ink-3));opacity:1}
.fm-check{display:flex;align-items:flex-start;gap:9px;font-weight:400!important;font-size:14.5px;line-height:1.5}
.fm-check input{width:17px;height:17px;margin-top:2px;accent-color:var(--accent);flex:0 0 auto}
/* The notice above the form names the fields; each one also says so in place,
   because a list at the top is no help on a form long enough to scroll. */
.fm-help{margin:6px 0 0;font-size:13px;color:var(--ink-3);line-height:1.5}
.fm-error{margin:6px 0 0;font-size:13.5px;font-weight:600;color:#a8481c;line-height:1.45}
.fm-row.has-error input,.fm-row.has-error textarea,.fm-row.has-error select{border-color:#a8481c}
.fm-notice ul{margin:6px 0 0;padding-left:20px}
.fm-notice li{margin:2px 0}

/* Radio and checkbox groups: one column, so a long option does not wrap into
   the next one and look like it belongs to it. */
.fm-options{display:flex;flex-direction:column;gap:8px}
.fm-options .fm-check{font-size:15px}
.fm-captcha{min-height:66px}
.fm-form input[type=file]{padding:9px 11px;font-size:14px}

.fm-actions{grid-column:1 / -1;margin-top:4px}
.fm-notice{grid-column:1 / -1;padding:12px 15px;border-radius:8px;margin-bottom:16px;font-size:15px;border:1px solid transparent}
.fm-notice.is-ok{background:#e6f0e5;border-color:#3f7a3a;color:#2f5c2b}
.fm-notice.is-bad{background:#f6e7de;border-color:#a8481c;color:#7a1f0c}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
@media(max-width:620px){.fm-form{grid-template-columns:1fr}.fm-half{grid-column:1 / -1}}


/* --- gallery --- */
.gal{display:grid;gap:var(--gal-gap,14px)}
.gal-c2{grid-template-columns:repeat(2,1fr)}
.gal-c3{grid-template-columns:repeat(3,1fr)}
.gal-c4{grid-template-columns:repeat(4,1fr)}
.gal-c5{grid-template-columns:repeat(5,1fr)}
.gal-item{margin:0;overflow:hidden;border-radius:var(--gal-radius,8px);background:var(--surface-2)}
.gal-item img{display:block;width:100%;height:auto;transition:transform .4s ease,filter .3s}
.gal-item a{display:block;overflow:hidden}
.gal-fancy .gal-item{position:relative}
.gal-fancy .gal-cap{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;color:#fff;font-size:14px;font-weight:600;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0));opacity:0;transition:opacity .3s;pointer-events:none}
.gal-fancy .gal-item:hover .gal-cap{opacity:1}
.gal-flat .gal-item{background:none;border-radius:0}
.gal-flat .gal-item img,.gal-flat .gal-item a{border-radius:var(--gal-radius,8px)}
.gal-flat .gal-cap{padding:8px 2px 0;font-size:13.5px;color:var(--ink-3)}
.gal-grey .gal-item img{filter:grayscale(1)}
.gal-grey .gal-item:hover img{filter:none}
.gal-zoom .gal-item:hover img{transform:scale(1.06)}
.gal-r16-9 .gal-item img{aspect-ratio:16/9;object-fit:cover}
.gal-r4-3 .gal-item img{aspect-ratio:4/3;object-fit:cover}
.gal-r1-1 .gal-item img{aspect-ratio:1/1;object-fit:cover}
.gal-r3-4 .gal-item img{aspect-ratio:3/4;object-fit:cover}
.gal-masonry{display:block;column-gap:var(--gal-gap,14px)}
.gal-masonry.gal-c2{column-count:2}.gal-masonry.gal-c3{column-count:3}
.gal-masonry.gal-c4{column-count:4}.gal-masonry.gal-c5{column-count:5}
.gal-masonry .gal-item{break-inside:avoid;margin-bottom:var(--gal-gap,14px)}
.gal-masonry .gal-item img{aspect-ratio:auto!important}
.gal-strip{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;grid-template-columns:none}
.gal-strip .gal-item{flex:0 0 min(320px,72vw);scroll-snap-align:start}
@media(max-width:860px){.gal-c4,.gal-c5{grid-template-columns:repeat(3,1fr)}.gal-masonry.gal-c4,.gal-masonry.gal-c5{column-count:3}}
@media(max-width:640px){.gal-c3,.gal-c4,.gal-c5{grid-template-columns:repeat(2,1fr)}.gal-masonry{column-count:2!important}}


/* --- heading --- */
.hd-eyebrow{display:block;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.hd-title{margin:0;letter-spacing:-.02em;line-height:1.15;text-wrap:balance}
.hd-sm .hd-title{font-size:clamp(19px,2.2vw,23px)}
.hd-md .hd-title{font-size:clamp(24px,3.4vw,34px)}
.hd-lg .hd-title{font-size:clamp(30px,4.6vw,46px)}
.hd-xl .hd-title{font-size:clamp(36px,6vw,62px)}
.hd-rule{display:block;width:56px;height:3px;border-radius:2px;background:var(--accent);margin:16px 0 0}
.ta-center .hd-rule{margin-left:auto;margin-right:auto}
.ta-right .hd-rule{margin-left:auto}
.hd-lead{margin:14px 0 0;font-size:17px;line-height:1.65;color:var(--ink-3);max-width:62ch}
.ta-center{text-align:center}
.ta-center .hd-lead{margin-left:auto;margin-right:auto}
.ta-left{text-align:left}
.ta-right{text-align:right}


/* --- hover_box --- */
.hoverbox{position:relative;display:block;overflow:hidden;border-radius:var(--hb-radius,12px)}
.hoverbox img{display:block;width:100%;transition:opacity .3s}
.hoverbox .hb-b{position:absolute;inset:0;height:100%;object-fit:cover;opacity:0}
.hoverbox:hover .hb-b,.hoverbox:focus-visible .hb-b{opacity:1}
.hoverbox:hover .hb-a{opacity:0}
@media(hover:none){.hoverbox .hb-b{display:none}.hoverbox:hover .hb-a{opacity:1}}


/* --- hover_color --- */
.hc{display:block;padding:var(--hc-pad,40px 30px);background:var(--hc-bg,#999);color:#fff;text-decoration:none;
  border:var(--hc-bw,2px) solid var(--hc-bd,transparent);transition:background .25s,border-color .25s}
.hc:hover{background:var(--hc-bgh,var(--hc-bg,#888));border-color:var(--hc-bdh,var(--hc-bd,transparent));color:#fff}
.hc-left{text-align:left}.hc-center{text-align:center}.hc-right{text-align:right}.hc-justify{text-align:justify}
.hc-text{line-height:1.65}


/* --- how_it_works --- */
.hiw{display:block;position:relative;text-align:center;color:inherit;text-decoration:none}
/* The wrapper is the positioning context, so the badge is not clipped by the
   circle's own overflow. See render.php. */
.hiw-badge-wrap{position:relative;width:180px;margin:0 auto 20px}
.hiw-circle{width:180px;height:180px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}
.hiw-circle img{width:96px;height:96px;object-fit:contain}
.hiw-fill .hiw-circle img{width:100%;height:100%;object-fit:cover}
.hiw-num{position:absolute;right:6px;bottom:6px;z-index:2;width:40px;height:40px;border-radius:50%;background:var(--accent);color:#fff;font-weight:700;display:grid;place-items:center;font-size:17px;box-shadow:0 2px 8px rgba(0,0,0,.15)}
.hiw-title{margin:0 0 8px;font-size:19px}
.hiw-text{margin:0;color:var(--ink-2);font-size:15px;line-height:1.65}
.hiw-line::after{content:"";position:absolute;top:90px;left:calc(50% + 100px);width:calc(100% - 200px + 2 * var(--gap,30px));border-top:2px dashed var(--line-2,var(--line))}
a.hiw:hover .hiw-circle{border-color:var(--accent)}
@media(max-width:760px){.hiw-line::after{display:none}}


/* --- html --- */
.raw>:first-child{margin-top:0}
.raw>:last-child{margin-bottom:0}
.raw img{max-width:100%;height:auto}
.raw iframe{max-width:100%}


/* --- icon_box --- */
.ib{display:flex;gap:16px}
.ib-top{flex-direction:column}
.ib-boxed{flex-direction:column;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:26px}
.ib-icon{display:inline-grid;place-items:center;flex:0 0 auto;width:calc(var(--ib-size,28px) * 1.9);height:calc(var(--ib-size,28px) * 1.9);
  border-radius:12px;background:var(--ib-bg,var(--accent-soft,#ddeeef));color:var(--ib-color,var(--accent))}
.ib-icon .icon{width:var(--ib-size,28px);height:var(--ib-size,28px)}
.ib-img{background:none;overflow:hidden}
.ib-img img{width:100%;height:100%;object-fit:contain}
.ib-border{border:1px solid var(--line);border-radius:12px;padding:24px}
.ib-title{margin:0 0 7px;font-size:18.5px;letter-spacing:-.01em;line-height:1.3}
.ib-text{margin:0;color:var(--ink-3);line-height:1.65}
.ib-link{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-weight:600;font-size:15px;text-decoration:none}
.ib-link:hover{gap:10px}
.ib-link .icon{width:1em;height:1em;transition:transform .2s}
.ta-center .ib{align-items:center;text-align:center}
.ta-center .ib-left{flex-direction:column}


/* --- image --- */
.im{margin:0;max-width:var(--im-width,100%)}
.im.ta-center{margin-left:auto;margin-right:auto}
.im.ta-right{margin-left:auto}
.im img{display:block;width:100%;height:auto;border-radius:var(--im-radius,8px)}
.im-shadow img{box-shadow:0 18px 40px -22px rgba(0,0,0,.45)}
.im-border img{border:1px solid var(--line);padding:6px;background:var(--paper)}
.im a{display:block;overflow:hidden;border-radius:var(--im-radius,8px)}
.im img{transition:transform .45s,filter .3s,box-shadow .3s}
.im-hover-zoom:hover img{transform:scale(1.05)}
.im-hover-lift:hover img{transform:translateY(-4px);box-shadow:0 18px 32px -18px rgba(0,0,0,.4)}
.im-grey img{filter:grayscale(1)}
.im-grey:hover img{filter:none}
.im-r16-9 img{aspect-ratio:16/9;object-fit:cover}
.im-r4-3 img{aspect-ratio:4/3;object-fit:cover}
.im-r1-1 img{aspect-ratio:1/1;object-fit:cover}
.im-r3-4 img{aspect-ratio:3/4;object-fit:cover}
.im figcaption{margin-top:9px;font-size:13.5px;color:var(--ink-3);line-height:1.5}


/* --- info_box --- */
.infobox{background:var(--surface-2);background-size:cover;background-position:center;border:1px solid var(--line);
  border-radius:14px;padding:26px 28px;position:relative;overflow:hidden}
.infobox-title{margin:0 0 14px;font-size:20px;letter-spacing:-.01em}
.infobox-list{margin:0;padding:0;list-style:none;counter-reset:ib}
.infobox-list li{counter-increment:ib;display:flex;gap:12px;align-items:baseline;padding:8px 0;border-bottom:1px solid var(--line)}
.infobox-list li:last-child{border-bottom:0}
.infobox-list li::before{content:counter(ib);flex:0 0 auto;width:24px;height:24px;border-radius:50%;
  background:var(--accent);color:#fff;font-size:12.5px;font-weight:700;display:grid;place-items:center;transform:translateY(3px)}
.infobox-text{margin:14px 0 0;color:var(--ink-3);line-height:1.65}


/* --- list --- */
.lst{list-style:none;margin:0;padding:0;display:grid;gap:11px}
.lst-c2{grid-template-columns:repeat(2,1fr);column-gap:28px}
.lst-c3{grid-template-columns:repeat(3,1fr);column-gap:28px}
.lst li{display:flex;align-items:flex-start;gap:11px;line-height:1.6}
.lst-icon{flex:0 0 auto;display:inline-grid;place-items:center;width:1.35em;height:1.35em;margin-top:.15em;color:var(--lst-color,var(--accent))}
.lst-icon .icon{width:100%;height:100%}
.lst-text a{color:inherit;text-decoration:none;font-weight:600}
.lst-text a:hover{color:var(--accent)}
.lst-sub{display:block;font-size:.88em;color:var(--ink-3);line-height:1.55;margin-top:2px}
.lst-img{width:2.2em;height:2.2em;margin-top:0}
.lst-img img{width:100%;height:100%;object-fit:contain}
.lst-bg li{background:var(--surface-2);border:1px solid var(--line);border-radius:9px;padding:12px 14px}
.lst-vertical li{flex-direction:column;align-items:center;text-align:center;gap:8px}
.lst-vertical .lst-icon{width:2.4em;height:2.4em;margin:0;border-radius:50%;background:var(--accent-soft,#ddeeef)}
.lst-vertical .lst-icon .icon{width:55%;height:55%}
.lst-ordered{counter-reset:lst}
.lst-ordered li{counter-increment:lst}
.lst-num{flex:0 0 auto;width:1.9em;height:1.9em;border-radius:50%;background:var(--lst-color,var(--accent));color:#fff;display:inline-grid;place-items:center;font-size:.8em;font-weight:700}
.lst-num::before{content:counter(lst)}
.lst-sm{font-size:14.5px}
.lst-lg{font-size:18px}
.lst-divided li{padding-bottom:11px;border-bottom:1px solid var(--line)}
.lst-divided li:last-child{border-bottom:0;padding-bottom:0}
@media(max-width:640px){.lst-c2,.lst-c3{grid-template-columns:1fr}}


/* --- map --- */
.mp{border-radius:var(--mp-radius,10px);overflow:hidden;background:var(--surface-2)}
.mp iframe{display:block;width:100%;height:var(--mp-h,380px);border:0}
.mp{position:relative}
.mp-border{border:1px solid var(--line);padding:6px;background:var(--paper)}
.mp-card{position:absolute;background:var(--paper);color:var(--ink);box-shadow:0 12px 34px -14px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:8px;font-size:14.5px;line-height:1.5}
.mp-info-box .mp-card{left:24px;top:24px;max-width:300px;padding:20px 22px;border-radius:12px}
.mp-info-bar .mp-card{left:0;right:0;top:0;flex-direction:row;flex-wrap:wrap;gap:8px 28px;padding:14px 22px;align-items:center}
.mp-title{font-size:17px}
.mp-line{display:flex;align-items:flex-start;gap:9px}
.mp-line .icon{flex:0 0 16px;width:16px;height:16px;margin-top:3px;color:var(--accent)}
.mp-line a{color:inherit;text-decoration:none}
.mp-line a:hover{color:var(--accent)}
@media(max-width:640px){.mp-info-box .mp-card{position:static;max-width:none;border-radius:0 0 var(--mp-radius,10px) var(--mp-radius,10px)}}


/* --- map_basic --- */
.mpb{position:relative;height:var(--mpb-h,300px);background:var(--surface-2)}
.mpb iframe{display:block;width:100%;height:100%;border:0}


/* --- menu --- */
/* A saved menu, drawn outside the header.
   The header's own menu styling is a horizontal bar with hover fills; none of
   that belongs in a footer column, so this resets to a plain list and builds
   back up rather than trying to undo .menu rule by rule. */
.emenu-title{margin:0 0 10px;font-weight:600;font-size:15px;color:var(--heading,inherit)}

.emenu .emenu-list,
.emenu .emenu-list ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:2px}
.emenu .emenu-list li{position:static;margin:0}

.emenu .emenu-list a{display:inline-block;padding:4px 0;color:inherit;text-decoration:none;
  border-radius:0;background:none;transition:color .15s,opacity .15s}
.emenu .emenu-list a:hover,
.emenu .emenu-list a:focus-visible{color:var(--link,var(--accent));background:none;text-decoration:underline}
.emenu .emenu-list li.is-current>a{font-weight:600}

/* Sub-items: a dropdown has nowhere to drop down to here, so it is indented
   and always open. Position and visibility are both reset, because the header
   rules absolutely position these off-screen. */
.emenu .emenu-list ul{position:static;display:flex;visibility:visible;opacity:1;transform:none;
  box-shadow:none;border:0;background:none;min-width:0;padding:2px 0 2px 14px}

.emenu-sm{font-size:14px}
.emenu-md{font-size:15px}
.emenu-lg{font-size:17px}

.emenu-inline .emenu-list{flex-direction:row;flex-wrap:wrap;gap:6px 20px}
.emenu-inline .emenu-list ul{display:none}      /* a second level cannot read in a row */

.emenu-cols .emenu-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 20px}

.emenu-divided .emenu-list>li+li{border-top:1px solid var(--line);padding-top:2px}


/* --- offer --- */
.of-item{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;min-height:420px}
.of-media img{width:100%;height:100%;object-fit:cover;display:block}
.of-body{padding:clamp(28px,5vw,70px);display:flex;flex-direction:column;justify-content:center;background:var(--surface-2)}
.of-num{font-size:13px;font-weight:700;letter-spacing:.14em;color:var(--accent);margin-bottom:12px}
.of-title{margin:0 0 14px;font-size:clamp(24px,2.6vw,36px)}
.of-text{margin:0 0 22px;color:var(--ink-2);line-height:1.7}
.of-btn{margin:0}
.of-center .of-body{text-align:center;align-items:center}.of-right .of-body{text-align:right;align-items:flex-end}.of-justify .of-text{text-align:justify}
.of .strip-dots{position:absolute;right:24px;bottom:18px}
.of .strip-prev{left:18px}.of .strip-next{right:18px}
@media(max-width:800px){.of-item{grid-template-columns:1fr;min-height:0}.of-media img{aspect-ratio:16/9;height:auto}}


/* --- offer_thumb --- */
.oft{display:grid;gap:18px}
.oft-tl{grid-template-columns:96px 1fr}
.oft-tl .strip-thumbs{order:-1;flex-direction:column}
.oft-item{flex:0 0 100%;display:grid;grid-template-columns:1.2fr 1fr;gap:28px;align-items:center}
.oft-media img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;border-radius:12px}
.oft-title{margin:0 0 12px;font-size:clamp(22px,2.2vw,30px)}
.oft-text{margin:0 0 20px;color:var(--ink-2);line-height:1.7}
.oft-btn{margin:0}
.oft-center .oft-body{text-align:center}.oft-right .oft-body{text-align:right}.oft-justify .oft-text{text-align:justify}
.strip-thumbs{display:flex;gap:10px;flex-wrap:wrap}
.strip-thumb{width:80px;height:60px;padding:0;border:2px solid transparent;border-radius:8px;overflow:hidden;background:var(--surface-2);cursor:pointer;opacity:.6;transition:opacity .2s,border-color .2s;display:grid;place-items:center;font-weight:700;color:var(--ink-3)}
.strip-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.strip-thumb:hover,.strip-thumb.is-active{opacity:1;border-color:var(--accent)}
@media(max-width:760px){.oft-tl{grid-template-columns:1fr}.oft-tl .strip-thumbs{order:1;flex-direction:row}.oft-item{grid-template-columns:1fr}}


/* --- opening_hours --- */
.oh{background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:26px 28px;position:relative;overflow:hidden;background-size:cover;background-position:center}
.oh-img{color:#fff;border:0}
.oh-img::before{content:"";position:absolute;inset:0;background:rgba(10,14,20,.62)}
.oh>*{position:relative}
.oh-title{margin:0 0 14px;font-size:19px;display:flex;align-items:center;gap:10px}
.oh-title .icon{width:20px;height:20px;color:var(--accent)}
.oh-img .oh-title .icon{color:#fff}
.oh-list{margin:0}
.oh-row{display:flex;justify-content:space-between;gap:16px;padding:9px 0;border-bottom:1px dashed var(--line)}
.oh-img .oh-row{border-color:rgba(255,255,255,.25)}
.oh-row:last-child{border-bottom:0}
.oh-row dt{font-weight:600}
.oh-row dd{margin:0;color:var(--ink-2);text-align:right}
.oh-img .oh-row dd{color:rgba(255,255,255,.85)}
.oh-note{margin:14px 0 0;font-size:14px;color:var(--ink-3)}
.oh-img .oh-note{color:rgba(255,255,255,.75)}


/* --- our_team_list --- */
.tml{display:grid;grid-template-columns:minmax(160px,32%) 1fr;gap:28px;align-items:start;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:24px}
.tml-photo img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:10px}
.tml-name{margin:0 0 2px;font-size:21px}
.tml-name a{color:inherit;text-decoration:none}
.tml-name a:hover{color:var(--accent)}
.tml-role{margin:0 0 12px;color:var(--accent);font-weight:600;font-size:14px}
.tml-text{margin:0 0 12px;color:var(--ink-2);line-height:1.65}
.tml-quote{margin:0 0 14px;padding:10px 16px;border-left:3px solid var(--accent);font-style:italic;color:var(--ink-2)}
.tml-meta{list-style:none;margin:0;padding:12px 0 0;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}
.tml-meta li{display:flex;align-items:center;gap:7px}
.tml-meta .icon{width:16px;height:16px;color:var(--accent)}
.tml-meta a{color:inherit;text-decoration:none}
.tml-meta a:hover{color:var(--accent)}
.tml-social a{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--surface);border:1px solid var(--line)}
.tml-social a:hover{background:var(--accent);border-color:var(--accent)}
.tml-social a:hover .icon{color:#fff}
@media(max-width:600px){.tml{grid-template-columns:1fr}.tml-photo{max-width:220px}}


/* --- photo_box --- */
.photobox-media{display:block;overflow:hidden;border-radius:12px;margin-bottom:14px}
.photobox-media img{display:block;width:100%;transition:transform .35s,filter .35s}
.photobox-media:hover img{transform:scale(1.04)}
.pb-grey .photobox-media img{filter:grayscale(1)}
.pb-grey .photobox-media:hover img{filter:none}
.photobox-title{margin:0 0 7px;font-size:19px}
.photobox-text{margin:0;color:var(--ink-3);line-height:1.6}
.photobox.ta-left{text-align:left}.photobox.ta-center{text-align:center}.photobox.ta-right{text-align:right}


/* --- portfolio_grid --- */
.pgr{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.pgr-item{position:relative;overflow:hidden;background:var(--ink)}
.pgr-link{display:block;color:#fff;text-decoration:none}
.pgr-media img,.pgr-empty{display:block;width:100%;aspect-ratio:1;object-fit:cover;transition:transform .5s,filter .3s,opacity .3s}
.pgr-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.pgr-cap{position:absolute;left:0;right:0;bottom:0;padding:16px 18px;background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,0));transform:translateY(8px);opacity:0;transition:opacity .3s,transform .3s}
.pgr-link:hover .pgr-cap{opacity:1;transform:none}
.pgr-link:hover .pgr-media img{transform:scale(1.06)}
.pgr-head{margin:0;font-size:16px;color:#fff}
.pgr-sub{margin:3px 0 0;font-size:13px;opacity:.85}
.pgr-grey .pgr-media img{filter:grayscale(1);opacity:.85}
.pgr-grey .pgr-link:hover .pgr-media img{filter:none;opacity:1}
@media(max-width:900px){.pgr{grid-template-columns:repeat(2,1fr)}}


/* --- portfolio_photo --- */
.pph{display:grid;grid-template-columns:repeat(5,1fr);gap:0}
.pph-gap{gap:10px}
.pph-item{position:relative;display:block;overflow:hidden;background:var(--ink);color:#fff;text-decoration:none}
.pph-gap .pph-item{border-radius:8px}
.pph-item img,.pph-empty{display:block;width:100%;aspect-ratio:1;object-fit:cover;transition:transform .5s,filter .3s}
.pph-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.pph-name{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;font-size:14px;font-weight:600;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,0));opacity:0;transition:opacity .3s}
.pph-item:hover .pph-name{opacity:1}
.pph-item:hover img{transform:scale(1.06)}
.pph-grey img{filter:grayscale(1)}
.pph-grey .pph-item:hover img{filter:none}
@media(max-width:900px){.pph{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.pph{grid-template-columns:repeat(2,1fr)}}


/* --- portfolio_slider --- */
.psl-item{display:block;color:inherit;text-decoration:none;position:relative;overflow:hidden;border-radius:10px;background:var(--ink)}
.psl-small .psl-item{flex:0 0 calc((100% - 3 * var(--strip-gap,24px)) / 4)}
.psl-medium .psl-item{flex:0 0 calc((100% - 2 * var(--strip-gap,24px)) / 3)}
.psl-large .psl-item{flex:0 0 calc((100% - var(--strip-gap,24px)) / 2)}
.psl-media img,.psl-empty{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .5s}
.psl-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.psl-name{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;color:#fff;font-weight:600;font-size:15px;background:linear-gradient(to top,rgba(0,0,0,.72),rgba(0,0,0,0))}
.psl-item:hover img{transform:scale(1.05)}
@media(max-width:900px){.psl-small .psl-item,.psl-medium .psl-item{flex-basis:calc((100% - var(--strip-gap,24px)) / 2)}}
@media(max-width:600px){.psl .psl-item{flex-basis:80%}}


/* --- posts --- */
.pl{display:grid;gap:24px}
.pl-c1{grid-template-columns:1fr}
.pl-c2{grid-template-columns:repeat(2,1fr)}
.pl-c3{grid-template-columns:repeat(3,1fr)}
.pl-c4{grid-template-columns:repeat(4,1fr)}
.pl-item{display:flex;flex-direction:column;background:var(--surface-2);border:1px solid var(--line);
  border-radius:12px;overflow:hidden}
.pl-media{display:block;overflow:hidden}
.pl-media img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;transition:transform .4s}
.pl-item:hover .pl-media img{transform:scale(1.05)}
.pl-body{padding:18px 20px;flex:1;display:flex;flex-direction:column}
.pl-date{font-size:12.5px;color:var(--ink-3);letter-spacing:.04em}
.pl-title{margin:6px 0 8px;font-size:18px;line-height:1.35;letter-spacing:-.01em}
.pl-title a{text-decoration:none;color:inherit}
.pl-title a:hover{color:var(--accent)}
.pl-excerpt{margin:0;font-size:14.5px;line-height:1.6;color:var(--ink-3)}
.pl-more{margin:26px 0 0;text-align:center}
@media(max-width:900px){.pl-c3,.pl-c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.pl-c2,.pl-c3,.pl-c4{grid-template-columns:1fr}}

/* ---- archive layouts (Theme options → Blog & portfolio) ---- */
.pl-terms{margin:0 0 2px;font-size:12.5px;letter-spacing:.04em;text-transform:uppercase}
.pl-terms a{color:var(--accent);text-decoration:none;margin-right:8px}
.pl-read{margin:10px 0 0;font-size:14px}
.pl-read a{color:var(--accent);text-decoration:none;font-weight:600}
.pl-read a:hover{text-decoration:underline}

/* List — image left, text right, one per row. */
.pl-list{grid-template-columns:1fr}
.pl-list .pl-item{flex-direction:row}
.pl-list .pl-media{flex:0 0 36%}
.pl-list .pl-media img{height:100%;aspect-ratio:auto;min-height:180px}
.pl-list .pl-body{justify-content:center}
@media(max-width:620px){.pl-list .pl-item{flex-direction:column}.pl-list .pl-media{flex:none}}

/* Masonry — CSS columns; each card keeps its natural height. */
.pl-masonry{display:block;columns:3;column-gap:24px}
.pl-masonry.pl-c2{columns:2}.pl-masonry.pl-c4{columns:4}
.pl-masonry .pl-item{break-inside:avoid;margin-bottom:24px}
.pl-masonry .pl-media img{aspect-ratio:auto}
@media(max-width:900px){.pl-masonry{columns:2}}
@media(max-width:620px){.pl-masonry{columns:1}}

/* Title on hover — the portfolio wall: image only, title slides up over it. */
.pl-hover .pl-item{position:relative;border:0}
.pl-hover .pl-media img{aspect-ratio:4/3}
.pl-hover .pl-body{position:absolute;inset:auto 0 0 0;padding:14px 16px;
  background:linear-gradient(transparent,rgba(11,15,14,.82));color:#fff;
  opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.pl-hover .pl-item:hover .pl-body,.pl-hover .pl-item:focus-within .pl-body{opacity:1;transform:none}
.pl-hover .pl-title{margin:0}
.pl-hover .pl-title a{color:#fff}
.pl-hover .pl-terms,.pl-hover .pl-terms a{color:rgba(255,255,255,.75)}
@media(hover:none){.pl-hover .pl-body{opacity:1;transform:none}}

/* ---- parity pass (P5): BeTheme blog / portfolio styles as loop styles ---- */
.pl-c5{grid-template-columns:repeat(5,1fr)}.pl-c6{grid-template-columns:repeat(6,1fr)}
@media(max-width:900px){.pl-c5,.pl-c6{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.pl-c5,.pl-c6{grid-template-columns:repeat(2,1fr)}}
.pl-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 22px}
.pl-filter{border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);border-radius:999px;padding:7px 15px;font:600 13.5px/1 inherit;cursor:pointer}
.pl-filter:hover{border-color:var(--accent);color:var(--accent)}
.pl-filter.is-active{background:var(--accent);border-color:var(--accent);color:#fff}
.pl-item[hidden]{display:none}
.pl-grey .pl-media img{filter:grayscale(1);transition:filter .3s,transform .4s}
.pl-grey .pl-item:hover .pl-media img{filter:none}
.pl-tight{gap:0}
.pl-tight .pl-item{border-radius:0}
.pl-images-only .pl-body{display:none}
.pl-images-only .pl-item{border:0;background:none}
/* classic: one wide card per row, big image on top */
.pl-classic{grid-template-columns:1fr}
.pl-classic .pl-media img{aspect-ratio:21/9}
.pl-classic .pl-title{font-size:24px}
/* tiles: the image is the card, the title slides up on hover */
.pl-tiles .pl-item{position:relative;border:0;background:var(--ink);color:#fff}
.pl-tiles .pl-media img,.pl-tiles .pl-empty{display:block;aspect-ratio:1;width:100%;object-fit:cover}
.pl-tiles .pl-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.pl-tiles .pl-body{position:absolute;inset:auto 0 0 0;padding:16px 18px;background:linear-gradient(transparent,rgba(11,15,14,.85));opacity:0;transform:translateY(6px);transition:opacity .25s,transform .25s}
.pl-tiles .pl-item:hover .pl-body,.pl-tiles .pl-item:focus-within .pl-body{opacity:1;transform:none}
.pl-tiles .pl-title{margin:0}.pl-tiles .pl-title a,.pl-tiles .pl-date,.pl-tiles .pl-excerpt,.pl-tiles .pl-read a{color:#fff}
.pl-tiles .pl-excerpt{display:none}
@media(hover:none){.pl-tiles .pl-body{opacity:1;transform:none}}
/* photo: big picture, text underneath, no card */
.pl-photo .pl-item{border:0;background:none;border-radius:0}
.pl-photo .pl-media{border-radius:12px}
.pl-photo .pl-media img,.pl-photo .pl-empty{aspect-ratio:3/2;display:block;width:100%;object-fit:cover}
.pl-photo .pl-empty{background:linear-gradient(135deg,var(--accent),#1c2733)}
.pl-photo .pl-body{padding:16px 2px 0}
/* flat: cards without a box */
.pl-flat .pl-item{border:0;background:none;border-radius:0}
.pl-flat .pl-media{border-radius:10px}
.pl-flat .pl-body{padding:14px 0 0}
/* timeline: one column along a vertical line */
.pl-timeline{grid-template-columns:1fr;position:relative;padding-left:34px}
.pl-timeline::before{content:"";position:absolute;left:9px;top:8px;bottom:8px;border-left:2px solid var(--line)}
.pl-timeline .pl-item{position:relative;overflow:visible}
.pl-timeline .pl-item::before{content:"";position:absolute;left:-31px;top:22px;width:14px;height:14px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--paper)}
.pl-timeline .pl-media{border-radius:12px 12px 0 0;overflow:hidden}
.pl-timeline .pl-media img{aspect-ratio:21/9}
/* pagination + load more */
.pl-pages{display:flex;gap:6px;justify-content:center;margin:26px 0 0;flex-wrap:wrap}
.pl-page{min-width:38px;height:38px;padding:0 10px;display:inline-grid;place-items:center;border:1px solid var(--line);border-radius:8px;text-decoration:none;color:inherit;font-weight:600;font-size:14px}
.pl-page:hover{border-color:var(--accent);color:var(--accent)}
.pl-page.is-current{background:var(--accent);border-color:var(--accent);color:#fff}
.pl-loadmore{margin:26px 0 0;text-align:center}
.pl-loadmore .is-loading{opacity:.6;pointer-events:none}


/* --- pricing --- */
.pr{display:grid;gap:22px;align-items:stretch}
.pr-c2{grid-template-columns:repeat(2,1fr)}
.pr-c3{grid-template-columns:repeat(3,1fr)}
.pr-c4{grid-template-columns:repeat(4,1fr)}
.pr-item{position:relative;display:flex;flex-direction:column;background:var(--surface-2);border:1px solid var(--line);
  border-radius:14px;padding:28px 24px}
.pr-item.is-featured{border-color:var(--accent);border-width:2px;box-shadow:0 22px 50px -30px rgba(14,124,134,.5)}
.pr-badge{position:absolute;top:-11px;left:24px;background:var(--accent);color:#fff;font-size:11px;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;padding:4px 11px;border-radius:99px}
.pr-name{margin:0 0 6px;font-size:19px;letter-spacing:-.01em}
.pr-summary{margin:0 0 16px;font-size:14.5px;color:var(--ink-3);line-height:1.6}
.pr-price{margin:0 0 20px;display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.pr-price span{font-size:clamp(28px,3.4vw,38px);font-weight:700;letter-spacing:-.03em;line-height:1}
.pr-price i{font-style:normal;font-size:14px;color:var(--ink-3)}
.pr-features{list-style:none;margin:0 0 22px;padding:0;display:grid;gap:10px;font-size:15px}
.pr-features li{display:flex;align-items:flex-start;gap:10px;line-height:1.5}
.pr-features .icon{flex:0 0 auto;width:1.15em;height:1.15em;margin-top:.15em;color:var(--accent)}
.pr-btn{margin-top:auto;justify-content:center;text-align:center}
@media(max-width:900px){.pr-c3,.pr-c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.pr-c2,.pr-c3,.pr-c4{grid-template-columns:1fr}}
.pr-image{width:64px;height:64px;object-fit:contain;margin:0 0 12px}
.pr-subtitle{margin:-4px 0 10px;font-size:14px;color:var(--ink-3)}
.pr-cur{font-size:.55em;vertical-align:top;margin:0 2px;font-weight:600}
.pr-table{gap:0}
.pr-table .pr-item{border-radius:0;margin-left:-1px}
.pr-table .pr-item:first-child{border-radius:14px 0 0 14px;margin-left:0}
.pr-table .pr-item:last-child{border-radius:0 14px 14px 0}
.pr-table .pr-item.is-featured{border-width:1px;box-shadow:none;background:var(--accent-soft,#ddeeef)}


/* --- progress --- */
.pg{display:grid;gap:18px}
.pg-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:7px}
.pg-label{font-weight:600;font-size:15px}
.pg-value{font-size:13.5px;color:var(--ink-3);font-variant-numeric:tabular-nums}
.pg-track{height:var(--pg-h,10px);background:var(--surface-2);border-radius:99px;overflow:hidden}
.pg-fill{display:block;height:100%;width:0;background:var(--accent);border-radius:99px;transition:width 1.1s cubic-bezier(.22,.8,.3,1)}
@media(prefers-reduced-motion:reduce){.pg-fill{transition:none}}
.pg-title{margin:0 0 6px;font-size:20px}
.pg-text{margin:0 0 16px;color:var(--ink-3);line-height:1.6}


/* --- promo_box --- */
.promo{display:flex;background:var(--promo-bg,var(--surface-2));border:1px solid var(--line);border-radius:14px;overflow:hidden}
.promo-right{flex-direction:row-reverse}
.promo-media{flex:0 0 46%;min-height:220px}
.promo-media img{width:100%;height:100%;object-fit:cover;display:block}
.promo-body{flex:1;padding:30px 32px;display:flex;flex-direction:column;justify-content:center}
.promo-line .promo-body{border-left:3px solid var(--accent)}
.promo-right.promo-line .promo-body{border-left:0;border-right:3px solid var(--accent)}
.promo-title{margin:0 0 10px;font-size:22px;letter-spacing:-.01em}
.promo-text{margin:0;color:var(--ink-3);line-height:1.65}
.promo-btn{margin:16px 0 0}
@media(max-width:640px){.promo,.promo-right{flex-direction:column}.promo-media{min-height:180px}}
.promo-oncolor{border-color:rgba(255,255,255,.16)}
.promo-oncolor .promo-title{color:#fff}
.promo-oncolor .promo-text{color:rgba(255,255,255,.85)}


/* --- quick_fact --- */
.qfact.ta-left{text-align:left}.qfact.ta-center{text-align:center}.qfact.ta-right{text-align:right}
.qfact-number{margin:0;font-size:46px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--accent);
  font-family:var(--font-heading,inherit)}
.qfact-fix{font-size:.55em;font-weight:700;vertical-align:.28em}
.qfact-title{margin:8px 0 4px;font-size:18px}
.qfact-text{margin:0;color:var(--ink-3);line-height:1.55;font-size:14.5px}


/* --- slider --- */
/* ---------------------------------------------------------------- slider
   The slide transition is CSS scroll-snap, not a transform track. That gives
   real touch swiping, momentum, trackpad gestures and keyboard scrolling for
   free, from the browser, with no gesture code to get wrong on some phone
   nobody here owns. The JS only drives it with scrollTo(). */
.sl{position:relative;overflow:hidden;background:var(--surface-2,#f4f6f5)}
.sl-full{width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}

.sl-track{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
.sl-track::-webkit-scrollbar{display:none}
.sl-item{position:relative;flex:0 0 100%;width:100%;scroll-snap-align:start;scroll-snap-stop:always;
  display:flex;overflow:hidden;isolation:isolate}

/* Fade stacks every slide in one grid cell instead. Scroll-snap cannot cross-
   fade, so this is the one place the two modes genuinely differ. */
.sl-fade .sl-track{display:grid;overflow:visible;scroll-snap-type:none}
.sl-fade .sl-item{grid-area:1/1;opacity:0;transition:opacity .6s ease;pointer-events:none}
.sl-fade .sl-item.is-active{opacity:1;pointer-events:auto}

/* Heights. No numeric option: a slider that is 900px tall on a phone is the
   commonest way one gets ruined, so every preset caps itself against the
   viewport instead. */
.sl-h-auto .sl-item{min-height:0}
.sl-h-sm   .sl-item{min-height:min(380px,72vh)}
.sl-h-md   .sl-item{min-height:min(520px,80vh)}
.sl-h-lg   .sl-item{min-height:min(680px,88vh)}
.sl-h-full .sl-item{min-height:100vh;min-height:100svh}
.head-sticky .sl-h-full .sl-item{min-height:calc(100svh - var(--header-h,76px))}

.sl-bg{position:absolute;inset:0;z-index:0}
.sl-image,.sl-video{width:100%;height:100%;object-fit:cover;display:block}
.sl-overlay{position:absolute;inset:0;z-index:1;background:#0b0f0e;pointer-events:none}

.sl-inner{position:relative;z-index:2;display:flex;width:100%;
  max-width:var(--container,1180px);margin:0 auto;padding:56px 22px}
.sl-va-top{align-items:flex-start}
.sl-va-middle{align-items:center}
.sl-va-bottom{align-items:flex-end}
.sl-al-left{justify-content:flex-start;text-align:left}
.sl-al-center{justify-content:center;text-align:center}
.sl-al-right{justify-content:flex-end;text-align:right}
.sl-copy{max-width:680px;display:flex;flex-direction:column;gap:14px}
.sl-al-center .sl-copy{align-items:center}
.sl-al-right  .sl-copy{align-items:flex-end}

.sl-light{color:#fff}
.sl-light .sl-heading,.sl-light .sl-eyebrow{color:#fff}
.sl-light .sl-text{color:rgba(255,255,255,.88)}
.sl-dark{color:var(--ink,#131a19)}
.sl-dark .sl-text{color:var(--ink-3,#6b7a78)}

.sl-eyebrow{margin:0;font-size:12.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.sl-heading{margin:0;font-size:var(--h1,46px);line-height:var(--heading-lh,1.15);
  letter-spacing:var(--heading-spacing,-.02em);text-wrap:balance}
.sl-text{margin:0;font-size:18px;line-height:1.6;max-width:56ch}
.sl-actions{margin:8px 0 0;display:flex;gap:12px;flex-wrap:wrap}
.sl-light .btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.sl-light .btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}

/* Controls. 44px is the smallest target that is reliably hittable with a thumb,
   so the arrows are that big even though the glyph inside is not. */
.sl-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;
  width:44px;height:44px;display:flex;align-items:center;justify-content:center;
  border:0;border-radius:50%;cursor:pointer;color:#fff;
  background:rgba(11,15,14,.42);backdrop-filter:blur(3px);transition:background .18s}
.sl-arrow:hover{background:rgba(11,15,14,.72)}
.sl-arrow:focus-visible{outline:2px solid #fff;outline-offset:2px}
.sl-arrow .icon{width:22px;height:22px;stroke:currentColor;stroke-width:2;fill:none}
.sl-prev{left:14px}
.sl-next{right:14px}

.sl-nav{position:absolute;left:0;right:0;bottom:16px;z-index:3;
  display:flex;align-items:center;justify-content:center;gap:14px}
.sl-dots{display:flex;gap:8px}
.sl-dot{width:10px;height:10px;padding:0;border:0;border-radius:50%;cursor:pointer;
  background:rgba(255,255,255,.45);transition:background .18s,transform .18s}
.sl-dot:hover{background:rgba(255,255,255,.8)}
.sl-dot.is-active{background:#fff;transform:scale(1.25)}
.sl-dot:focus-visible{outline:2px solid #fff;outline-offset:3px}
.sl-counter{margin:0;font-size:13px;color:#fff;font-variant-numeric:tabular-nums;
  text-shadow:0 1px 3px rgba(0,0,0,.5)}

/* The live region is spoken, never seen — and is only filled when the visitor
   drove the change, so autoplay does not interrupt a screen reader every six
   seconds. */
.sl-live{position:absolute!important;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}

.sl-single .sl-track{overflow:visible}

@media(max-width:700px){
  .sl-inner{padding:44px 20px}
  .sl-heading{font-size:var(--h2,34px)}
  .sl-text{font-size:16px}
  .sl-arrow{width:38px;height:38px}
  .sl-prev{left:8px}
  .sl-next{right:8px}
  /* On a phone the arrows overlap the words at centre alignment, and the swipe
     is right there anyway — dots are enough. */
  .sl-al-center .sl-arrow{display:none}
}

@media(prefers-reduced-motion:reduce){
  .sl-track{scroll-behavior:auto}
  .sl-fade .sl-item{transition:none}
  .sl-video{display:none}
}


/* --- sliding_box --- */
.slbox{display:block;position:relative;overflow:hidden;border-radius:14px;text-decoration:none}
.slbox-media img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .35s}
.slbox-plate{position:absolute;left:0;right:0;bottom:0;background:var(--slbox-bg,var(--accent));color:#fff;
  padding:14px 18px;transform:translateY(calc(100% - 52px));transition:transform .3s}
.slbox-title{margin:0;font-size:17px;line-height:52px;line-height:1.4;color:#fff}
.slbox-text{margin:8px 0 4px;font-size:14.5px;line-height:1.55;color:rgba(255,255,255,.85)}
.slbox:hover .slbox-plate,.slbox:focus-visible .slbox-plate{transform:none}
.slbox:hover .slbox-media img{transform:scale(1.05)}
@media(hover:none){.slbox-plate{transform:none}}
.slbox-onlight .slbox-title{color:var(--ink)}
.slbox-onlight .slbox-text{color:var(--ink-3)}


/* --- story_box --- */
.storybox{background:var(--surface-2);border:1px solid var(--line);border-radius:14px;overflow:hidden}
.storybox-media img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover}
.sb-vertical{display:flex}
.sb-vertical .storybox-media{flex:0 0 42%}
.sb-vertical .storybox-media img{height:100%;aspect-ratio:auto;min-height:220px}
.storybox-body{padding:22px 24px;flex:1}
.storybox-title{margin:0 0 8px;font-size:19px}
.storybox-text{margin:0;color:var(--ink-3);line-height:1.65}
.storybox-link{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-weight:600;font-size:15px;text-decoration:none}
.storybox-link:hover{gap:10px}
.storybox-link .icon{width:1em;height:1em;transition:none}
@media(max-width:560px){.sb-vertical{flex-direction:column}.sb-vertical .storybox-media img{min-height:180px}}


/* --- tabs --- */
.tb-nav{display:flex;gap:4px;flex-wrap:wrap;border-bottom:1px solid var(--line);margin-bottom:22px}
.tb-btn{display:inline-flex;align-items:center;gap:8px;background:none;border:0;border-bottom:2px solid transparent;
  padding:11px 16px;font:600 15px/1.3 inherit;color:var(--ink-3);cursor:pointer;margin-bottom:-1px}
.tb-btn:hover{color:var(--ink)}
.tb-btn.is-active{color:var(--accent);border-bottom-color:var(--accent)}
.tb-btn .icon{width:1.1em;height:1.1em}
.tb-panel>:first-child{margin-top:0}
.tb-panel>:last-child{margin-bottom:0}
.tb-panel p{margin:0 0 1em;line-height:1.7}
.tb-side{display:flex;gap:30px;align-items:flex-start}
.tb-side .tb-nav{flex-direction:column;border-bottom:0;border-right:1px solid var(--line);margin:0;
  flex:0 0 min(230px,34%);padding-right:0}
.tb-side .tb-btn{border-bottom:0;border-right:2px solid transparent;margin:0 -1px 0 0;text-align:left;justify-content:flex-start;width:100%}
.tb-side .tb-btn.is-active{border-right-color:var(--accent)}
.tb-side .tb-panels{flex:1;min-width:0}
@media(max-width:700px){.tb-side{flex-direction:column}.tb-side .tb-nav{flex-direction:row;border-right:0;border-bottom:1px solid var(--line);width:100%;flex-basis:auto}.tb-side .tb-btn{width:auto;border-right:0;border-bottom:2px solid transparent;margin-bottom:-1px}}
.tb-title{margin:0 0 14px;font-size:22px}
.tb-centered .tb-nav{justify-content:center}
.tb-boxed .tb-panel{padding:var(--tb-pad,20px);background:var(--surface-2);border:1px solid var(--line);border-radius:10px}


/* --- team --- */
.tm{display:grid;gap:26px}
.tm-c2{grid-template-columns:repeat(2,1fr)}
.tm-c3{grid-template-columns:repeat(3,1fr)}
.tm-c4{grid-template-columns:repeat(4,1fr)}
.tm-item{text-align:center}
.tm-photo{overflow:hidden;margin-bottom:14px;background:var(--surface-2)}
.tm-photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover;transition:transform .4s}
.tm-item:hover .tm-photo img{transform:scale(1.05)}
.tm-rounded .tm-photo{border-radius:14px}
.tm-circle .tm-photo{border-radius:50%;max-width:210px;margin-left:auto;margin-right:auto}
.tm-square .tm-photo{border-radius:0}
.tm-name{margin:0 0 3px;font-size:17.5px;letter-spacing:-.01em}
.tm-name a{text-decoration:none;color:inherit}
.tm-name a:hover{color:var(--accent)}
.tm-role{margin:0 0 9px;font-size:13.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.tm-bio{margin:0;font-size:14.5px;line-height:1.65;color:var(--ink-3)}
@media(max-width:860px){.tm-c4{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.tm-c2,.tm-c3,.tm-c4{grid-template-columns:repeat(2,1fr)}}
.tm-meta{list-style:none;margin:12px 0 0;padding:0;display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.tm-meta a{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);color:var(--ink-3)}
.tm-meta a:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.tm-meta .icon{width:15px;height:15px}
.tm-horizontal .tm-item{display:grid;grid-template-columns:minmax(90px,38%) 1fr;gap:18px;text-align:left;align-items:start}
.tm-horizontal .tm-photo{margin-bottom:0}
.tm-horizontal .tm-body{min-width:0}
.tm-horizontal .tm-meta{justify-content:flex-start}


/* --- testimonials --- */
.ts{display:grid;gap:20px}
.ts-c2{grid-template-columns:repeat(2,1fr)}
.ts-c3{grid-template-columns:repeat(3,1fr)}
.ts-single{grid-template-columns:1fr;max-width:760px;margin:0 auto;text-align:center}
.ts-item{margin:0;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:24px;
  display:flex;flex-direction:column;gap:14px}
.ts-stars{display:flex;gap:3px;color:#e0a02a}
.ts-stars .icon{width:16px;height:16px;fill:currentColor;stroke:none}
.ts-quote{margin:0;font-size:16.5px;line-height:1.7;color:var(--ink-2)}
.ts-single .ts-quote{font-size:clamp(19px,2.4vw,25px);line-height:1.55}
.ts-by{display:flex;align-items:center;gap:12px;margin-top:auto}
.ts-single .ts-by{justify-content:center}
.ts-photo{border-radius:50%;object-fit:cover;width:52px;height:52px}
.ts-by strong{display:block;font-size:15px}
.ts-by em{display:block;font-style:normal;font-size:13.5px;color:var(--ink-3)}
.ts-slider{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:20px;padding-bottom:8px;grid-template-columns:none}
.ts-slider .ts-item{flex:0 0 min(380px,84vw);scroll-snap-align:start}
@media(max-width:860px){.ts-c3{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.ts-c2,.ts-c3{grid-template-columns:1fr}}


/* --- testimonials_list --- */
.tsl{display:grid;gap:22px}
.tsl-item{margin:0;display:grid;grid-template-columns:72px 1fr;gap:20px;align-items:start;padding:22px 24px;background:var(--surface-2);border:1px solid var(--line);border-radius:12px}
.tsl-item:not(:has(.tsl-photo)){grid-template-columns:1fr}
.tsl-photo img{width:72px;height:72px;border-radius:50%;object-fit:cover;display:block}
.tsl-text{margin:0 0 10px;font-size:16.5px;line-height:1.7;color:var(--ink-2);font-style:italic}
.tsl-by strong{display:block;font-size:15px}
.tsl-by strong a{color:inherit;text-decoration:none}
.tsl-by strong a:hover{color:var(--accent)}
.tsl-by em{display:block;font-style:normal;font-size:13.5px;color:var(--ink-3)}
.tsl-quote .tsl-item{grid-template-columns:1fr;text-align:center}
.tsl-quote .tsl-photo{order:2;margin:6px auto 0}
.tsl-quote .tsl-text{font-size:18px}


/* --- text --- */
.tx{line-height:1.7}
.tx>:first-child{margin-top:0}
.tx>:last-child{margin-bottom:0}
.tx p{margin:0 0 1em}
.tx ul,.tx ol{margin:0 0 1em;padding-left:1.25em}
.tx li{margin:.3em 0}
.tx h2,.tx h3,.tx h4{margin:1.6em 0 .5em;line-height:1.25;letter-spacing:-.015em}
.tx blockquote{margin:1.4em 0;padding:2px 0 2px 18px;border-left:3px solid var(--accent);color:var(--ink-3);font-style:italic}
.tx img{max-width:100%;height:auto;border-radius:8px}
.tx-sm{font-size:14.5px}
.tx-lg{font-size:18.5px}
.tx-2col{column-count:2;column-gap:40px}
@media(max-width:700px){.tx-2col{column-count:1}}


/* --- timeline --- */
.tl{list-style:none;margin:0;padding:0 0 0 28px;position:relative}
.tl::before{content:"";position:absolute;left:7px;top:6px;bottom:6px;border-left:2px solid var(--line)}
.tl-item{position:relative;padding:0 0 28px 20px}
.tl-item:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:-28px;top:4px;width:16px;height:16px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--surface,#fff)}
.tl-date{display:inline-block;font-size:12.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin-bottom:4px}
.tl-title{margin:0 0 6px;font-size:18px}
.tl-text{margin:0;color:var(--ink-2);line-height:1.65}


/* --- trailer_box --- */
.trailerbox{display:block;position:relative;overflow:hidden;border-radius:14px;text-decoration:none;background:var(--ink)}
.trailerbox .tb-img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .4s,opacity .4s}
.tb-tall .tb-img{aspect-ratio:3/4}
.trailerbox:hover .tb-img{transform:scale(1.05);opacity:.85}
.tb-gradient::after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(8,11,10,.85))}
.tb-copy{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 20px;display:flex;flex-direction:column;gap:4px}
.tb-plain .tb-copy{position:static;background:var(--surface-2);border:1px solid var(--line);border-top:0;border-radius:0 0 14px 14px}
.tb-slogan{font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-soft,#9fd6db)}
.tb-plain .tb-slogan{color:var(--accent)}
.tb-title{font-size:20px;font-weight:700;letter-spacing:-.01em;color:#fff;line-height:1.3}
.tb-plain .tb-title{color:var(--ink)}


/* --- video --- */
.vid{margin:0}
.vid-r16-9 .vid-frame,.vid-r16-9 video,.vid-r16-9 iframe,.vid-r16-9 .vid-facade{aspect-ratio:16/9}
.vid-r4-3 video,.vid-r4-3 iframe,.vid-r4-3 .vid-facade{aspect-ratio:4/3}
.vid-r1-1 video,.vid-r1-1 iframe,.vid-r1-1 .vid-facade{aspect-ratio:1/1}
.vid-r9-16 video,.vid-r9-16 iframe,.vid-r9-16 .vid-facade{aspect-ratio:9/16;max-width:420px;margin:0 auto}
.vid video,.vid iframe{display:block;width:100%;height:100%;border:0;border-radius:var(--vid-radius,10px);background:#000}
.vid-facade{position:relative;display:block;width:100%;padding:0;border:0;cursor:pointer;background:#000;
  border-radius:var(--vid-radius,10px);overflow:hidden}
.vid-facade img{width:100%;height:100%;object-fit:cover;display:block;opacity:.82;transition:opacity .25s,transform .5s}
.vid-facade:hover img{opacity:.68;transform:scale(1.03)}
.vid-play{position:absolute;inset:0;display:grid;place-items:center}
.vid-play .icon{width:34px;height:34px;fill:#fff;stroke:none;padding:20px;background:rgba(0,0,0,.55);
  border:2px solid rgba(255,255,255,.85);border-radius:50%;box-sizing:content-box;transition:transform .2s,background .2s}
.vid-facade:hover .vid-play .icon{transform:scale(1.08);background:var(--accent)}
.vid figcaption{margin-top:9px;font-size:13.5px;color:var(--ink-3)}


/* --- zoom_box --- */
.zoombox{display:block;position:relative;overflow:hidden;border-radius:14px}
.zoombox .zb-img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .45s}
.zoombox:hover .zb-img,.zoombox:focus-visible .zb-img{transform:scale(1.12)}
.zb-veil{position:absolute;inset:0;background:rgba(11,15,14,.45);opacity:0;transition:opacity .3s}
.zb-inner{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:10px;padding:18px;text-align:center;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.zb-logo{max-width:44%;max-height:38%;object-fit:contain}
.zb-text{color:#fff;font-size:15px;line-height:1.5;font-weight:500}
.zoombox:hover .zb-veil,.zoombox:hover .zb-inner,.zoombox:focus-visible .zb-veil,.zoombox:focus-visible .zb-inner{opacity:1;transform:none}
@media(hover:none){.zb-veil,.zb-inner{opacity:1;transform:none}.zb-veil{background:rgba(11,15,14,.3)}}

