/* Online Kamloops theme layer. Loads after main.css and responsive.css (Adelux).
   Sections: 1 Palette · 2 Base · 3 Header · 4 Buttons · 5 Placeholders · 6 Home · 7 Shared
   8 Shop · 9 Product · 10 Cart/Checkout · 11 Account · 12 Courses · 13 Community · 14 Booking · 15 Forms · 16 Responsive */

/* 1 Palette: brand red replaces Adelux lime */
:root{
  --accent-color-2:#bf1d1d;
  --accent-color-6:#ce302b;
  --ok-red:#bf1d1d;--ok-red-hover:#ce302b;--ok-red-dark:#93090e;
  --ok-tint:#ffece9;--ok-tint-2:#ffdad4;
  --accent-on-dark:#fb8275;
  --ok-line:#E4E4E4;
  --ok-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}

/* 2 Base */
body{background:#fff;-webkit-font-smoothing:antialiased}
a{color:var(--ok-red)}a:hover{color:var(--ok-red-dark)}
h1,h2,h3,h4{text-wrap:balance}
p{text-wrap:pretty}
.ok-muted{color:var(--text-color)}
.ok-note{font:500 12px/1.5 var(--ok-mono);color:#6a6a6a}
.ok-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.ok-hide{display:none!important}

/* white-on-red and tint-on-black corrections for former lime surfaces */
.btn-accent .btn-title{color:#fff}
.btn-accent.bg-accent-color-6{background-color:#fff}
.btn-accent.bg-accent-color-6:hover{background-color:#f2f2f2}
.btn-accent.bg-accent-color-6 .btn-title{color:var(--primary)}
.icon-circle{color:var(--accent-on-dark)}
.chooseus-icon,.service-icon,.booking-cta-icon,.contact-icon,.community-icon,.card-process .icon,.benefit-number,.social-icon,.nav-btn,.close-btn{color:#fff}
.card-process .icon h4,.benefit-number h4{color:#fff!important}
.card-about-detail h4,.card-about-detail .link-wrapper{color:#fff}
.card-membership-cta.cta-content h3,.card-membership-cta.cta-content .check-list.alternative-list li,.card-membership-cta.cta-content .check-list.alternative-list li::before{color:#fff}
.card-contact-cta h2,.card-contact-cta p,.card-contact-cta .primary-accent{color:#fff!important}
.card-contact-cta::before,.card-membership-cta.cta-content::before{background-image:url('../images/swoosh-white.png');opacity:.22;background-position:right bottom}
.sub-heading-banner,.nav-link:hover,.nav-link:focus,.nav-link.active,.navbar-nav .nav-link.show{color:var(--accent-on-dark)!important}
.breadcrumb-item{color:var(--accent-on-dark)}.breadcrumb-item.recent{color:#fff}
.banner-home-social .social-container i,.banner-home-social .social-link-banner:hover{color:var(--accent-on-dark)}
.home-community-highlight,.academy-stat,.card-pricing .price,.meta-data,.form label,.legalink,.recent-post-title:hover,.dropdown-option:hover,.dropdown-option.selected{color:var(--accent-on-dark)}
.pricing-benefit-list li::before,.circle-check-list li::before,.chevron-list li::before,.chevron-circle-list li::before{color:var(--accent-on-dark)}
.legalink:hover{color:#fff}
.accordion-button::after{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="%23ffffff" viewBox="0 0 16 16"><path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4"/></svg>')}
.accordion-button:not(.collapsed)::after{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="%23ffffff" viewBox="0 0 16 16"><path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8"/></svg>');background-color:var(--ok-red-dark)}
.accordion .accordion-button:not(.collapsed){color:var(--primary);background:transparent}
.accordion .accordion-button:focus{box-shadow:none}

/* 3 Header */
html{scroll-padding-top:110px}
.navbar-container:not(.is-ready),.navbar-container:not(.is-ready) *{transition:none!important}
:root{--ok-logo:clamp(96px,10.4vw,150px);--ok-logo-top:-27px}
@media (min-width:1200px){:root{--ok-logo:clamp(200px,17vw,260px);--ok-logo-top:-42px}}
.navbar-container{position:fixed;z-index:100;transition:padding .35s ease;--logo:var(--ok-logo);--logo-top:var(--ok-logo-top)}
.navbar{transition:background-color .35s ease,box-shadow .35s ease}
.navbar-nav-container{transition:padding .35s ease}
.navbar .logo-container{width:var(--logo);flex:0 0 auto;transition:width .35s ease}
.navbar .navbar-brand{display:block;position:relative;width:100%;height:46px;margin:0;padding:0}
.navbar-cta-container .btn-title{transition:padding .35s ease,font-size .35s ease}
.navbar-cta-container .icon-circle{transition:width .35s ease,height .35s ease}
.navbar-container.is-scrolled{padding-top:14px;--logo:46px;--logo-top:0px}
.navbar-container.is-scrolled .navbar{background-color:rgba(12,12,12,.66);box-shadow:0 12px 32px rgba(0,0,0,.28)}
.navbar-container.is-scrolled .navbar::before{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.navbar-container.is-scrolled .navbar-nav-container{padding-top:10px;padding-bottom:10px}
.navbar-container.is-scrolled .ok-icon-btn{width:40px;height:40px;font-size:15px}
.navbar-container.is-scrolled .navbar-cta-container .btn-title{padding:12px 14px;font-size:14px}
.navbar-container.is-scrolled .navbar-cta-container .icon-circle{width:38px;height:38px;font-size:15px}
.sidebar-overlay{z-index:999}
.navbar .logo-container img{position:absolute;left:0;top:var(--logo-top);width:auto;height:var(--logo);max-width:none;display:block;transition:height .35s ease,top .35s ease;filter:drop-shadow(0 8px 16px rgba(0,0,0,.3))}
.navbar .nav-link-container{width:auto;flex:1 1 auto}
.navbar-cta-container{width:auto;flex:0 0 auto;flex-direction:row;align-items:center;justify-content:flex-end;gap:10px}
.dropdown-menu{min-width:210px}
.dropdown-item:hover{background-color:var(--ok-tint);color:var(--ok-red-dark)}
.ok-icon-btn{position:relative;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.28);font-size:17px;transition:all .3s}
.ok-icon-btn:hover{background:rgba(255,255,255,.22);color:#fff}
.ok-badge{position:absolute;top:-5px;right:-5px;min-width:21px;height:21px;border-radius:11px;background:var(--ok-red);color:#fff;font:700 11px/21px var(--font-family-1);text-align:center;padding:0 5px}
.sidebar-header .logo{width:auto}
.sidebar-header .logo img{height:40px;width:auto}
@media (min-width:1026px) and (max-width:1139px){.navbar .nav-link{padding-left:10px;padding-right:10px}}
@media (max-width:1025px){:root{--ok-logo:clamp(150px,24vw,230px);--ok-logo-top:-31px}.navbar-container.is-scrolled{padding-top:10px}}
@media (max-width:767px){:root{--ok-logo:104px;--ok-logo-top:-11px}.navbar-container.is-scrolled{padding-top:8px}}
@media (min-width:1026px){
  .navbar-collapse.collapse{display:flex!important}
  .navbar .navbar-nav{flex-direction:row}
  .navbar .dropdown:hover>.dropdown-menu{display:block}
}
@media (max-width:1025px){.navbar-nav-container{gap:12px}.navbar-cta-container{display:flex}.navbar-cta-container .btn{display:none}.navbar .logo-container{margin-right:auto}}

/* 4 Buttons */
.btn-sm-ok .btn-title{padding:12px 14px;font-size:14px}
.btn-sm-ok .icon-circle{width:38px;height:38px;font-size:15px}
.btn-ink{background:#000;transition:all .6s}.btn-ink:hover{background:#272727}
.btn-ink .btn-title{color:#fff}
.btn-ink .icon-circle{background:var(--ok-red);border-color:var(--ok-red);color:#fff}
.btn-ghost{background:transparent;border:1px solid rgba(255,255,255,.5);transition:all .4s}
.btn-ghost:hover{background:rgba(255,255,255,.14);border-color:#fff}
.btn-ghost .btn-title{color:#fff}
.btn-line{background:transparent;border:1px solid #000;transition:all .4s}
.btn-line:hover{background:#000}.btn-line .btn-title{color:#000}.btn-line:hover .btn-title{color:#fff}
.btn-full{width:100%}.btn-full .btn-title{flex:1;text-align:center}
.btn.is-disabled{opacity:.45;pointer-events:none}

/* 5 Images, placeholders and banners */
.ok-ph{position:relative;width:100%;min-height:120px;display:flex;align-items:center;justify-content:center;text-align:center;padding:14px;border-radius:20px;overflow:hidden;background:repeating-linear-gradient(135deg,#2c2c2c 0 14px,#262626 14px 28px);color:#a3a3a3;font:500 12px/1.5 var(--ok-mono);letter-spacing:.02em}
.ok-ph::after{content:attr(data-label)}
.ok-ph.light{background:repeating-linear-gradient(135deg,#efefef 0 14px,#e8e8e8 14px 28px);color:#666}
.ok-img{display:block;width:100%;max-width:100%;object-fit:cover;object-position:center;border-radius:20px;background:#efefef}
.ok-product__media .ok-img{border-radius:14px}
.ok-img--square{aspect-ratio:1/1;height:auto!important}
.ok-img--portrait{aspect-ratio:3/4;height:auto!important}
.section-banner-inner{background-color:#1a1a1a}
.banner-inner-service{background-image:url('../images/ok-banner-desk-night.jpg')}
.banner-inner-about{background-image:url('../images/ok-banner-grassland-trail.jpg')}
.banner-inner-contact{background-image:url('../images/ok-banner-cafe-window.jpg')}
.banner-inner-coaching{background-image:url('../images/ok-banner-learning-desk.jpg')}
.banner-inner-community{background-image:url('../images/ok-banner-meetup-table.jpg')}
.banner-inner-booking{background-image:url('../images/ok-banner-planner.jpg')}
.banner-inner-coaching::before{opacity:.35}

/* 6 Home */
.ok-num-dot{display:inline-grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:#000;font:700 15px var(--font-family-1);border:5px solid var(--accent-color-6);box-sizing:content-box;width:30px;height:30px}
.ok-num-dot+.ok-num-dot{margin-left:-14px}
.card-banner-reviewer .banner-reviewer-container{display:inline-flex;padding:0}
.banner-home-community .home-community-img .ok-ph{height:170px;border-radius:17px;min-height:0}
.ok-feature .about-img{width:100%}
.ok-reverse{flex-direction:row-reverse}
.ok-cta-media{position:absolute;right:40px;top:40px;bottom:40px;width:32%;z-index:1}
.ok-cta-media .ok-ph{height:100%;border-radius:17px;background:repeating-linear-gradient(135deg,rgba(255,255,255,.12) 0 14px,rgba(255,255,255,.06) 14px 28px);color:#fff}
.ok-cta-media .ok-img{height:100%;border-radius:17px}
.card-contact-cta{overflow:hidden;border-radius:20px}

/* 7 Shared */
.ok-section-head{display:flex;flex-direction:column;gap:20px}
.ok-brand-note{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ok-brand-note img{height:34px;width:auto;background:#000;padding:8px 12px;border-radius:10px}
.ok-lead{font:600 21px/1.5 var(--font-family-1);color:var(--primary);margin:0}
.ok-tag-inline{display:inline-block;font:600 12px/1 var(--font-family-1);padding:6px 10px;border-radius:100px;background:var(--ok-tint);color:var(--ok-red-dark)}
.ok-tag-inline.dark{background:#000;color:#fff}
.ok-tag-inline.line{background:transparent;border:1px solid var(--ok-line);color:var(--text-color)}

.ok-logo-chip{display:inline-flex;background:#000;border-radius:12px;padding:6px}
footer .contact-info-heading{color:#a8a8a8}

/* 8 Shop and product cards */
.ok-card{background:#fff;border:1px solid var(--ok-line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;height:100%;transition:transform .3s,box-shadow .3s}
.ok-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.ok-product__media{position:relative;padding:10px 10px 0}
.ok-product__media .ok-ph{border-radius:14px;min-height:0}
.ok-tag{position:absolute;top:22px;left:22px;z-index:2;background:#000;color:#fff;font:600 12px/1 var(--font-family-1);padding:7px 12px;border-radius:100px}
.ok-tag.red{background:var(--ok-red)}
.ok-product__body{display:flex;flex-direction:column;gap:10px;padding:20px 22px 22px;flex:1}
.ok-product__title{font:700 20px/1.3 var(--font-family-1);margin:0}
.ok-product__desc{font-size:15px;line-height:1.5;color:var(--text-color);margin:0;flex:1}
.ok-product__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px;flex-wrap:wrap}
.ok-price{font:700 22px/1 var(--font-family-1);color:var(--primary)}
.ok-price small{font:500 13px var(--font-family-1);color:var(--text-color)}

.card-pricing>.d-flex:first-child{flex-direction:column;align-items:flex-start!important;justify-content:flex-start!important;gap:6px}
.card-pricing .price-container{margin-top:2px}
.ok-chip{white-space:nowrap}
.ok-product__foot .ok-price small{display:block;margin:5px 0 0}
.ok-price--lg small{display:inline!important;margin-left:6px!important}
.link-wrapper span{white-space:nowrap}
.form input::placeholder,.form textarea::placeholder{color:#9a9a9a}
.form-light input::placeholder,.form-light textarea::placeholder{color:#8c8c8c}
.ok-done{width:100%}
.ok-done__meta{width:100%;justify-content:space-between}
.ok-done__meta div{flex:1 1 150px}
.d-flex.flex-row.align-items-start>.d-flex.flex-column{flex:1 1 0;min-width:0}
@media (max-width:1025px){.welcome-about-wrapper{grid-template-columns:1fr;gap:30px}}
@media (max-width:767px){.contact-icon+.d-flex a,.d-flex.flex-row.align-items-start h4 a{overflow-wrap:anywhere;font-size:18px!important}}
.btn .btn-title{white-space:nowrap}
.service-icon,.chooseus-icon,.booking-cta-icon,.community-icon{align-items:center;justify-content:center}
.ok-ico{font-size:26px;color:#fff}
.card-pricing .underline-pricing{border-color:rgba(255,255,255,.18)}
.card-pricing .price-container{align-items:baseline;white-space:nowrap}
.ok-extras{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.ok-extra{display:flex;align-items:center;gap:12px;color:#fff;font:600 16px/1.3 var(--font-family-1);cursor:pointer;margin:0}
.ok-extra input{width:20px;height:20px;accent-color:var(--ok-red);flex:0 0 auto;margin:0}
.ok-extra__name{flex:1}
.ok-extra__price{color:#c9c9c9;font-weight:500;font-size:14px;white-space:nowrap}
@media (max-width:1025px){
  .banner-home-title{width:100%}
  .banner-home-network{margin-top:30px}
  .banner-home-social{width:auto}
  .card-banner-reviewer{width:auto;min-width:240px}
  .ok-reverse{flex-direction:column-reverse}
}
@media (max-width:767px){
  .ok-cta-media{display:none}
  .card-contact-cta{padding:30px 24px}
  .btn .btn-title{white-space:normal}
}

/* 15 Forms */
.form select{font-family:var(--font-family-2);font-size:16px;line-height:1.3em;padding:17px 44px 17px 17px;border-radius:10px;background-color:var(--primary);color:var(--secondary);border:none;outline:none;appearance:none;-webkit-appearance:none;width:100%;background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="none" stroke="%23ffffff" stroke-width="2" d="M1 1l5 5 5-5"/></svg>');background-repeat:no-repeat;background-position:right 18px center}
.form input:focus,.form textarea:focus,.form select:focus{box-shadow:0 0 0 2px var(--ok-red)}
.form input,.form textarea,.form select{width:100%}
.form input[type=checkbox],.form input[type=radio]{width:20px;height:20px;padding:0;accent-color:var(--ok-red)}
.form-light input,.form-light textarea,.form-light select{background-color:var(--accent-color-3);color:var(--primary)}
.form-light label{color:var(--primary)}
.form-light select{background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="none" stroke="%23000000" stroke-width="2" d="M1 1l5 5 5-5"/></svg>')}
.form-light input::placeholder,.form-light textarea::placeholder{color:#8c8c8c}
.form .ok-help{font-size:14px;color:var(--accent-color-8)}

.ok-tag.grey{background:#444}
.ok-toolbar{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.ok-toolbar__right{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.ok-chips{display:flex;flex-wrap:wrap;gap:10px}
.ok-chip{border:1px solid var(--ok-line);background:#fff;color:var(--primary);font:600 15px/1 var(--font-family-1);padding:13px 20px;border-radius:100px;cursor:pointer;transition:all .25s}
.ok-chip:hover{border-color:var(--ok-red);color:var(--ok-red)}
.ok-chip.active{background:#000;color:#fff;border-color:#000}
.ok-select{font:600 15px/1 var(--font-family-1);padding:13px 42px 13px 18px;border:1px solid var(--ok-line);border-radius:100px;background:#fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path fill="none" stroke="%23000000" stroke-width="2" d="M1 1l5 5 5-5"/></svg>') no-repeat right 16px center;appearance:none;-webkit-appearance:none;color:var(--primary);cursor:pointer}
.ok-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:50;display:flex;align-items:center;gap:14px;background:#000;color:#fff;padding:14px 18px;border-radius:100px;font:600 15px var(--font-family-1);box-shadow:0 14px 40px rgba(0,0,0,.28)}
.ok-toast i.fa-circle-check{color:var(--accent-on-dark)}
.ok-toast__link{color:#fff;text-decoration:underline;text-decoration-color:var(--ok-red);text-underline-offset:5px;font-size:15px}
.ok-toast__link:hover{color:var(--accent-on-dark)}
.ok-toast__x{background:transparent;border:0;color:#bdbdbd;font-size:15px;padding:4px 6px}

/* 9 Product */
.ok-product-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:70px;align-items:start}
.ok-gallery{display:flex;flex-direction:column;gap:12px}
.ok-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ok-thumb{padding:0;border:2px solid transparent;border-radius:16px;background:none;overflow:hidden;cursor:pointer;transition:border-color .2s}
.ok-thumb img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:12px}
.ok-thumb:hover{border-color:#bdbdbd}
.ok-thumb.active{border-color:var(--ok-red)}
.ok-buybox{display:flex;flex-direction:column;gap:22px}
.ok-price--lg{font-size:34px}
.ok-price--lg small{font-size:15px;margin-left:6px}
.ok-inline-note{font:600 15px var(--font-family-1);color:var(--primary);display:flex;align-items:center;gap:8px}
.ok-inline-note i{color:var(--ok-red)}
.ok-inline-note a{font-size:15px;text-decoration:underline;text-underline-offset:4px}
.ok-assure{display:flex;flex-direction:column;gap:12px;padding:22px;background:var(--accent-color-4);border-radius:20px}
.ok-assure div{display:flex;align-items:center;gap:14px;font:600 15px var(--font-family-1);color:var(--primary)}
.ok-assure i{width:36px;height:36px;border-radius:50%;background:var(--ok-red);color:#fff;display:grid;place-items:center;font-size:14px;flex:0 0 auto}
.ok-meta{display:flex;flex-wrap:wrap;gap:8px 28px;font:500 14px var(--font-family-2);color:var(--text-color)}
.ok-meta a{font:600 14px var(--font-family-1)}
.ok-tabs{display:flex;gap:6px;border-bottom:1px solid var(--ok-line);flex-wrap:wrap}
.ok-tab{background:transparent;border:0;border-bottom:3px solid transparent;margin-bottom:-1px;padding:16px 22px;font:600 17px var(--font-family-1);color:var(--text-color);cursor:pointer}
.ok-tab:hover{color:var(--ok-red)}
.ok-tab.active{color:var(--primary);border-bottom-color:var(--ok-red)}
.ok-tabpanel{padding-top:10px;min-height:150px}

/* 10 Cart and checkout */
.ok-steps{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ok-step{display:flex;align-items:center;gap:10px;font:600 16px var(--font-family-1);color:#8c8c8c}
.ok-step__n{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--ok-line);color:#000;font-size:15px}
.ok-step.active,.ok-step.done{color:var(--primary)}
.ok-step.active .ok-step__n{background:var(--ok-red);color:#fff}
.ok-step.done .ok-step__n{background:#000;color:#fff}
.ok-step__line{flex:0 0 60px;height:2px;background:var(--ok-line)}
.ok-cart-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:30px;align-items:start}
.ok-cart-list{display:flex;flex-direction:column;gap:14px}
.ok-cart-row{display:grid;grid-template-columns:96px minmax(0,1fr) auto auto;gap:20px;align-items:center;padding:16px;background:var(--accent-color-4);border:1px solid var(--ok-line);border-radius:20px}
.ok-cart-info{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.ok-cart-info h5{margin:0}
.ok-qty{display:inline-flex;align-items:center;border:1px solid var(--ok-line);background:#fff;border-radius:100px}
.ok-qty button{width:40px;height:40px;border:0;background:transparent;font-size:18px;border-radius:50%}
.ok-qty button:hover{color:var(--ok-red)}
.ok-qty span{min-width:28px;text-align:center;font:700 15px var(--font-family-1)}
.ok-cart-total{display:flex;align-items:center;gap:14px;font:700 18px var(--font-family-1)}
.ok-remove{width:40px;height:40px;border-radius:50%;border:1px solid var(--ok-line);background:#fff;color:var(--text-color);transition:all .25s}
.ok-remove:hover{color:#fff;background:var(--ok-red);border-color:var(--ok-red)}
.ok-coupon{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-top:6px}
.ok-coupon input{flex:1;min-width:200px;padding:14px 18px;border:1px solid var(--ok-line);border-radius:100px;font:400 16px var(--font-family-2);outline:none}
.ok-coupon input:focus{border-color:var(--ok-red)}
.ok-summary{background:#000;color:#fff;border-radius:20px;padding:36px;display:flex;flex-direction:column;gap:16px;position:sticky;top:104px}
.ok-sum-row{display:flex;justify-content:space-between;gap:16px;font:500 16px var(--font-family-2);color:#d6d6d6}
.ok-sum-row span:last-child{color:#fff;font-weight:700;font-family:var(--font-family-1)}
.ok-sum-total{border-top:1px solid rgba(255,255,255,.18);padding-top:16px;font:700 20px var(--font-family-1);color:#fff}
.ok-sum-note{font-size:14px;color:#bdbdbd;margin:0}
.ok-sum-link{color:#fff;text-align:center;text-decoration:underline;text-decoration-color:var(--ok-red);text-underline-offset:5px;font-size:15px}
.ok-sum-link:hover{color:var(--accent-on-dark)}
.ok-sum-item{display:flex;justify-content:space-between;gap:12px;font:600 15px var(--font-family-1);color:#fff}
.ok-sum-item small{display:block;color:#a8a8a8;font:400 13px var(--font-family-2)}
.ok-pay{border:1px solid rgba(255,255,255,.18);border-radius:14px;overflow:hidden}
.ok-pay__head{display:flex;align-items:center;gap:12px;padding:16px;background:var(--primary);color:#fff;font:600 16px var(--font-family-1)}
.ok-pay__body{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px;padding:16px;background:#1b1b1b}
.ok-pay__note{display:flex;align-items:center;gap:8px;font-size:14px;color:#a8a8a8}
.ok-check{display:flex;align-items:flex-start;gap:12px;font:400 15px/1.5 var(--font-family-2);color:#e5e5e5;cursor:pointer}
.ok-check input{margin-top:3px;flex:0 0 auto;width:18px;height:18px;padding:0;accent-color:var(--ok-red)}
.ok-done{display:flex;flex-direction:column;align-items:center;text-align:center;gap:24px;max-width:760px;margin:0 auto}
.ok-done__icon{width:84px;height:84px;border-radius:50%;background:var(--ok-red);color:#fff;display:grid;place-items:center;font-size:34px}
.ok-done__meta{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 36px;padding:20px 28px;background:var(--accent-color-4);border-radius:20px;border:1px solid var(--ok-line)}
.ok-done__meta div{display:flex;flex-direction:column;gap:4px;text-align:left}
.ok-done__meta small{font:500 12px var(--ok-mono);text-transform:uppercase;color:var(--text-color)}
.ok-done__meta strong{font:700 17px var(--font-family-1)}
.ok-done__items{width:100%;display:flex;flex-direction:column;gap:12px;text-align:left}
.ok-empty{padding:70px 30px;text-align:center;background:var(--accent-color-4);border-radius:20px;display:flex;flex-direction:column;align-items:center;gap:20px}

/* 11 Account */
.form label.ok-check{color:#e5e5e5}
.ok-account{display:grid;grid-template-columns:300px minmax(0,1fr);gap:40px;align-items:start}
.ok-account-nav{background:#000;border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:6px;position:sticky;top:104px}
.ok-account-user{display:flex;align-items:center;gap:14px;padding:10px 10px 18px;margin-bottom:8px;border-bottom:1px solid rgba(255,255,255,.14);color:#fff}
.ok-account-user small{display:block;color:#a8a8a8;font:400 13px var(--font-family-2)}
.ok-account-user strong{font:700 17px var(--font-family-1)}
.ok-account-nav button{display:flex;align-items:center;gap:14px;width:100%;padding:14px 16px;border-radius:12px;border:0;background:transparent;color:#fff;font:600 16px var(--font-family-1);text-align:left;transition:background .25s}
.ok-account-nav button:hover{background:rgba(255,255,255,.1)}
.ok-account-nav button.active{background:var(--ok-red)}
.ok-account-nav button i{width:20px;text-align:center;color:var(--accent-on-dark)}
.ok-account-nav button.active i{color:#fff}
.ok-avatar{width:48px;height:48px;border-radius:50%;background:var(--ok-red);color:#fff;display:grid;place-items:center;font:700 16px var(--font-family-1);flex:0 0 auto}
.ok-account-main{display:flex;flex-direction:column;gap:30px;min-width:0}
.ok-progress{height:8px;background:var(--ok-line);border-radius:8px;overflow:hidden}
.ok-progress span{display:block;height:100%;background:var(--ok-red);border-radius:8px}
.ok-status{display:inline-block;padding:6px 12px;border-radius:100px;font:600 13px var(--font-family-1);background:var(--ok-tint);color:var(--ok-red-dark)}
.ok-status.dark{background:#000;color:#fff}
.ok-tag-inline.grey{background:#444;color:#fff}
.ok-orders{display:flex;flex-direction:column;gap:10px}
.ok-orow{display:grid;grid-template-columns:1fr 1.2fr 1.2fr 1fr auto;gap:16px;align-items:center;padding:18px 22px;background:var(--accent-color-4);border:1px solid var(--ok-line);border-radius:16px;font:500 16px var(--font-family-2)}
.ok-orow strong{font-family:var(--font-family-1)}
.ok-orow--head{background:transparent;border:0;padding-bottom:0;font:600 13px var(--ok-mono);text-transform:uppercase;color:var(--text-color)}
.ok-datebox{width:72px;height:72px;border-radius:16px;background:#000;color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ok-datebox small{font:600 12px var(--font-family-1);color:var(--accent-on-dark);letter-spacing:.08em}
.ok-datebox strong{font:700 28px/1 var(--font-family-1)}

/* 12 Courses */
.ok-course-layout{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:40px;align-items:start}
.ok-lessons{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}
.ok-lessons li{display:flex;align-items:center;gap:12px;font:500 17px var(--font-family-2);color:var(--primary)}
.ok-lessons i{color:var(--ok-red);font-size:18px}

/* 13 Community */
.ok-community{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:30px;align-items:start}
.ok-composer{display:flex;align-items:center;gap:14px;padding:16px;background:var(--accent-color-4);border:1px solid var(--ok-line);border-radius:20px}
.ok-composer input{flex:1;min-width:0;border:0;background:transparent;font:400 17px var(--font-family-2);outline:none;padding:10px 4px}
.ok-post{display:flex;flex-direction:column;gap:14px;padding:26px;border:1px solid var(--ok-line);border-radius:20px;background:#fff}
.ok-post header{display:flex;align-items:center;gap:14px}
.ok-post header .ok-tag-inline{margin-left:auto}
.ok-post__who{display:flex;flex-direction:column;gap:2px}
.ok-post__who strong{font:700 16px var(--font-family-1)}
.ok-post__who small{font:400 14px var(--font-family-2);color:var(--text-color)}
.ok-post h4{margin:0;font-size:22px}
.ok-post footer{display:flex;gap:22px;padding-top:6px;border-top:1px solid var(--ok-line)}
.ok-react{display:inline-flex;align-items:center;gap:8px;font:600 15px var(--font-family-1);color:var(--text-color);background:transparent;border:0;padding:10px 0}
.ok-react--btn{cursor:pointer}.ok-react--btn:hover,.ok-react--btn.on{color:var(--ok-red)}
.ok-reply{display:flex;gap:12px;padding:16px;background:var(--accent-color-4);border-radius:14px}
.ok-reply strong{font:700 15px var(--font-family-1);display:block;margin-bottom:4px}
.ok-reply p{font-size:16px}
.ok-avatar--sm{width:36px;height:36px;font-size:12px}
.ok-avatar--dark{background:#000}

/* 14 Booking */
.ok-sessions{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ok-session{display:flex;flex-direction:column;gap:6px;text-align:left;padding:18px;border-radius:14px;border:2px solid transparent;background:var(--primary);color:#fff;font:600 16px var(--font-family-1);cursor:pointer;transition:border-color .25s}
.ok-session span{font:400 14px var(--font-family-2);color:#bdbdbd}
.ok-session:hover{border-color:rgba(255,255,255,.3)}
.ok-session.sel{border-color:var(--ok-red)}
.ok-cal-wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:20px;align-items:start}
.ok-cal{background:var(--primary);border-radius:16px;padding:18px}
.ok-cal__head{display:flex;align-items:center;justify-content:space-between;color:#fff;font:700 17px var(--font-family-1);margin-bottom:14px}
.ok-cal__head button{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:transparent;color:#fff;padding:0}
.ok-cal__head button:disabled{opacity:.3}
.ok-cal__wd,.ok-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.ok-cal__wd span{text-align:center;font:600 12px var(--ok-mono);color:#a8a8a8;padding-bottom:6px}
.ok-day{aspect-ratio:1;border-radius:10px;border:0;background:#363636;color:#fff;font:600 15px var(--font-family-1);transition:background .2s;padding:0;min-width:0}
.ok-day:hover:not(:disabled){background:#4a4a4a}
.ok-day.sel{background:var(--ok-red)}
.ok-day.off{background:transparent;color:#7a7a7a}
.ok-day--blank{visibility:hidden}
.ok-slots{display:flex;flex-direction:column;gap:8px}
.ok-slots small{font:600 13px var(--ok-mono);color:#a8a8a8;margin-bottom:2px}
.ok-slot{padding:13px;border-radius:12px;border:1px solid rgba(255,255,255,.22);background:transparent;color:#fff;font:600 15px var(--font-family-1)}
.ok-slot:hover:not(:disabled){border-color:#fff}
.ok-slot.sel{background:var(--ok-red);border-color:var(--ok-red)}
.ok-slot:disabled{opacity:.35;text-decoration:line-through}
.ok-bsum{display:flex;flex-direction:column;border:1px solid var(--ok-line);border-radius:16px;overflow:hidden}
.ok-bsum div{display:flex;justify-content:space-between;gap:14px;padding:16px 20px;font:500 16px var(--font-family-2)}
.ok-bsum div+div{border-top:1px solid var(--ok-line)}
.ok-bsum strong{font:700 16px var(--font-family-1);text-align:right}
.card-booking-form{width:60%}

/* 16 Responsive */
@media (max-width:1025px){
  .ok-product-layout,.ok-cart-grid,.ok-account,.ok-course-layout,.ok-community{grid-template-columns:1fr}
  .about-image-container .ok-img--square,.ok-gallery,.about-image-container .image-container{max-width:560px;margin-left:auto;margin-right:auto;width:100%}
  .ok-summary,.ok-account-nav{position:static}
  .ok-account-nav{flex-direction:row;flex-wrap:wrap}
  .ok-account-user{width:100%}
  .ok-account-nav button{width:auto;flex:1 1 auto}
  .card-booking-form{width:100%}
  .ok-cta-media{display:none}
  .card-contact-cta{padding:50px}
  .card-contact-cta .contact-cta-content{width:100%}
}
@media (max-width:767px){
  .ok-cart-row{grid-template-columns:72px minmax(0,1fr)}
  .ok-cart-row .ok-cart-qty,.ok-cart-row .ok-cart-total{grid-column:2}
  .ok-orow{grid-template-columns:1fr 1fr}
  .ok-orow--head{display:none}
  .ok-sessions,.ok-cal-wrap{grid-template-columns:1fr}
  .ok-pay__body{grid-template-columns:1fr}
  .ok-product-layout{gap:30px}
  .ok-summary{padding:26px}
  .ok-toast{width:calc(100% - 24px);bottom:12px;border-radius:20px;flex-wrap:wrap}
}


/* 17 Tablet and mobile pass */
@media (max-width:1025px){
  .section{padding-top:80px;padding-bottom:80px}
  .banner-home-container{padding-top:max(200px,calc(var(--ok-logo) + 60px));padding-bottom:80px}
  .section-banner-inner{padding-top:max(190px,calc(var(--ok-logo) + 40px));padding-bottom:70px}
  .nav-btn{width:48px;height:48px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px;order:3}
  .navbar-cta-container{order:2}
  .close-btn{min-width:48px;min-height:48px;border-radius:12px}
  .menu li{padding:0 15px}
  .menu a{padding:14px 0;font-size:18px}
  .sidebar-dropdown-btn{width:48px;height:48px}
  .sidebar-dropdown-menu a{padding:12px 0!important;display:block}
  .ok-sidebar-cta{padding:18px 15px 30px}
  .card-about-detail{padding:26px}
  .link-wrapper,.ok-sum-link,.breadcrumb-item{min-height:44px;display:inline-flex;align-items:center}
  .legalink{display:inline-block;padding:12px 0}
  footer .chevron-list a{display:inline-block;padding:9px 0}
  .footer-social-icon .social-icon{width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center}
  .ok-react{min-height:44px;padding:10px 8px}
  .ok-cal__head button{width:44px;height:44px}
  .banner-home-social .social-container{padding-top:8px;padding-bottom:8px}
}
@media (max-width:767px){
  h1{font-size:40px;line-height:1.08}
  h2{font-size:30px;line-height:1.15}
  h2[style*="font-size"]{font-size:28px!important}
  .section{padding-top:56px;padding-bottom:56px}
  .banner-home-container{padding:150px 16px 56px;border-radius:22px}
  .section-banner-inner{padding:150px 16px 52px;border-radius:22px}
  .banner-home-network,.banner-home-community-container{display:none}
  .banner-home-top{gap:18px}
  .banner-home-bottom{gap:0}
  .banner-home-cta{align-items:stretch;text-align:left}
  .ok-row{flex-direction:column;align-items:stretch}
  .ok-row .btn,.about-description-container .btn,.card-contact-cta .btn,.banner-home-cta .btn{width:100%}
  .ok-row .btn .btn-title,.about-description-container .btn .btn-title,.card-contact-cta .btn .btn-title,.banner-home-cta .btn .btn-title{flex:1;text-align:center}
  .about-wrapper{gap:28px}
  .about-description-container{width:100%;padding-left:18px}
  .card-about-detail{width:92%;padding:20px;gap:12px}
  .card-contact-form,.card-booking-form{padding:22px 16px}
  .ok-tag,.ok-tag-inline{font-size:13px}
  .ok-note,.ok-cal__wd span{font-size:13px}
  .ok-extra{padding:6px 0}
  .ok-extra input{width:24px;height:24px}
  .ok-card{flex-direction:row;align-items:stretch}
  .ok-card .ok-product__media{flex:0 0 40%;max-width:172px;min-height:158px;padding:0}
  .ok-card .ok-product__media .ok-img{position:absolute;inset:8px;width:calc(100% - 16px);height:calc(100% - 16px)!important;border-radius:14px}
  .ok-card .ok-tag{top:16px;left:16px}
  .ok-card .ok-product__body{padding:14px 14px 14px 8px;gap:6px;justify-content:center}
  .ok-card .ok-product__title{font-size:16px}
  .ok-card .ok-product__desc{display:none}
  .ok-card .ok-product__foot{flex-direction:column;align-items:stretch;gap:8px;margin-top:2px}
  .ok-card .ok-product__foot .btn{width:100%}
  .ok-card .ok-product__foot .btn .btn-title{flex:1;text-align:center;padding:11px 10px;font-size:14px}
  .ok-card .ok-product__foot .btn .icon-circle{width:36px;height:36px}
  .ok-cart-row .ok-img{height:72px!important;width:72px}
  .ok-snap{display:flex!important;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin-left:-20px;margin-right:-20px;padding:0 20px 8px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ok-snap::-webkit-scrollbar{display:none}
  .ok-snap>.col{flex:0 0 78%;max-width:78%;scroll-snap-align:start;padding:0;margin:0}
  .ok-snap .service-img{height:380px!important}
  .ok-cal{padding:12px}
  .ok-cal__wd,.ok-cal__grid{gap:3px}
  .ok-day{aspect-ratio:auto;height:40px;border-radius:8px}
  .ok-account-user{flex:1 0 100%}
  .ok-account-nav button{flex:1 1 calc(50% - 6px)}
  .ok-gallery{gap:10px}
  .ok-thumbs{gap:8px}
  .navbar-nav-container{padding:12px 14px}
  footer .chevron-list a{padding:12px 0}
  .footer-legalink-container a{display:inline-block;padding:7px 0}
  .service-detail{padding:14px 14px 14px 16px;gap:10px}
  .service-detail h4{font-size:17px}
  .service-detail .icon-circle{width:42px;height:42px}
  .ok-snap>.col{flex-basis:84%;max-width:84%}
}

/* 18 Hero logo clearance (desktop) and Home feature rows (tablet, mobile) */
@media (min-width:1026px){
  .banner-home-container{padding-top:max(250px,calc(var(--ok-logo) + 66px))}
  .section-banner-inner{padding-top:max(230px,calc(var(--ok-logo) + 40px))}
}
@media (max-width:1025px){
  .ok-feat{padding-bottom:48px}
  .ok-feat .about-wrapper{display:grid;grid-template-columns:minmax(0,1fr) 160px;grid-template-areas:"head thumb" "body body";gap:26px 28px;align-items:center}
  .ok-feat .about-content-description{display:contents}
  .ok-feat .about-content-description>.d-flex{grid-area:head;gap:16px}
  .ok-feat .about-image-container{grid-area:thumb;width:160px}
  .ok-feat .about-image-container .ok-img--square{width:100%;max-width:none;margin:0;border-radius:16px}
  .ok-feat .about-description-container{grid-area:body;width:100%}
  .ok-feat h2{font-size:38px;line-height:1.12}
}
@media (max-width:767px){
  .ok-feat{padding-bottom:36px}
  .ok-feat .about-wrapper{grid-template-columns:minmax(0,1fr) 96px;gap:20px 16px}
  .ok-feat .about-content-description>.d-flex{gap:12px}
  .ok-feat .about-image-container{width:96px}
  .ok-feat .about-image-container .ok-img--square{border-radius:12px}
  .ok-feat h2{font-size:24px;line-height:1.18}
}

/* 19 Services page: equal pricing cards, bundled order row, service pull-downs */
.section-pricing .row>.col{display:flex}
.section-pricing .card-pricing{flex:1 1 100%;min-width:0}
.card-pricing .ok-push{margin-top:auto}
.ok-extra--site{padding:14px 16px;border:1px solid rgba(255,255,255,.22);border-radius:14px;background:rgba(255,255,255,.05);transition:border-color .25s,background-color .25s}
.ok-extra--site:has(input:checked){border-color:var(--ok-red);background:rgba(191,29,29,.18)}
.ok-extra--site .ok-extra__name small{display:block;margin-top:3px;font:400 13px/1.3 var(--font-family-2);color:#c9c9c9}
.ok-extra--site .ok-extra__price{color:#fff;font-size:17px;font-weight:700}
.ok-extra-sep{height:1px;background:rgba(255,255,255,.18)}
.ok-svc{display:flex;flex-direction:column;interpolate-size:allow-keywords}
.ok-svc details{border-bottom:1px solid var(--text-color)}
.ok-svc summary{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;list-style:none;cursor:pointer;color:#fff;font:700 1.5rem/1.3 var(--font-family-1)}
.ok-svc summary::-webkit-details-marker{display:none}
.ok-svc summary::after{content:"";flex:0 0 auto;width:36px;height:36px;border-radius:50%;background:var(--ok-red) url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="%23ffffff" viewBox="0 0 16 16"><path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4"/></svg>') center/18px 18px no-repeat;transition:background-color .25s}
.ok-svc details[open] summary::after{background-color:var(--ok-red-dark);background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="%23ffffff" viewBox="0 0 16 16"><path d="M4 8a.5.5 0 0 1 .5-.5h7a.5.5 0 0 1 0 1h-7A.5.5 0 0 1 4 8"/></svg>')}
.ok-svc summary:hover::after{background-color:var(--ok-red-hover)}
.ok-svc details[open] summary:hover::after{background-color:var(--ok-red)}
.ok-svc summary:focus-visible{outline:2px solid var(--accent-on-dark);outline-offset:4px;border-radius:8px}
.ok-svc details::details-content{block-size:0;overflow-y:clip;transition:block-size .3s ease,content-visibility .3s allow-discrete}
.ok-svc details[open]::details-content{block-size:auto}
.ok-svc__pts{list-style:none;margin:0;padding:0 0 24px;display:flex;flex-direction:column;gap:14px}
.ok-svc__pts li{position:relative;padding-left:32px;color:#e5e5e5;font:400 17px/1.5 var(--font-family-2)}
.ok-svc__pts li::before{content:"\f058";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:2px;font-size:16px;color:var(--accent-on-dark)}
.ok-svc__pts strong{color:#fff;font:600 17px/1.5 var(--font-family-1)}
@media (max-width:767px){.ok-svc summary{font-size:1.2rem;padding:16px 0}.ok-svc__pts li,.ok-svc__pts strong{font-size:16px}}

/* 20 Domains, hosting and e-mail call-out (DomainsCallout) */
.ok-callout{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px 50px;align-items:center;padding:44px;background:var(--accent-color-3);border:1px solid var(--ok-line);border-radius:20px}
.ok-callout__intro{display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.ok-callout__intro h3{margin:0;font-size:30px;line-height:1.15}
.ok-callout__intro p{margin:0}
.ok-callout__intro .btn{max-width:100%}
.ok-callout__tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-self:center}
.ok-callout__tile{display:flex;flex-direction:column;gap:18px;padding:22px;background:var(--ok-card,#fff);border:1px solid var(--ok-line);border-radius:16px;color:var(--primary);text-decoration:none;transition:transform .3s,box-shadow .3s,border-color .3s}
.ok-callout__tile:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.1);border-color:var(--ok-red);color:var(--primary)}
.ok-callout__icon{flex:0 0 auto;width:50px;height:50px;border-radius:15px;background:var(--ok-red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px}
.ok-callout__txt{display:flex;flex-direction:column;gap:6px;min-width:0}
.ok-callout__txt strong{font:700 18px/1.25 var(--font-family-1)}
.ok-callout__txt span{font:400 15px/1.45 var(--font-family-2);color:var(--text-color)}
@media (max-width:1199px){
  .ok-callout{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:30px 40px;padding:34px}
  .ok-callout__intro h3{font-size:26px}
  .ok-callout__tiles{grid-template-columns:1fr;gap:12px}
  .ok-callout__tile{flex-direction:row;align-items:center;gap:14px;padding:14px 16px}
  .ok-callout__icon{width:44px;height:44px;border-radius:12px;font-size:18px}
  .ok-callout__txt strong{font-size:16px}
  .ok-callout__txt span{font-size:14px}
}
@media (max-width:767px){
  .ok-callout{grid-template-columns:1fr;padding:24px 18px;gap:22px;border-radius:18px}
  .ok-callout__intro h3{font-size:24px}
  .ok-callout__intro p,.ok-callout__txt span{display:none}
  .ok-callout__intro .btn{width:100%}
  .ok-callout__intro .btn .btn-title{flex:1;text-align:center}
  .ok-callout__tiles{gap:10px}
  .ok-callout__tile{padding:12px 14px}
}

/* 21 Audit fixes: tap targets, contrast, off-canvas menu focus */
.ok-step{color:#6a6a6a}
.banner-home-social .social-link-banner::after{content:"";position:absolute;inset:0;border-radius:inherit}
.ok-composer input{min-height:44px}
.sidebar{visibility:hidden;transition:transform .4s ease-in-out,visibility 0s linear .4s}
.sidebar.active{visibility:visible;transition-delay:0s}
@media (max-width:1025px){
  footer .chevron-list a{padding:13px 0}
  .ok-chip,.ok-select{min-height:44px}
  .ok-extra{min-height:44px}
  .ok-day{height:44px}
  .breadcrumb-item{min-width:44px;justify-content:center}
}
@media (max-width:767px){
  footer .chevron-list a{padding:13px 0}
  .service-detail .icon-circle{width:44px;height:44px}
}

/* 22 Small desktop (1026-1279): room for the Blog link and a hero-sized logo */
@media (min-width:1026px) and (max-width:1199px){:root{--ok-logo:clamp(170px,16.5vw,200px);--ok-logo-top:-36px}}
@media (min-width:1026px) and (max-width:1279px){.navbar-cta-container .btn{display:none}}

/* 23 Blog index and article */
.banner-inner-blog{background-image:url('../images/ok-banner-learning-desk.jpg')}
.banner-inner-blog::before{opacity:.35}
.ok-meta-line{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;font:500 14px/1.5 var(--font-family-2);color:var(--text-color)}
.ok-meta-line .dot{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.55}
.ok-meta-line--dark{color:#e5e5e5;justify-content:center}
.ok-post{position:relative}
.ok-stretch{color:inherit}
.ok-stretch::after{content:"";position:absolute;inset:0;z-index:1}
.ok-stretch:hover{color:var(--ok-red)}
.ok-post .link-wrapper{font-size:15px}
.ok-post-feature{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);background:#fff;border:1px solid var(--ok-line);border-radius:20px;overflow:hidden}
.ok-post-feature__media{position:relative;display:block;min-height:400px;overflow:hidden}
.ok-post-feature__media img{position:absolute;inset:0;width:100%;height:100%;border-radius:0;transition:transform .6s ease}
.ok-post-feature:hover .ok-post-feature__media img{transform:scale(1.04)}
.ok-post-feature__body{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:18px;padding:48px}
.ok-post-feature__title{margin:0;font-size:38px;line-height:1.15}
.ok-post-feature__title a{color:var(--primary)}
.ok-post-feature__title a:hover{color:var(--ok-red)}
.ok-pagination{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.ok-pagination a{min-width:48px;height:48px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--ok-line);border-radius:100px;background:#fff;color:var(--primary);font:600 15px var(--font-family-1);text-decoration:none;transition:all .25s}
.ok-pagination a:hover{border-color:var(--ok-red);color:var(--ok-red)}
.ok-pagination a.active{background:#000;border-color:#000;color:#fff}
.ok-post-title{font-size:64px;line-height:1.1;max-width:920px}
.ok-post-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:60px;align-items:start}
.ok-article{display:flex;flex-direction:column;gap:22px;min-width:0;max-width:800px}
.ok-article p,.ok-article li{font:400 18px/1.7 var(--font-family-2);color:var(--text-color);margin:0}
.ok-article .ok-lead{font:600 22px/1.5 var(--font-family-1);color:var(--primary)}
.ok-article h2{font-size:34px;line-height:1.2;margin:14px 0 0;scroll-margin-top:120px}
.ok-article .check-list{margin:0}
.ok-quick{display:flex;flex-direction:column;gap:10px;padding:26px 28px;background:var(--ok-tint);border-radius:20px}
.ok-quick__label{align-self:flex-start;padding:6px 12px;border-radius:100px;background:var(--ok-red);color:#fff;font:600 12px/1 var(--font-family-1);letter-spacing:.06em;text-transform:uppercase}
.ok-article .ok-quick p{color:var(--primary);font-size:19px;line-height:1.6}
.ok-article .accordion{margin-top:6px}
.ok-author{display:flex;align-items:center;gap:16px;margin-top:10px;padding:22px;border:1px solid var(--ok-line);border-radius:20px;background:var(--accent-color-4)}
.ok-author strong{display:block;margin-bottom:4px;font:700 16px var(--font-family-1);color:var(--primary)}
.ok-author p{font-size:15px}
.ok-aside{position:sticky;top:110px;display:flex;flex-direction:column;gap:22px}
.ok-toc{padding:26px;border:1px solid var(--ok-line);border-radius:20px;background:#fff}
.ok-toc h4{margin:0 0 14px;font-size:18px}
.ok-toc ol{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}
.ok-toc a{display:block;padding:9px 0;color:var(--primary);font:600 15px/1.4 var(--font-family-1);text-decoration:none;border-bottom:1px solid var(--ok-line)}
.ok-toc li:last-child a{border-bottom:0}
.ok-toc a:hover{color:var(--ok-red)}
.ok-aside-cta{display:flex;flex-direction:column;gap:14px;padding:28px;border-radius:20px;background:#000;color:#fff}
.ok-aside-cta h4{margin:0;color:#fff;font-size:22px}
.ok-aside-cta p{margin:0;color:#d6d6d6;font-size:16px;line-height:1.5}
@media (max-width:1025px){
  .ok-post-feature{grid-template-columns:1fr}
  .ok-post-feature__media{min-height:0;aspect-ratio:16/9}
  .ok-post-feature__body{padding:32px}
  .ok-post-feature__title{font-size:30px}
  .ok-post-title{font-size:48px}
  .ok-post-layout{grid-template-columns:1fr;gap:40px}
  .ok-article{max-width:none}
  .ok-aside{position:static}
  .ok-toc{display:none}
  .ok-article h2{font-size:30px}
}
@media (max-width:767px){
  .ok-post-feature__body{padding:22px;gap:14px}
  .ok-post-feature__title{font-size:24px}
  .ok-post-feature__media{aspect-ratio:3/2}
  .ok-post-title{font-size:32px}
  .ok-meta-line{font-size:13px}
  .ok-article p,.ok-article li{font-size:17px}
  .ok-article .ok-lead{font-size:19px}
  .ok-article h2{font-size:26px}
  .ok-quick{padding:20px}
  .ok-article .ok-quick p{font-size:17px}
  .ok-post .ok-product__foot{display:none}
  .ok-post .ok-meta-line{font-size:12px}
  .ok-pagination a{min-width:44px;height:44px}
}

/* 24 Services portal (services.onlinekamloops.ca) */
.ok-hero-portal .banner-home-title{width:72%}
.ok-hero-portal h1{font-size:72px;line-height:1.05}
.ok-hero-portal .banner-home-cta-container{margin-left:auto}
.ok-store-grid .col,.ok-plans .col{display:flex}
.ok-store-card{position:relative;display:flex;flex-direction:column;gap:14px;width:100%;padding:28px;background:#fff;border:1px solid var(--ok-line);border-radius:20px;transition:transform .3s,box-shadow .3s}
.ok-store-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.ok-store-card__icon{flex:0 0 auto;width:60px;height:60px;border-radius:17px;background:var(--ok-red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px}
.ok-store-card h3{margin:0;font-size:24px;line-height:1.2}
.ok-store-card h3 a{color:var(--primary)}
.ok-store-card h3 a:hover{color:var(--ok-red)}
.ok-store-card p{margin:0;font-size:16px;line-height:1.5}
.ok-store-card__from{margin-top:auto;font:700 17px var(--font-family-1);color:var(--primary)}
.ok-store-card__from small{font:500 14px var(--font-family-2);color:var(--text-color)}
.ok-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.ok-trust__item{display:flex;align-items:center;gap:16px;padding:22px;background:var(--accent-color-3);border-radius:20px;font:600 17px/1.4 var(--font-family-1);color:var(--primary)}
.ok-trust__item i{flex:0 0 auto;width:50px;height:50px;border-radius:15px;background:var(--ok-red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px}
.ok-plan{display:flex;flex-direction:column;gap:16px;width:100%;padding:32px;background:#fff;border:1px solid var(--ok-line);border-radius:20px;transition:transform .3s,box-shadow .3s}
.ok-plan:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(0,0,0,.08)}
.ok-plan.is-selected{border-color:var(--ok-red);box-shadow:0 0 0 2px var(--ok-red)}
.ok-plan__head{display:flex;flex-direction:column;gap:8px}
.ok-plan__name{margin:0;font-size:22px;line-height:1.25}
.ok-plan__price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.ok-plan__price .amt{font:700 38px/1 var(--font-family-1);color:var(--ok-red)}
.ok-plan__price .per{font:500 15px var(--font-family-2);color:var(--text-color)}
.ok-plan__blurb{margin:0;font-size:16px;line-height:1.5}
.ok-plan__list,.ok-config__specs{list-style:none;margin:0;padding:18px 0 0;display:flex;flex-direction:column;gap:11px}
.ok-plan__list{border-top:1px solid var(--ok-line);margin-bottom:8px}
.ok-plan__list li,.ok-config__specs li{position:relative;padding-left:28px;font:500 15px/1.4 var(--font-family-2);color:var(--primary)}
.ok-plan__list li::before,.ok-config__specs li::before{content:"\f058";font-family:"Font Awesome 6 Free";font-weight:900;position:absolute;left:0;top:1px;font-size:15px;color:var(--ok-red)}
.ok-plan .btn{margin-top:auto;width:100%}
.ok-plan .btn .btn-title{flex:1;text-align:center}
.ok-fine{margin:0;font:400 13px/1.5 var(--font-family-2);color:var(--text-color)}
.ok-domain-box{display:flex;flex-direction:column;gap:22px;padding:40px;background:#000;border-radius:20px;color:#fff}
.ok-search{display:flex;gap:10px;align-items:center}
.ok-search input{flex:1 1 auto;min-width:0;height:60px;padding:0 24px;border:0;border-radius:100px;background:#fff;color:#111;font:500 17px var(--font-family-2);outline:none}
.ok-search input::placeholder{color:#6a6a6a}
.ok-search input:focus{box-shadow:0 0 0 3px var(--ok-red)}
.ok-search .btn{flex:0 0 auto}
.ok-results{display:flex;flex-direction:column;gap:10px}
.ok-result{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:16px;align-items:center;padding:14px 16px 14px 22px;border:1px solid rgba(255,255,255,.18);border-radius:16px;color:#fff}
.ok-result strong{font:700 20px var(--font-family-1);overflow-wrap:anywhere}
.ok-result__price{font:600 15px var(--font-family-2);color:#d6d6d6;white-space:nowrap}
.ok-result .btn-sm-ok .btn-title{padding:11px 14px;font-size:14px}
.ok-domain-box .ok-fine{color:#bdbdbd}
.ok-table-wrap{border:1px solid var(--ok-line);border-radius:20px;overflow:hidden;background:#fff}
.ok-config{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:stretch}
.ok-config__controls{display:flex;flex-direction:column;gap:18px;padding:32px;background:#fff;border:1px solid var(--ok-line);border-radius:20px}
.ok-config__label{font:600 13px var(--ok-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-color)}
.ok-config__controls .ok-select{width:100%}
.ok-config__detail{display:flex;flex-direction:column;gap:16px;padding:32px;background:#000;color:#fff;border-radius:20px}
.ok-config__detail h3{margin:0;color:#fff;font-size:24px;line-height:1.25}
.ok-config__detail .price{font:700 40px/1 var(--font-family-1);color:var(--accent-on-dark)}
.ok-config__detail .per{margin-left:8px;font:500 15px var(--font-family-2);color:#c9c9c9}
.ok-config__specs{border-top:1px solid rgba(255,255,255,.18)}
.ok-config__specs li{color:#e5e5e5;font-size:16px}
.ok-config__specs li::before{color:var(--accent-on-dark)}
.ok-config__detail .btn{margin-top:auto}
.ok-ssl{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));gap:10px;align-items:stretch}
.ok-ssl__h{align-self:end;padding:0 4px 4px;text-align:center;font:600 12px/1.3 var(--ok-mono);text-transform:uppercase;color:var(--text-color)}
.ok-ssl__row{display:flex;align-items:center;padding-right:10px;font:700 17px var(--font-family-1);color:var(--primary)}
.ok-ssl__cell{min-height:52px;padding:12px 6px;border:1px solid var(--ok-line);border-radius:14px;background:#fff;color:var(--primary);font:700 16px var(--font-family-1);cursor:pointer;transition:border-color .2s,background-color .2s}
.ok-ssl__cell:hover:not(:disabled){border-color:var(--ok-red)}
.ok-ssl__cell.active{border-color:var(--ok-red);background:var(--ok-tint);color:var(--ok-red-dark)}
.ok-ssl__cell:disabled{opacity:.5;cursor:not-allowed;border-style:dashed}
.ok-promo-code{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;padding:10px 10px 10px 16px;border:1px dashed rgba(255,255,255,.4);border-radius:14px;color:#fff}
.ok-promo-code__label{font:600 12px var(--ok-mono);letter-spacing:.04em;text-transform:uppercase;color:#c9c9c9}
.ok-promo-code code{font:700 17px var(--ok-mono);color:#fff;background:transparent;padding:0;letter-spacing:.04em}
.ok-copy{margin-left:auto;min-height:44px;padding:0 18px;border:1px solid rgba(255,255,255,.4);border-radius:100px;background:transparent;color:#fff;font:600 14px var(--font-family-1);cursor:pointer;transition:background-color .2s}
.ok-copy:hover{background:rgba(255,255,255,.14)}
.ok-bundle-layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:40px;align-items:start}
.ok-steps-col{display:flex;flex-direction:column;gap:24px;min-width:0}
.ok-step-block{display:flex;flex-direction:column;gap:20px;padding:32px;background:#fff;border:1px solid var(--ok-line);border-radius:20px}
.ok-step-block h2{margin:0;font-size:32px;line-height:1.2}
.ok-summary-card{position:sticky;top:110px;display:flex;flex-direction:column;gap:14px;padding:28px;background:#000;color:#fff;border-radius:20px}
.ok-summary-card h3{margin:0;color:#fff;font-size:22px}
.ok-summary-card ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ok-summary-card li{display:flex;justify-content:space-between;gap:14px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.18);font:500 15px/1.4 var(--font-family-2);color:#e5e5e5}
.ok-summary-card li strong{color:#fff;font:600 15px var(--font-family-1);white-space:nowrap}
.ok-summary-card .ok-fine{color:#bdbdbd}
.ok-select-btn{min-height:48px}
@media (max-width:1025px){
  .ok-hero-portal h1{font-size:54px}
  .ok-hero-portal .banner-home-title{width:100%}
  .ok-trust{grid-template-columns:1fr}
  .ok-config{grid-template-columns:1fr}
  .ok-bundle-layout{grid-template-columns:1fr;gap:28px}
  .ok-summary-card{position:static}
  .ok-domain-box{padding:30px}
}
@media (max-width:767px){
  .ok-hero-portal h1{font-size:34px}
  .ok-store-card{flex-direction:row;align-items:center;gap:16px;padding:16px 18px}
  .ok-store-card__icon{width:48px;height:48px;border-radius:14px;font-size:20px}
  .ok-store-card p{display:none}
  .ok-store-card__from{margin-top:0}
  .ok-store-card h3{font-size:19px}
  .ok-plan{padding:24px}
  .ok-plan__price .amt{font-size:32px}
  .ok-domain-box{padding:22px 18px}
  .ok-search input{height:54px}
  .ok-result{grid-template-columns:minmax(0,1fr) auto;gap:10px 12px;padding:14px}
  .ok-result .ok-tag-inline{justify-self:start}
  .ok-config__controls,.ok-config__detail,.ok-step-block{padding:22px 18px}
  .ok-ssl{grid-template-columns:auto repeat(3,minmax(0,1fr));gap:6px}
  .ok-ssl__cell{padding:10px 2px;font-size:14px}
  .ok-ssl__row{font-size:15px;padding-right:4px}
  .ok-step-block h2{font-size:26px}
}

/* 24b Portal tables and light variants */
.ok-trow{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:12px;padding:18px 26px;font:500 17px var(--font-family-2);color:var(--primary)}
.ok-trow+.ok-trow{border-top:1px solid var(--ok-line)}
.ok-trow>span:first-child{font:700 20px var(--font-family-1)}
.ok-trow--head{background:var(--accent-color-4);color:var(--text-color);font:600 13px var(--ok-mono);letter-spacing:.04em;text-transform:uppercase}
.ok-trow--head>span:first-child{font:600 13px var(--ok-mono)}
.ok-search--light input{background:var(--accent-color-3)}
.ok-results--light .ok-result{border-color:var(--ok-line);color:var(--primary);background:#fff}
.ok-results--light .ok-result__price{color:var(--text-color)}
.ok-results--light .ok-result.is-selected{border-color:var(--ok-red);background:var(--ok-tint)}
.ok-step-block .ok-fine{color:var(--text-color)}
.ok-promo-code--light{color:var(--primary);border-color:var(--ok-line)}
.ok-promo-code--light .ok-promo-code__label{color:var(--text-color)}
.ok-promo-code--light code{color:var(--primary)}
.ok-promo-code--light .ok-copy{border-color:var(--ok-line);color:var(--primary)}
.ok-promo-code--light .ok-copy:hover{background:var(--accent-color-3)}
@media (max-width:767px){.ok-trow{padding:14px 16px;font-size:15px}.ok-trow>span:first-child{font-size:18px}}

/* 25 Footer tap targets (short link labels, logo link) */
@media (max-width:1025px){
  footer .chevron-list a{min-width:44px}
  .footer-legalink-container a{display:inline-block;padding:7px 0}
}