.cat-tabs{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:14px}.cat-tabs button{border:1px solid #d9dfee;background:#fff;border-radius:999px;padding:8px 18px;font-weight:600;cursor:pointer;font-family:inherit}.cat-tabs button.on{background:#1d6bff;color:#fff;border-color:#1d6bff}
.plan-badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#ff8a1f,#ff3d8b);color:#fff;font-size:12px;font-weight:700;padding:3px 14px;border-radius:999px;white-space:nowrap}

:root{--catalog-surface:oklch(1 0 0);--catalog-ink:oklch(.22 .05 275);--catalog-muted:oklch(.5 .03 265);--catalog-brand:oklch(.55 .23 263);--catalog-tint:oklch(.97 .012 263);--catalog-border:oklch(.91 .02 263);--catalog-shadow:0 12px 32px color-mix(in oklch,var(--catalog-ink) 12%,transparent)}
.public-navigation>a,.catalog-menu summary{color:var(--catalog-ink);text-decoration:none;font-size:14px;font-weight:500;white-space:nowrap}
.public-navigation>a:hover,.catalog-menu summary:hover{color:var(--catalog-brand)}
.public-navigation .public-home{background:var(--catalog-brand);color:var(--catalog-surface);border-radius:6px;padding:9px 16px}
.catalog-menu{position:relative}.catalog-menu summary{display:flex;align-items:center;gap:5px;cursor:pointer;list-style:none;padding:9px 0}
.catalog-menu summary::-webkit-details-marker{display:none}
.catalog-dropdown{position:absolute;top:100%;left:0;width:300px;max-width:calc(100vw - 32px);background:var(--catalog-surface);border:1px solid var(--catalog-border);border-radius:8px;padding:6px;box-shadow:var(--catalog-shadow);z-index:40;max-height:70dvh;overflow:auto}
.catalog-dropdown>a{display:flex;align-items:center;gap:10px;padding:12px 10px;border-radius:5px;color:var(--catalog-ink);text-decoration:none}
.catalog-dropdown>a:hover{background:var(--catalog-tint)}.catalog-dropdown>a>span{color:var(--catalog-brand)}.catalog-dropdown>a>div{flex:1;min-width:0}.catalog-dropdown b{font-size:13px;overflow-wrap:anywhere}.catalog-dropdown small{display:block;font-size:11px;color:var(--catalog-muted);white-space:normal;margin-top:3px}
@media(min-width:1024px) and (max-width:1250px){.public-navigation{gap:13px}.public-navigation>a,.catalog-menu summary{font-size:12px}}

/* ===== v12: admin-controlled hero heading ===== */
h1.hero-title,.mobile-hero h1.hero-title{font-size:var(--hero-size-m,44px);line-height:1.05}
@media(min-width:768px){h1.hero-title,.mobile-hero h1.hero-title{font-size:var(--hero-size,72px)}}
h1.hero-title .type-line{white-space:normal}
.hero-anim-type .type-line{white-space:nowrap}
.hero-anim-fade .type-line,.hero-anim-slide .type-line,.hero-anim-zoom .type-line,.hero-anim-bounce .type-line,.hero-anim-none .type-line{max-width:none!important;border-right:0!important;padding-right:0}
.hero-anim-fade .type-line{animation:hero-fade .9s ease both!important}
.hero-anim-slide .type-line{animation:hero-slide .8s cubic-bezier(.2,.8,.2,1) both!important}
.hero-anim-zoom .type-line{animation:hero-zoom .8s cubic-bezier(.2,.8,.2,1) both!important}
.hero-anim-bounce .type-line{animation:hero-bounce 1s cubic-bezier(.3,1.6,.5,1) both!important}
.hero-anim-none .type-line{animation:none!important}
.hero-title .type-line:nth-of-type(2){animation-delay:.35s!important}.hero-title .type-line:nth-of-type(3){animation-delay:.7s!important}
.hero-anim-type .type-line:nth-of-type(2){animation-delay:1s,0s!important}.hero-anim-type .type-line:nth-of-type(3){animation-delay:2s,0s!important}
@keyframes hero-fade{from{opacity:0}to{opacity:1}}
@keyframes hero-slide{from{opacity:0;transform:translateX(-60px)}to{opacity:1;transform:none}}
@keyframes hero-zoom{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}
@keyframes hero-bounce{0%{opacity:0;transform:translateY(-50px)}100%{opacity:1;transform:none}}

/* ===== v12: bigger header logo on laptop / PC ===== */
@media(min-width:1024px){
  header .mobile-header-row{gap:18px}
  header .mobile-header-row>div:first-child img.logo-float{height:68px!important;width:auto;max-width:240px;object-fit:contain}
  header .public-navigation{gap:18px}
}
@media(min-width:1280px){header .mobile-header-row>div:first-child img.logo-float{height:76px!important;max-width:260px}}
.header-account-actions .desktop-login-label{white-space:nowrap}

/* ===== v12: mobile menu Login / Register buttons ===== */
#mobile-menu .mobile-account-actions .header-account-actions{display:grid!important;grid-template-columns:1fr 1fr;gap:10px}
#mobile-menu .mobile-account-actions .header-account-actions a{margin:0!important;display:flex;align-items:center;justify-content:center;gap:8px;height:48px;padding:0 12px;border-radius:12px;font-size:15px;font-weight:700;text-align:center;white-space:nowrap;box-shadow:0 8px 18px -10px rgba(11,61,145,.6)}
#mobile-menu .mobile-account-actions .header-account-actions a:last-child{box-shadow:0 8px 18px -10px rgba(236,72,153,.7)}
#mobile-menu .mobile-account-actions .header-account-actions a svg{width:18px;height:18px}
@media(max-width:340px){#mobile-menu .mobile-account-actions .header-account-actions{grid-template-columns:1fr}}

/* ===== v12: footer ===== */
.footer-h{font-weight:700;font-size:15px;margin-bottom:12px;position:relative;padding-bottom:8px}
.footer-h::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;border-radius:3px;background:linear-gradient(90deg,#ec4899,#8b5cf6)}
.footer-links{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
.footer-links a,.footer-contact-list a{color:inherit;opacity:.82;text-decoration:none;transition:opacity .2s,transform .2s;display:inline-block}
.footer-links a:hover,.footer-contact-list a:hover{opacity:1;transform:translateX(3px)}
.footer-contact-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:14px}
.footer-contact-list li{display:flex;align-items:center;gap:10px;min-width:0}
.footer-contact-list li>a,.footer-contact-list li>span:last-child{min-width:0;overflow-wrap:anywhere;opacity:.85}
.fc-ic{width:32px;height:32px;flex:0 0 32px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.12)}
.fc-ic svg{width:16px;height:16px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);text-align:center;font-size:12px;opacity:.75;padding:14px 16px}
@media(max-width:767px){
  .site-footer-grid{grid-template-columns:1fr 1fr!important;gap:26px 18px!important;padding-top:28px!important}
  .site-footer-grid .footer-brand{grid-column:1/-1;text-align:center}
  .site-footer-grid .footer-brand>div:first-child{margin:0 auto}
  .site-footer-grid .footer-brand .flex{justify-content:center}
  .site-footer-grid .footer-contact{grid-column:1/-1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:16px}
  .footer-links{gap:9px;font-size:13.5px}
}
/* ===== v17: logo full visible, never squeezed by menu ===== */
@media(min-width:1024px){header .mobile-header-row>div:first-child{flex-shrink:0!important;overflow:visible!important;min-width:max-content}header .mobile-header-row>div:first-child img.logo-float{max-width:none!important;width:auto!important;object-fit:contain}}
@media(min-width:1024px){header .mobile-header-row{gap:16px}header .public-navigation{gap:14px!important;min-width:0;flex-wrap:nowrap}header .public-navigation a,header .public-navigation button{white-space:nowrap}}
@media(min-width:1024px) and (max-width:1279px){header .mobile-header-row>div:first-child img.logo-float{height:56px!important}header .public-navigation{gap:10px!important;font-size:13px}}

/* ===== v18: clean typing animation ===== */
.hero-anim-type .type-line{display:inline-block;white-space:nowrap!important;overflow:hidden;vertical-align:bottom;max-width:0;padding-right:6px;border-right:4px solid transparent;animation:hero-type 1s steps(16,end) forwards,hero-caret .5s step-end 0s 2!important}
.hero-anim-type .type-line:nth-of-type(1){animation-delay:0s,0s!important}
.hero-anim-type .type-line:nth-of-type(2){animation-delay:1s,1s!important}
.hero-anim-type .type-line:nth-of-type(3){animation:hero-type 1s steps(16,end) 2s forwards,hero-caret .7s step-end 2s infinite!important}
@keyframes hero-type{from{max-width:0}to{max-width:100%}}
@keyframes hero-caret{0%,100%{border-right-color:var(--brand-yellow,#ffc400)}50%{border-right-color:transparent}}
@media(max-width:767px){.hero-anim-type.hero-title{font-size:min(var(--hero-size-m,44px),9.5vw)!important}}