.elementor-11936 .elementor-element.elementor-element-9785e26{padding:0px 0px 0px 0px;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS for html, class: .elementor-element-4f2916c */@charset "UTF-8";/* End custom CSS */
/* Start custom CSS for section, class: .elementor-element-9785e26 */*, *::before, *::after{ box-sizing:border-box; margin:0; padding:0 }

/* ============================================================
   DESIGN SYSTEM TOKENS
   ============================================================ */
:root{
  --teal:#01516A;
  --teal-light:#88B2D1;
  --teal-dark:#013A4D;
  --teal-bg:#f0f5f8;
  --accent:#F9A41E;
  --ink:#0D1B22;
  --ink-soft:#5a6c75;
  --ink-mute:#8FA5AE;
  --line:#e8eaec;
  --line-soft:#EFF2F4;

  --cb-font-primary:'Noto Serif JP','Hiragino Mincho ProN',serif;
  --cb-font-secondary:'Inter','Noto Sans JP',sans-serif;
  --cb-font-text:'Noto Sans JP','Hiragino Kaku Gothic ProN',sans-serif;
  --cb-font-accent:'Inter','Noto Sans JP',sans-serif;
  --cb-font-mono:'JetBrains Mono',monospace;
}

body{
  margin:0;
  font-family:var(--cb-font-text);
  background:#fff;
  color:var(--ink);
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
a{ color:inherit; text-decoration:none }

/* ============================================================
   HEADER ROOT z-index guarantees
   Ensures header + mega menus stay above all page content
   (works both standalone and inside Elementor wrappers)
   ============================================================ */
/* Header must sit above hero AND allow mega menu to overflow out */
.elementor-location-header,
.elementor-location-header > *,
.elementor-location-header .elementor-section,
.elementor-location-header .elementor-container,
.elementor-location-header .elementor-column,
.elementor-location-header .elementor-column-wrap,
.elementor-location-header .elementor-widget-wrap,
.elementor-location-header .elementor-widget,
.elementor-location-header .elementor-widget-html,
.elementor-location-header .elementor-widget-container,
.cubn-topbar,
.cubn-header{
  overflow:visible !important;
  z-index:9999;
  /* Kill any spacing Elementor/theme injects into the header stack */
  padding-top:0 !important;
  padding-bottom:0 !important;
  margin-top:0 !important;
  margin-bottom:0 !important;
}
/* Except for the actual header + topbar which have their own padding */
.cubn-topbar{padding:8px clamp(20px,3vw,40px) !important}
.cubn-header{padding:16px clamp(20px,3vw,40px) !important}

/* Sticky auto-hide behavior — controlled by .cubn-hidden class from JS */
.elementor-location-header{
  position:sticky !important;
  top:0 !important;
  isolation:isolate;
  transition:transform .35s cubic-bezier(.4,0,.2,1) !important;
  will-change:transform;
}
.elementor-location-header.cubn-hidden{
  transform:translateY(-100%) !important;
}
/* Force topbar visibility (theme may hide it) */
@media (min-width:981px){
  .cubn-topbar{display:flex !important}
}

/* Kill spacing between header and next section — hero should touch header */
.elementor-location-header + .elementor-location-single,
.elementor-location-header + section,
.elementor-location-header + main,
.elementor-location-header + div,
.elementor-location-header ~ .elementor-location-single,
.elementor-location-header ~ [data-elementor-type="wp-page"]{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* Standalone fallback (when header rendered outside Elementor) */
body:not(.elementor-page) .cubn-topbar,
body:not(.elementor-page) .cubn-header{position:sticky;top:0}
/* Mega menus need to sit above everything including hero */
.cubn-mega{z-index:999999 !important}
.cubn-nav-item{position:relative;z-index:9999}
.cubn-nav-item:hover{z-index:999999}

/* ============================================================
   TOPBAR
   ============================================================ */
.cubn-topbar{
  background:var(--teal-dark);
  color:#fff;
  padding:8px clamp(20px,3vw,40px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:12px;
  letter-spacing:.02em;
  font-family:var(--cb-font-text);
}
.cubn-topbar a{
  color:rgba(255,255,255,.85);
  display:inline-flex; align-items:center; gap:8px;
  transition:color .2s;
}
.cubn-topbar a:hover{ color:var(--accent) }
.cubn-topbar-left{ display:flex; gap:28px }
.cubn-topbar-right{
  color:rgba(255,255,255,.6);
  font-size:11px;
  font-family:var(--cb-font-mono);
  letter-spacing:.08em;
}

/* ============================================================
   HEADER main
   ============================================================ */
.cubn-header{
  z-index:9998;
  background:#fff;
  border-bottom:1px solid var(--line);
  padding:16px clamp(20px,3vw,40px);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
}
.cubn-logo{ display:inline-flex; align-items:center; flex-shrink:0 }
.cubn-logo img{ height:26px; width:auto; display:block }

/* ============================================================
   NAV CAPSULE
   ============================================================ */
.cubn-nav{
  display:flex; align-items:center;
  background:var(--teal-bg);
  border-radius:99px;
  padding:5px;
  gap:2px;
}
.cubn-nav-item{
  position:relative;
  padding:9px 18px;
  border-radius:99px;
  font-family:var(--cb-font-text);
  font-size:14px;
  font-weight:500;
  color:var(--ink);
  cursor:pointer;
  display:flex; align-items:center; gap:6px;
  transition:all .2s;
  white-space:nowrap;
}
.cubn-nav-item:hover{
  background:#fff; color:var(--teal-dark);
  box-shadow:0 2px 6px rgba(1,58,77,.06);
}
.cubn-nav-item > a{ display:flex; align-items:center; gap:6px; color:inherit }
.cubn-nav-item .plus{
  display:inline-block;
  transition:transform .3s, color .3s;
  font-weight:400;
  color:var(--ink-mute);
  font-size:13px;
}
.cubn-nav-item:hover .plus{ transform:rotate(45deg); color:var(--accent) }

/* ============================================================
   MEGA MENU
   ============================================================ */
.cubn-mega{
  position:absolute;
  top:calc(100% + 16px);
  left:50%;
  transform:translateX(-50%) translateY(-10px);
  width:920px;
  background:#fff;
  border-radius:12px;
  box-shadow:0 20px 60px -10px rgba(1,58,77,.18);
  border:1px solid var(--line);
  opacity:0; visibility:hidden;
  transition:all .3s cubic-bezier(.2,.7,.2,1);
  z-index:99999;
  overflow:hidden;
}
.cubn-nav-item:hover .cubn-mega{
  opacity:1; visibility:visible;
  transform:translateX(-50%) translateY(0);
}
.cubn-nav-item:nth-child(1) .cubn-mega,
.cubn-nav-item:nth-child(2) .cubn-mega{
  left:0; transform:translateX(0) translateY(-10px);
}
.cubn-nav-item:nth-child(1):hover .cubn-mega,
.cubn-nav-item:nth-child(2):hover .cubn-mega{
  transform:translateX(0) translateY(0);
}
.cubn-nav-item:nth-last-child(1) .cubn-mega{
  left:auto; right:0; transform:translateX(0) translateY(-10px);
}
.cubn-nav-item:nth-last-child(1):hover .cubn-mega{
  transform:translateX(0) translateY(0);
}
.cubn-nav-item::after{
  content:''; position:absolute;
  top:100%; left:0; right:0; height:24px;
}
.cubn-mega-grid{
  display:grid !important;
  grid-template-columns:320px minmax(0, 1fr) !important;
  min-height:320px !important;
  background:#fff !important;
  color:var(--ink) !important;
}
.cubn-mega-grid *{color:inherit}
/* Ensure mega content isn't invisible from theme rules */
.cubn-mega .cubn-featured-title,
.cubn-mega .cubn-featured-eyebrow,
.cubn-mega .cubn-featured-text,
.cubn-mega .cubn-featured-cta,
.cubn-mega .cubn-mega-item,
.cubn-mega a{color:var(--ink) !important}
.cubn-mega .cubn-featured-eyebrow{color:var(--accent) !important}
.cubn-mega .cubn-featured-title{color:var(--teal-dark) !important}
.cubn-mega .cubn-featured-text{color:var(--ink-soft) !important}

/* FEATURED (left panel) */
.cubn-featured{
  padding:36px 32px;
  background:linear-gradient(180deg, #fff 0%, var(--teal-bg) 100%);
  border-right:1px solid var(--line);
  display:flex; flex-direction:column;
  justify-content:space-between;
  text-decoration:none;
  transition:background .3s;
  min-width:0;
  overflow:hidden;
}
.cubn-featured > *{ min-width:0; max-width:100% }
.cubn-featured *{ min-width:0 }
.cubn-featured > div{ width:100%; max-width:100%; overflow:hidden }
.cubn-featured:hover{ background:linear-gradient(180deg, var(--teal-bg) 0%, #e8eff3 100%) }
.cubn-featured-eyebrow{
  display:inline-flex; align-items:center; gap:12px;
  font-family:var(--cb-font-accent);
  font-size:11px; font-weight:700;
  letter-spacing:.25em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:16px;
}
.cubn-featured-eyebrow::before{
  content:""; width:24px; height:1px; background:var(--accent);
}
.cubn-featured-title{
  font-family:var(--cb-font-primary);
  font-size:22px;
  font-weight:700;
  line-height:1.4;
  letter-spacing:.02em;
  color:var(--teal-dark);
  margin-bottom:16px;
  display:block;
  word-break:keep-all;
  overflow-wrap:break-word;
  max-width:100%;
}
.cubn-featured-title::after{
  content:"";
  display:inline-block;
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  margin-left:6px;
  transform:translateY(-2px);
  vertical-align:middle;
}
.cubn-featured-text{
  font-family:var(--cb-font-text);
  font-size:13.5px;
  line-height:1.85;
  color:var(--ink-soft);
  margin-bottom:auto;
  word-break:break-all;
  overflow-wrap:anywhere;
  white-space:normal;
  min-width:0;
  max-width:100%;
  width:100%;
  display:block;
}
.cubn-featured-cta{
  display:inline-flex; align-items:center; gap:10px;
  margin-top:24px;
  padding:12px 22px;
  background:linear-gradient(180deg, var(--teal) 0%, var(--teal-dark) 100%);
  color:#fff;
  border-radius:99px;
  font-family:var(--cb-font-secondary);
  font-size:13px;
  font-weight:700;
  letter-spacing:.02em;
  width:fit-content;
  transition:all .3s cubic-bezier(.2,.7,.2,1);
  box-shadow:0 6px 16px -6px rgba(1,58,77,.35);
}
.cubn-featured:hover .cubn-featured-cta{
  transform:translateY(-2px);
  box-shadow:0 12px 24px -8px rgba(1,58,77,.45);
}
.cubn-featured-cta-arrow{ display:inline-flex; align-items:center; transition:transform .3s }
.cubn-featured:hover .cubn-featured-cta-arrow{ transform:translateX(3px) }
.cubn-featured-cta-arrow svg{ width:14px; height:14px }

/* LIST (right panel) */
.cubn-list{
  padding:32px 32px 24px;
  display:flex; flex-direction:column;
}
.cubn-list-eyebrow{
  font-family:var(--cb-font-accent);
  font-size:10px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:16px;
  padding-bottom:14px;
  border-bottom:1px solid var(--line);
}
.cubn-list-items{ display:flex; flex-direction:column; gap:2px; flex:1 }
.cubn-item{
  display:block;
  padding:12px 16px;
  border-radius:8px;
  transition:all .2s;
  margin:0 -16px;
}
.cubn-item:hover{ background:var(--teal-bg); transform:translateX(4px) }
.cubn-item-title{
  font-family:var(--cb-font-secondary);
  font-size:14px;
  font-weight:700;
  color:var(--teal-dark);
  margin-bottom:4px;
  display:flex; align-items:center; gap:8px;
  letter-spacing:-.005em;
}
.cubn-item-title::after{
  content:'\2192';
  color:var(--accent);
  opacity:0;
  transform:translateX(-4px);
  transition:all .25s;
  margin-left:auto;
  font-family:var(--cb-font-secondary);
  font-weight:700;
}
.cubn-item:hover .cubn-item-title::after{ opacity:1; transform:translateX(0) }
.cubn-item-desc{
  font-family:var(--cb-font-text);
  font-size:12px; color:var(--ink-soft); line-height:1.55;
}

.cubn-see-all{
  margin-top:auto;
  padding-top:18px;
  border-top:1px solid var(--line);
  display:flex; justify-content:space-between; align-items:center;
}
.cubn-see-all a{
  display:inline-flex; align-items:center; gap:10px;
  color:var(--teal-dark);
  font-family:var(--cb-font-secondary);
  font-size:13px; font-weight:700;
  letter-spacing:.02em;
  transition:all .2s;
}
.cubn-see-all a:hover{ color:var(--accent); gap:14px }
.cubn-see-all-count{
  font-family:var(--cb-font-mono);
  font-size:11px; color:var(--ink-mute); font-weight:500;
  letter-spacing:.05em;
}

/* ============================================================
   HEADER RIGHT
   ============================================================ */
.cubn-right{ display:flex; align-items:center; gap:12px }
.cubn-lang{
  display:flex; align-items:center;
  background:var(--teal-bg);
  border-radius:99px;
  padding:3px;
  gap:2px;
  font-family:var(--cb-font-mono);
  font-size:11px;
  font-weight:700;
  letter-spacing:.08em;
}
.cubn-lang a{
  padding:6px 12px; border-radius:99px;
  color:var(--ink-mute); transition:all .2s;
}
.cubn-lang a.active{
  background:#fff; color:var(--teal-dark);
  box-shadow:0 2px 6px rgba(1,58,77,.08);
}
.cubn-cta{
  display:inline-flex !important; align-items:center !important; gap:10px !important;
  padding:10px 12px 10px 22px !important;
  background:linear-gradient(180deg, var(--teal) 0%, var(--teal-dark) 100%) !important;
  color:#fff !important;
  border-radius:99px !important;
  font-family:var(--cb-font-secondary) !important;
  font-size:14px !important;
  font-weight:700 !important;
  letter-spacing:.02em !important;
  text-decoration:none !important;
  transition:all .25s cubic-bezier(.2,.7,.2,1) !important;
  box-shadow:0 6px 16px -6px rgba(1,58,77,.35) !important;
}
.cubn-cta *{color:#fff !important}
.cubn-cta:hover,
.cubn-cta:focus,
.cubn-cta:active,
.cubn-cta:visited{
  color:#fff !important;
  background:linear-gradient(180deg, var(--teal) 0%, var(--teal-dark) 100%) !important;
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px -8px rgba(1,58,77,.5) !important;
  text-decoration:none !important;
}
.cubn-cta:hover *,
.cubn-cta:focus *,
.cubn-cta:active *{color:#fff !important}
.cubn-cta-icon{
  display:grid; place-items:center;
  width:26px; height:26px;
  background:rgba(255,255,255,.15);
  border-radius:50%;
  transition:all .25s;
}
.cubn-cta:hover .cubn-cta-icon{
  background:var(--accent);
  color:var(--teal-dark);
  transform:rotate(-45deg);
}
.cubn-cta-icon svg{ width:11px; height:11px }

/* ============================================================
   HAMBURGER — HM4 · MENU label + bars
   ============================================================ */
.cubn-hamburger{
  display:none;
  align-items:center;
  gap:10px;
  padding:10px 16px 10px 14px;
  background:transparent;
  border:1px solid var(--line);
  border-radius:99px;
  cursor:pointer;
  transition:all .2s;
  font-family:var(--cb-font-mono);
  font-size:10px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:var(--teal-dark);
}
.cubn-hamburger::before{ content:"MENU" }
.cubn-hamburger:hover{
  background:var(--teal-dark); color:#fff;
  border-color:var(--teal-dark);
}
.cubn-hamburger .bars{
  display:flex; flex-direction:column; gap:3px;
}
.cubn-hamburger .bars span{
  display:block;
  width:14px; height:1.5px;
  background:var(--teal-dark);
  border-radius:2px;
  transition:all .3s;
}
.cubn-hamburger:hover .bars span{ background:var(--accent) }
.cubn-hamburger.is-open::before{ content:"CLOSE"; color:var(--accent) }
.cubn-hamburger.is-open .bars span:nth-child(1){ transform:translateY(4.5px) rotate(45deg); background:var(--accent) }
.cubn-hamburger.is-open .bars span:nth-child(2){ opacity:0 }
.cubn-hamburger.is-open .bars span:nth-child(3){ transform:translateY(-4.5px) rotate(-45deg); background:var(--accent) }

/* ============================================================
   MOBILE MENU PANEL
   ============================================================ */
.cubn-mobile-backdrop{
  position:fixed !important; inset:0 !important;
  background:rgba(1,58,77,.55) !important;
  opacity:0; visibility:hidden;
  transition:all .3s;
  z-index:999998 !important;
  backdrop-filter:blur(3px);
}
.cubn-mobile-backdrop.is-open{ opacity:1; visibility:visible }

.cubn-mobile-menu{
  position:fixed !important;
  top:0 !important; right:0 !important; bottom:0 !important;
  width:min(400px, 92%);
  background:#fff !important;
  transform:translateX(100%);
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
  z-index:999999 !important;
  overflow:hidden;
  display:flex; flex-direction:column;
  box-shadow:-10px 0 40px rgba(1,58,77,.18);
}
.cubn-mobile-menu.is-open{ transform:translateX(0) }

/* Body scroll lock when menu open (works on iOS + desktop + Elementor) */
html.cubn-menu-open,
body.cubn-menu-open{
  overflow:hidden !important;
  touch-action:none !important;
  overscroll-behavior:none !important;
}
body.cubn-menu-open{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  width:100% !important;
}

/* Top bar of mobile menu — FORCE dark teal against theme white */
.cubn-mobile-top{
  display:flex !important; justify-content:space-between !important; align-items:center !important;
  padding:14px 16px !important;
  background:var(--teal-dark) !important;
  color:#fff !important;
  flex-shrink:0 !important;
  gap:10px !important;
}
.cubn-mobile-top *{color:#fff !important}
.cubn-mobile-top img{filter:brightness(0) invert(1) !important}
.cubn-mobile-top .brand{ display:inline-flex; align-items:center; flex-shrink:0 }
.cubn-mobile-top img{
  height:22px; width:auto;
  filter:brightness(0) invert(1);
}
.cubn-mobile-top .right-controls{
  display:inline-flex; align-items:center; gap:8px;
  flex-shrink:0;
}
/* JP/EN toggle inside top bar */
.cubn-mobile-top .lang-toggle{
  display:inline-flex; align-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.15);
  border-radius:99px;
  padding:2px;
  font-family:var(--cb-font-mono);
  font-size:10px; font-weight:700;
  letter-spacing:.08em;
}
.cubn-mobile-top .lang-toggle a{
  padding:5px 10px; border-radius:99px;
  color:rgba(255,255,255,.55);
  text-decoration:none;
  transition:all .2s;
}
.cubn-mobile-top .lang-toggle a.active{
  background:#fff;
  color:var(--teal-dark);
}
/* X4 · CLOSE with label + × icon — force overrides against theme button styles */
.cubn-mobile-close{
  display:inline-flex !important; align-items:center !important; gap:8px !important;
  padding:8px 14px 8px 16px !important;
  background:rgba(255,255,255,.12) !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-radius:99px !important;
  color:#fff !important;
  cursor:pointer !important;
  transition:all .2s !important;
  font-family:var(--cb-font-mono) !important;
  font-size:10px !important; font-weight:700 !important;
  letter-spacing:.15em !important;
  text-transform:uppercase !important;
  text-decoration:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
  line-height:1 !important;
}
.cubn-mobile-close *{color:#fff !important}
.cubn-mobile-close:hover,
.cubn-mobile-close:focus,
.cubn-mobile-close:active{
  background:var(--accent) !important;
  color:var(--teal-dark) !important;
  border-color:var(--accent) !important;
}
.cubn-mobile-close:hover *{color:var(--teal-dark) !important}
.cubn-mobile-close svg{
  width:11px !important; height:11px !important;
  stroke:currentColor !important; stroke-width:3 !important; fill:none !important;
  display:inline-block !important;
}

/* ============================================================
   MOBILE NAV — V2 tab-bar style with +/− indicators
   ============================================================ */
.cubn-mobile-nav{ flex:1; display:flex; flex-direction:column; min-height:0 }

/* Hide radios for CSS-only tab switching */
.cubn-mobile-nav input[type="radio"]{ position:absolute; opacity:0; pointer-events:none }

/* Sticky tab bar wrapper (for scroll fades) */
.cubn-mnav-tabs-wrap{
  position:sticky; top:0; z-index:10;
  background:#fff;
  border-bottom:1px solid var(--line);
  flex-shrink:0;
  overflow:hidden;
}
.cubn-mnav-tabs-wrap::before,
.cubn-mnav-tabs-wrap::after{
  content:""; position:absolute; top:0; bottom:1px;
  width:20px; z-index:2;
  pointer-events:none;
}
.cubn-mnav-tabs-wrap::before{
  left:0;
  background:linear-gradient(90deg, #fff 40%, rgba(255,255,255,0));
}
.cubn-mnav-tabs-wrap::after{
  right:0;
  background:linear-gradient(-90deg, #fff 40%, rgba(255,255,255,0));
}

/* Sticky tab bar */
.cubn-mnav-tabs{
  display:flex; overflow-x:auto; overflow-y:hidden;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  padding:8px 6px;
  gap:2px;
  scroll-snap-type:x proximity;
  scroll-padding:0 24px;
}
.cubn-mnav-tabs::-webkit-scrollbar{ display:none }

/* Tab · Pill background (A) + orange dot (B) style */
.cubn-mnav-tab{
  flex-shrink:0;
  padding:9px 16px;
  border-radius:99px;
  font-family:var(--cb-font-text);
  font-size:13px;
  font-weight:600;
  color:var(--ink-soft);
  cursor:pointer;
  display:inline-flex; align-items:center; gap:6px;
  transition:all .2s;
  white-space:nowrap;
  user-select:none;
  background:transparent;
  scroll-snap-align:center;
}
.cubn-mnav-tab:hover{ color:var(--teal-dark); background:rgba(1,81,106,.04) }
.cubn-mnav-tab .tind{
  display:none;
}

/* Active tab state — pill background + orange dot */
#mtab-1:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-1"],
#mtab-2:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-2"],
#mtab-3:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-3"],
#mtab-4:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-4"],
#mtab-5:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-5"]{
  background:var(--teal-bg);
  color:var(--teal-dark);
  font-weight:700;
}
#mtab-1:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-1"]::after,
#mtab-2:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-2"]::after,
#mtab-3:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-3"]::after,
#mtab-4:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-4"]::after,
#mtab-5:checked ~ .cubn-mnav-tabs-wrap label[for="mtab-5"]::after{
  content:"";
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  display:inline-block;
  margin-left:2px;
  flex-shrink:0;
}

/* Panels container */
.cubn-mnav-panels{ flex:1; overflow-y:auto; min-height:0 }
.cubn-mnav-panel{ display:none; padding:22px 20px 24px }

#mtab-1:checked ~ .cubn-mnav-panels .cubn-mnav-panel-1,
#mtab-2:checked ~ .cubn-mnav-panels .cubn-mnav-panel-2,
#mtab-3:checked ~ .cubn-mnav-panels .cubn-mnav-panel-3,
#mtab-4:checked ~ .cubn-mnav-panels .cubn-mnav-panel-4,
#mtab-5:checked ~ .cubn-mnav-panels .cubn-mnav-panel-5{
  display:block;
  animation:mnavFade .3s ease;
}
@keyframes mnavFade{
  from{ opacity:0; transform:translateY(6px) }
  to{ opacity:1; transform:translateY(0) }
}

/* Panel content */
.cubn-mnav-panel .eyebrow{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--cb-font-accent);
  font-size:10px; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
  color:var(--accent);
  margin-bottom:10px;
}
.cubn-mnav-panel .eyebrow::before{
  content:""; width:20px; height:1px; background:var(--accent);
}
.cubn-mnav-panel h3{
  font-family:var(--cb-font-primary);
  font-size:22px; font-weight:700;
  color:var(--teal-dark);
  line-height:1.4;
  margin:0 0 10px;
  word-break:break-all;
  overflow-wrap:anywhere;
}
.cubn-mnav-panel h3::after{
  content:""; display:inline-block;
  width:6px; height:6px; border-radius:50%;
  background:var(--accent);
  margin-left:6px;
  transform:translateY(-2px);
  vertical-align:middle;
}
.cubn-mnav-panel .desc{
  font-size:13px; color:var(--ink-soft);
  line-height:1.75;
  margin-bottom:18px;
  word-break:break-word;
  overflow-wrap:anywhere;
}
.cubn-mnav-panel .cta{
  display:inline-flex; align-items:center; gap:10px;
  padding:11px 22px;
  background:linear-gradient(180deg, var(--teal), var(--teal-dark));
  color:#fff;
  border-radius:99px;
  font-family:var(--cb-font-secondary);
  font-weight:700; font-size:12.5px;
  text-decoration:none;
  margin-bottom:22px;
  transition:transform .2s;
}
.cubn-mnav-panel .cta:hover{ transform:translateY(-1px) }
.cubn-mnav-panel .cta svg{ width:12px; height:12px; stroke:currentColor; stroke-width:2.5; fill:none }

.cubn-mnav-panel .lbl-sec{
  display:flex; justify-content:space-between; align-items:baseline;
  font-family:var(--cb-font-mono);
  font-size:9px; font-weight:700;
  letter-spacing:.15em; text-transform:uppercase;
  color:var(--ink-mute);
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid var(--line);
}
.cubn-mnav-panel .items{ display:flex; flex-direction:column; gap:0 }
.cubn-mnav-panel .items a{
  display:flex; align-items:center;
  padding:14px 0;
  font-family:var(--cb-font-text);
  font-size:13.5px; font-weight:600;
  color:var(--ink);
  border-bottom:1px solid var(--line-soft);
  text-decoration:none;
  transition:all .2s;
  gap:10px;
}
.cubn-mnav-panel .items a::after{
  content:"\2192 "; margin-left:auto;
  font-family:var(--cb-font-secondary);
  color:var(--teal-light); font-weight:700;
  transition:all .2s;
}
.cubn-mnav-panel .items a:hover,
.cubn-mnav-panel .items a:active{
  color:var(--teal-dark);
  padding-left:6px;
}
.cubn-mnav-panel .items a:hover::after,
.cubn-mnav-panel .items a:active::after{
  color:var(--accent); transform:translateX(3px);
}
.cubn-mnav-panel .items a:last-child{ border-bottom:0 }

/* Compact mobile bottom actions */
.cubn-mobile-actions{
  padding:12px 16px 14px;
  border-top:1px solid var(--line);
  display:flex; flex-direction:column;
  gap:10px;
  background:var(--teal-bg);
  flex-shrink:0;
}
/* Compact contact row: icons + hours in one line */
.cubn-mobile-contact-row{
  display:flex; align-items:center; gap:12px;
  padding-bottom:10px;
  border-bottom:1px solid rgba(1,58,77,.08);
}
.cubn-mobile-contact-row .ic-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px;
  border-radius:50%;
  background:#fff;
  color:var(--teal-dark);
  transition:all .2s;
  flex-shrink:0;
}
.cubn-mobile-contact-row .ic-link:hover{
  background:var(--accent); color:var(--teal-dark);
}
.cubn-mobile-contact-row .ic-link svg{ width:13px; height:13px }
.cubn-mobile-contact-row .hours{
  font-family:var(--cb-font-mono);
  font-size:9.5px;
  color:var(--ink-soft);
  font-weight:600;
  letter-spacing:.08em;
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
/* Bottom CTA — compact single row */
.cubn-mobile-actions .cubn-cta{
  justify-content:center;
  width:100%;
  padding:11px 16px 11px 22px;
  font-size:13.5px;
}
.cubn-mobile-actions .cubn-cta .cubn-cta-icon{
  width:24px; height:24px;
}

/* ============================================================
   DEMO
   ============================================================ */
.demo-spacer{
  padding:120px 32px; text-align:center;
  background:linear-gradient(180deg, #fff, var(--teal-bg));
  border-bottom:1px solid var(--line);
  min-height:60vh;
}
.demo-spacer h2{
  font-family:var(--cb-font-primary);
  font-size:28px; color:var(--teal-dark); margin-bottom:12px;
  display:inline-flex; align-items:baseline; gap:8px;
}
.demo-spacer h2::after{
  content:""; width:8px; height:8px; border-radius:50%;
  background:var(--accent); display:inline-block;
  transform:translateY(-4px);
}
.demo-spacer p{ color:var(--ink-soft); font-size:15px }

/* ============================================================
   RESPONSIVE — MOBILE + TABLET
   ============================================================ */
@media (max-width: 1180px){ .cubn-nav{ display:none } }

@media (max-width: 980px){
  .cubn-topbar{ display:none }
  .cubn-right{ display:none }
  .cubn-nav{ display:none }
  .cubn-hamburger{ display:inline-flex }
  .cubn-header{ padding:14px 20px }
}
@media (min-width: 981px){
  .cubn-hamburger,
  .cubn-mobile-menu,
  .cubn-mobile-backdrop{ display:none }
}

/* Tablet: wider mobile menu panel */
@media (min-width: 600px) and (max-width: 980px){
  .cubn-mobile-menu{ width:min(480px, 60%) }
  .cubn-mnav-panel{ padding:28px 28px 32px }
  .cubn-mnav-panel h3{ font-size:26px }
  .cubn-mnav-panel .desc{ font-size:14px }
  .cubn-mnav-tab{ padding:16px 16px; font-size:14px }
}

/* Small mobile phone: tighter spacing */
@media (max-width: 400px){
  .cubn-mobile-menu{ width:100% }
  .cubn-mobile-top{ padding:14px 16px }
  .cubn-mobile-top img{ height:20px }
  .cubn-mobile-close{ padding:6px 12px 6px 14px; font-size:9px }
  .cubn-mobile-close svg{ width:10px; height:10px }
  .cubn-mnav-tab{ padding:8px 14px; font-size:12.5px; gap:5px }
  .cubn-mnav-panel{ padding:18px 16px 22px }
  .cubn-mnav-panel h3{ font-size:19px }
  .cubn-mnav-panel .desc{ font-size:12.5px }
  .cubn-mnav-panel .cta{ padding:10px 18px; font-size:12px }
  .cubn-mnav-panel .items a{ padding:12px 0; font-size:13px }
  .cubn-mobile-actions{ padding:14px 16px }
  .cubn-mobile-contact a{ font-size:12.5px }
}

/* Extra small mobile (≤340px like iPhone SE 1st gen) */
@media (max-width: 340px){
  .cubn-mnav-tab{ padding:7px 12px; font-size:11.5px }
  .cubn-mnav-panel h3{ font-size:17px }
}/* End custom CSS */