/* CCS Mobile Optimizer v1.1.0
   Desktop intentionally untouched. */

/* v1.3.0 HARD SAFETY: injected mobile UI is invisible unless a phone/tablet media query explicitly enables it. */
.ccsmo-mg-mobilebar,.ccsmo-mg-panel,.ccsmo-mg-hero-media{display:none!important;}

@media (max-width: 900px) {
  html, body { max-width:100%; overflow-x:hidden; }
  img, video, iframe { max-width:100%; }
  button, input, textarea, select { font-size:16px; }


  /* Sticky mobile header: always keep navigation within thumb reach */
  .ccsv2-header,.ccs-header,.ws-header,.ccs-mm-header,.ccs-r-header,.mg-header {
    position:fixed!important; top:0!important; left:0!important; right:0!important; width:100%!important; z-index:9997!important;
    background:linear-gradient(180deg,rgba(5,8,11,.76),rgba(5,8,11,.32))!important;
    border-bottom:1px solid rgba(255,255,255,.07)!important;
    backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
    transition:background .22s ease, box-shadow .22s ease, border-color .22s ease;
  }
  body.ccsmo-scrolled .ccsv2-header,body.ccsmo-scrolled .ccs-header,body.ccsmo-scrolled .ws-header,body.ccsmo-scrolled .ccs-mm-header,body.ccsmo-scrolled .ccs-r-header,body.ccsmo-scrolled .mg-header {
    background:rgba(5,8,11,.96)!important;
    border-bottom-color:rgba(255,255,255,.12)!important;
    box-shadow:0 12px 34px rgba(0,0,0,.28)!important;
  }
  .ccsmo-menu { position:relative!important; }

  /* MEGASTAR: persistent direct escape back to the CCS umbrella site */
  .mg-header-inner .ccsmo-ccs-back {
    min-height:42px; padding:0 11px; display:inline-flex; align-items:center; justify-content:center;
    margin-left:auto; border:1px solid rgba(255,255,255,.13); background:rgba(255,255,255,.035);
    color:#d9dde0!important; text-decoration:none!important; font-size:9px!important; font-weight:800!important;
    letter-spacing:.8px!important; text-transform:uppercase; white-space:nowrap;
  }
  .mg-header-inner .ccsmo-ccs-back:hover,.mg-header-inner .ccsmo-ccs-back:focus { color:#fff!important; border-color:rgba(255,75,64,.55); }
  .mg-header-inner .ccsmo-menu { margin-left:8px!important; }
  .ccsmo-panel .ccsmo-panel-home { color:#ff4b40!important; font-weight:800!important; }

  /* Generic generated mobile navigation */
  .ccsmo-menu { display:block; position:relative; z-index:9998; margin-left:auto; }
  .ccsmo-toggle { width:46px; height:46px; padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid rgba(255,255,255,.16); border-radius:2px; background:rgba(6,10,13,.46); color:#fff; cursor:pointer; -webkit-tap-highlight-color:transparent; }
  .ccsmo-toggle span { width:18px; height:1.5px; display:block; background:#fff; transition:transform .2s, opacity .2s; }
  .ccsmo-menu.is-open .ccsmo-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  .ccsmo-menu.is-open .ccsmo-toggle span:nth-child(2){opacity:0}
  .ccsmo-menu.is-open .ccsmo-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
  .ccsmo-panel { display:none; position:absolute; right:0; top:54px; width:min(310px,calc(100vw - 28px)); padding:10px; border:1px solid rgba(255,255,255,.13); background:rgba(7,11,14,.985); box-shadow:0 24px 70px rgba(0,0,0,.55); backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
  .ccsmo-menu.is-open .ccsmo-panel { display:grid; }
  .ccsmo-panel a { min-height:46px; padding:0 13px; display:flex; align-items:center; border-bottom:1px solid rgba(255,255,255,.07); color:#f3f4f5!important; text-decoration:none; font-size:11px!important; font-weight:700!important; letter-spacing:.9px!important; text-transform:uppercase; }
  .ccsmo-panel a:last-child { border-bottom:0; }
  .ccsmo-panel a.active,.ccsmo-panel a.is-active,.ccsmo-panel .ccs-nav-mega,.ccsmo-panel .mg-nav-back { color:#f08a38!important; }

  /* Existing homepage / workshop mobile menus get the same touch-friendly treatment */
  .ccsv2-mobile-menu summary,.ws-mobile-menu summary { min-width:46px; min-height:46px; display:flex!important; align-items:center; justify-content:center; padding:0 11px; border:1px solid rgba(255,255,255,.16); background:rgba(6,10,13,.42); font-size:9px!important; }
  .ccsv2-mobile-menu[open] > div,.ws-mobile-menu[open] > div,.ws-mobile-menu div { top:52px!important; width:min(310px,calc(100vw - 28px))!important; padding:10px!important; border-color:rgba(255,255,255,.13)!important; background:rgba(7,11,14,.985)!important; box-shadow:0 24px 70px rgba(0,0,0,.55)!important; }
  .ccsv2-mobile-menu a,.ws-mobile-menu a { min-height:46px; display:flex; align-items:center; border-bottom:1px solid rgba(255,255,255,.07); padding:0 13px!important; font-size:10px!important; }

  /* Hide desktop navs wherever our generated menu is present */
  .ccs-header .ccs-nav,.ccs-mm-header nav,.ccs-r-header nav,.mg-header .mg-nav { display:none!important; }

  /* Universal mobile rhythm */
  .ccsv2-shell,.ccs-shell,.ws-shell,.ccs-mm-shell,.ccs-r-shell,.mg-shell { width:calc(100% - 32px)!important; max-width:none!important; }
  .ccsv2-btn,.ccs-button,.ws-btn,.ccs-mm-btn,.ccs-r-btn,.mg-btn { min-height:50px; }

  /* ===== CCS HOMEPAGE v2 ===== */
  .ccsv2-header-inner { min-height:76px!important; }
  .ccsv2-brand-mark { height:40px!important; }
  .ccsv2-hero { min-height:690px!important; height:100svh!important; max-height:860px!important; background-position:64% center!important; }
  .ccsv2-hero-inner { align-items:flex-end!important; padding-bottom:82px!important; }
  .ccsv2-hero-copy { width:100%!important; max-width:620px!important; }
  .ccsv2-hero h1 { font-size:clamp(46px,12.5vw,68px)!important; line-height:.93!important; letter-spacing:-3.5px!important; text-wrap:balance; }
  .ccsv2-hero-copy>p { max-width:540px; font-size:14px!important; line-height:1.65!important; }
  .ccsv2-actions { display:grid!important; grid-template-columns:1fr 1fr; gap:9px!important; width:100%; max-width:520px; }
  .ccsv2-actions .ccsv2-btn { width:100%; padding:0 12px!important; white-space:nowrap; }
  .ccsv2-scroll-cue { display:none!important; }
  .ccsv2-intro,.ccsv2-market,.ccsv2-contact { padding-top:72px!important; padding-bottom:76px!important; }
  .ccsv2-services { padding-bottom:76px!important; }
  .ccsv2-intro-grid,.ccsv2-market-grid,.ccsv2-mega-grid,.ccsv2-contact-grid { gap:30px!important; }
  .ccsv2-intro h2,.ccsv2-section-head h2,.ccsv2-market h2,.ccsv2-megastar h2,.ccsv2-contact h2 { font-size:clamp(37px,10.5vw,52px)!important; line-height:.98!important; letter-spacing:-2.2px!important; text-wrap:balance; }
  .ccsv2-service-grid { gap:12px!important; }
  .ccsv2-service-card { min-height:330px!important; }
  .ccsv2-card-copy { left:20px!important; right:20px!important; bottom:19px!important; }
  .ccsv2-card-copy strong { font-size:25px!important; line-height:1.02!important; }
  .ccsv2-card-copy em { font-size:11px!important; line-height:1.5!important; }
  .ccsv2-market-visual { min-height:355px!important; }
  .ccsv2-market-main { inset:0 0 42px 4%!important; }
  .ccsv2-market-small { height:145px!important; }
  .ccsv2-mega-copy { padding-top:62px!important; }
  .ccsv2-mega-logo { max-width:76%!important; }
  .ccsv2-mega-visual { height:285px!important; overflow:hidden; }
  .ccsv2-mega-visual img { width:118%!important; max-width:none!important; transform:translateX(6%)!important; }
  .ccsv2-contact-button { font-size:clamp(22px,7.5vw,34px)!important; line-height:1.2!important; overflow-wrap:anywhere; }

  /* ===== MANAGED CCS SUBPAGES ===== */
  .ccs-header-inner { min-height:78px!important; height:auto!important; }
  .ccs-subhero { min-height:560px!important; padding-top:125px!important; padding-bottom:70px!important; }
  .ccs-subhero-inner { padding-top:0!important; }
  .ccs-subhero h1 { font-size:clamp(43px,12vw,60px)!important; line-height:.95!important; letter-spacing:-2.8px!important; text-wrap:balance; }
  .ccs-subpage-grid,.ccs-feature-grid,.ccs-contact-grid { gap:28px!important; }

  /* ===== WERKSTATT ===== */
  .ws-header-inner { height:78px!important; }
  .ws-brand-mark { height:39px!important; }
  .ws-brand-copy strong { font-size:18px!important; }
  .ws-hero { min-height:720px!important; height:auto!important; max-height:none!important; background-position:66% center!important; }
  .ws-hero-inner { min-height:720px; align-items:flex-end!important; padding-top:120px!important; padding-bottom:132px!important; }
  .ws-hero-copy { width:100%!important; }
  .ws-back { margin-bottom:18px!important; }
  .ws-hero h1 { font-size:clamp(42px,11.8vw,56px)!important; line-height:.94!important; letter-spacing:-2.8px!important; text-wrap:balance; }
  .ws-hero-copy>p { font-size:14px!important; line-height:1.65!important; }
  .ws-actions { display:grid!important; grid-template-columns:1fr 1fr; width:100%; gap:9px!important; }
  .ws-actions .ws-btn { width:100%; padding:0 12px!important; }
  .ws-hero-capabilities { bottom:24px!important; grid-template-columns:repeat(4,1fr)!important; gap:0; }
  .ws-hero-capabilities span { display:block!important; padding:15px 4px 0!important; font-size:8px!important; letter-spacing:.7px!important; text-align:center; }
  .ws-proof,.ws-worlds,.ws-process,.ws-image-cta { padding:70px 0!important; }
  .ws-proof strong,.ws-section-head h2,.ws-process-copy h2,.ws-image-cta h2 { font-size:clamp(36px,10vw,50px)!important; line-height:.98!important; letter-spacing:-2.1px!important; }
  .ws-world-grid { grid-template-columns:1fr!important; gap:10px!important; }
  .ws-world-grid article { min-height:220px!important; padding:24px!important; }
  .ws-world-grid h3 { margin-top:44px!important; font-size:22px!important; }
  .ws-steps li { grid-template-columns:48px 1fr!important; gap:10px!important; }
  .ws-round-cta { width:145px!important; height:145px!important; justify-self:start; }
  .ws-contact-strip>div { word-break:break-word; }
  .ws-modal-dialog { border-radius:0; }
  .ws-field input,.ws-field textarea { font-size:16px!important; }

  /* ===== MASCHINENMARKT ===== */
  .ccs-mm-header-inner { height:78px!important; }
  .ccs-mm-brand i { height:39px!important; }
  .ccs-mm-brand strong { font-size:18px!important; }
  .ccs-mm-brand small { font-size:6px!important; letter-spacing:1.8px!important; }
  .ccs-mm-hero { padding:72px 0 68px!important; }
  .ccs-mm-hero h1 { font-size:clamp(43px,12vw,58px)!important; line-height:.94!important; letter-spacing:-2.8px!important; }
  .ccs-mm-hero p { font-size:14px!important; line-height:1.65!important; }
  .ccs-mm-catalog { padding:62px 0 78px!important; }
  .ccs-mm-toolbar { gap:18px!important; }
  .ccs-mm-filters { width:100%; overflow-x:auto; padding-bottom:4px; -webkit-overflow-scrolling:touch; }
  .ccs-mm-filters a { flex:0 0 auto; min-height:44px; display:flex; align-items:center; }
  .ccs-mm-card-image { height:230px!important; }
  .ccs-mm-card-body { padding:20px!important; }
  .ccs-product-top { padding:52px 0 65px!important; }
  .ccs-product-grid { gap:24px!important; }
  .ccs-product-main-image { height:min(78vw,390px)!important; }
  .ccs-buybox { padding:23px!important; }
  .ccs-buybox h1 { font-size:clamp(36px,10vw,50px)!important; letter-spacing:-2px!important; }
  .ccs-product-content,.ccs-inquiry { padding:68px 0!important; }
  .ccs-product-content-grid,.ccs-inquiry-grid { gap:32px!important; }
  .ccs-product-content h2,.ccs-inquiry h2 { font-size:clamp(36px,10vw,48px)!important; line-height:.98!important; letter-spacing:-2px!important; }
  .ccs-spec-table>div { grid-template-columns:.85fr 1.15fr!important; gap:14px!important; }
  .ccs-inquiry form { padding:22px!important; }
  .ccs-form-grid input,.ccs-form-grid textarea { font-size:16px!important; }

  /* ===== MIETPARK ===== */
  .ccs-r-header-inner { height:78px!important; }
  .ccs-r-brand i { height:39px!important; }
  .ccs-r-brand strong { font-size:18px!important; }
  .ccs-r-brand small { font-size:6px!important; letter-spacing:1.8px!important; }
  .ccs-r-hero { min-height:610px!important; padding:95px 0 42px!important; }
  .ccs-r-hero h1 { font-size:clamp(43px,12vw,58px)!important; line-height:.94!important; letter-spacing:-2.8px!important; }
  .ccs-r-hero p { font-size:14px!important; line-height:1.65!important; }
  .ccs-r-steps { margin-top:32px!important; grid-template-columns:1fr 1fr!important; gap:0 12px; }
  .ccs-r-steps div { min-height:52px; padding:14px 8px 0 0!important; }
  .ccs-r-catalog,.ccs-r-info,.ccs-r-availability { padding:68px 0 76px!important; }
  .ccs-r-catalog-head,.ccs-r-info-grid,.ccs-r-av-head,.ccs-r-booking-grid { gap:30px!important; }
  .ccs-r-catalog-head h2,.ccs-r-info h2,.ccs-r-av-head h2 { font-size:clamp(36px,10vw,48px)!important; line-height:.98!important; letter-spacing:-2px!important; }
  .ccs-r-card-img { height:230px!important; }
  .ccs-r-card-body { padding:20px!important; }
  .ccs-r-detail-top { padding:50px 0 64px!important; }
  .ccs-r-main-img { height:min(78vw,390px)!important; }
  .ccs-r-summary { padding:23px!important; }
  .ccs-r-summary h1 { font-size:clamp(36px,10vw,50px)!important; letter-spacing:-2px!important; }
  .ccs-r-prices { grid-template-columns:1fr 1fr!important; }
  .ccs-calendar-box { padding:12px!important; overflow:hidden; }
  .ccs-cal-nav strong { font-size:17px!important; }
  .ccs-calendar-week,.ccs-calendar { grid-template-columns:repeat(7,minmax(0,1fr))!important; gap:4px!important; }
  .ccs-calendar button { width:100%; min-width:0; min-height:38px; aspect-ratio:1; padding:0; font-size:10px!important; }
  .ccs-calendar button.available:after,.ccs-calendar button.pending:after,.ccs-calendar button.booked:after { bottom:4px!important; width:4px!important; height:4px!important; }
  .ccs-selection { padding:14px!important; }
  .ccs-r-form { padding:22px!important; }
  .ccs-r-form input,.ccs-r-form textarea,.ccs-r-form select { font-size:16px!important; }

  /* ===== MEGASTAR ===== */
  .mg-header-inner { height:78px!important; }
  .mg-brand img { width:178px!important; max-width:55vw!important; }
  .mg-hero { min-height:690px!important; height:100svh!important; max-height:850px!important; background-position:66% center!important; }
  .mg-hero-grid { align-items:flex-end!important; padding-top:100px!important; padding-bottom:82px!important; }
  .mg-hero-copy { width:100%; max-width:620px; }
  .mg-hero h1 { font-size:clamp(48px,13vw,66px)!important; line-height:.88!important; letter-spacing:-3.5px!important; }
  .mg-hero-copy p { margin-top:24px!important; font-size:14px!important; line-height:1.65!important; }
  .mg-actions { display:grid!important; grid-template-columns:1fr 1fr; gap:9px!important; width:100%; }
  .mg-actions .mg-btn { width:100%; padding:0 12px!important; }
  .mg-section { padding:72px 0!important; }
  .mg-section-head,.mg-fluid-preview-grid,.mg-product-hero-grid,.mg-product-details-grid,.mg-custom-fluid { gap:30px!important; }
  .mg-section-head h2,.mg-fluid-preview-grid h2,.mg-custom-fluid h2,.mg-product-details h2 { font-size:clamp(37px,10vw,50px)!important; line-height:.98!important; letter-spacing:-2px!important; }
  .mg-machine-card-visual { height:245px!important; }
  .mg-machine-card-copy { padding:22px!important; }
  .mg-machine-card h3 { font-size:26px!important; }
  .mg-private-label,.mg-custom-fluid { padding:26px!important; }
  .mg-private-label h3 { font-size:36px!important; }
  .mg-subhero { padding:126px 0 66px!important; }
  .mg-subhero h1,.mg-product-copy h1 { font-size:clamp(43px,11vw,58px)!important; line-height:.93!important; letter-spacing:-2.7px!important; }
  .mg-fluid-card { min-height:auto!important; padding:24px!important; }
  .mg-fluid-card h2 { margin:42px 0 12px!important; }
  .mg-product-hero { padding:125px 0 64px!important; }
  .mg-product-visual { min-height:320px!important; }
  .mg-product-machine { width:118%!important; padding:0!important; }
  .mg-product-model-badge { left:16px!important; right:16px!important; bottom:14px!important; }
  .mg-product-model-badge span { font-size:21px!important; }
  .mg-product-model-badge small { font-size:8px!important; }
  .mg-specs>div { gap:15px!important; }
  .mg-highlight-box { padding:26px!important; }
  .mg-contact-hero { min-height:auto!important; padding:120px 0 66px!important; }
  .mg-contact-hero-grid { gap:32px!important; }
  .mg-contact-copy h1 { font-size:clamp(43px,11vw,56px)!important; line-height:.94!important; letter-spacing:-2.7px!important; }
  .mg-contact-card { padding:25px!important; }
  .mg-field input,.mg-field textarea,.mg-field select { font-size:16px!important; }
}

@media (max-width: 560px) {
  .ccsv2-shell,.ccs-shell,.ws-shell,.ccs-mm-shell,.ccs-r-shell,.mg-shell { width:calc(100% - 24px)!important; }
  .ccsv2-actions,.ws-actions,.mg-actions { grid-template-columns:1fr!important; }
  .ccsv2-actions .ccsv2-btn,.ws-actions .ws-btn,.mg-actions .mg-btn { width:100%; }

  .ccsv2-hero { min-height:660px!important; }
  .ccsv2-hero-inner { padding-bottom:58px!important; }
  .ccsv2-hero h1 { font-size:clamp(43px,13vw,58px)!important; }
  .ccsv2-service-card { min-height:300px!important; }
  .ccsv2-market-visual { min-height:300px!important; }
  .ccsv2-mega-visual { height:245px!important; }

  .ws-hero { min-height:690px!important; }
  .ws-hero-inner { min-height:690px!important; padding-bottom:118px!important; }
  .ws-hero h1 { font-size:clamp(39px,11vw,49px)!important; }
  .ws-hero-capabilities { grid-template-columns:repeat(2,1fr)!important; }
  .ws-hero-capabilities span { min-height:33px; }

  .ccs-mm-hero h1,.ccs-r-hero h1 { font-size:clamp(39px,11vw,50px)!important; }
  .ccs-mm-card-bottom,.ccs-r-card-bottom { align-items:flex-start!important; flex-direction:column; }
  .ccs-mm-empty { padding:22px!important; }
  .ccs-mm-empty-visual { min-height:240px!important; }

  .ccs-r-prices { grid-template-columns:1fr!important; }
  .ccs-r-steps span { font-size:10px!important; }
  .ccs-calendar-week,.ccs-calendar { gap:3px!important; }
  .ccs-calendar button { min-height:36px; font-size:9px!important; }

  .mg-hero { min-height:660px!important; }
  .mg-hero-grid { padding-bottom:58px!important; }
  .mg-hero h1 { font-size:clamp(44px,12.5vw,58px)!important; }
  .mg-machine-card-visual { height:220px!important; }
  .mg-product-visual { min-height:280px!important; }
  .mg-product-machine { width:126%!important; }
  .mg-modal-dialog,.ws-modal-dialog { width:100%!important; }
}

@media (max-width: 390px) {
  .ccsv2-brand-copy small,.ws-brand-copy small,.ccs-mm-brand small,.ccs-r-brand small { display:none!important; }
  .ccsv2-brand-copy strong,.ws-brand-copy strong,.ccs-mm-brand strong,.ccs-r-brand strong { font-size:17px!important; }
  .ccsv2-brand-mark,.ws-brand-mark,.ccs-mm-brand i,.ccs-r-brand i { height:34px!important; }
  .mg-brand img { width:154px!important; }
  .mg-header-inner .ccsmo-ccs-back { padding:0 8px; font-size:8px!important; letter-spacing:.55px!important; }
  .ccsmo-toggle,.ccsv2-mobile-menu summary,.ws-mobile-menu summary { width:43px; min-width:43px; height:43px; min-height:43px; }
  .ccsv2-hero h1,.ws-hero h1,.ccs-mm-hero h1,.ccs-r-hero h1,.mg-hero h1 { overflow-wrap:normal; word-break:normal; hyphens:none; }
  .ccs-calendar-box { padding:9px!important; }
  .ccs-calendar-week span { font-size:8px!important; }
  .ccs-calendar button { min-height:34px; }
}

/* =========================================================
   v1.3.0 — MEGASTAR SAFE MOBILE ONLY
   Desktop gets ZERO visual changes. The dedicated mobile UI
   is revealed only below 900px and the hero image keeps its
   natural aspect ratio via object-fit:cover.
   ========================================================= */
@media (max-width: 900px) {
  /* Kill the original desktop MEGASTAR header only on small screens. */
  .mg-header { display:none!important; }

  .ccsmo-mg-mobilebar {
    display:flex!important;
    position:fixed!important; top:0; left:0; right:0; z-index:100000;
    height:70px; padding:0 12px;
    align-items:center; justify-content:space-between; gap:8px;
    background:rgba(3,3,4,.96);
    border-bottom:1px solid rgba(255,255,255,.10);
    backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px);
    box-shadow:0 8px 24px rgba(0,0,0,.24);
  }
  body.admin-bar .ccsmo-mg-mobilebar { top:46px; }
  .ccsmo-mg-brand { min-width:0; display:flex; align-items:center; text-decoration:none; }
  .ccsmo-mg-brand img { display:block; width:132px; max-width:38vw; height:auto; }
  .ccsmo-mg-actions { margin-left:auto; display:flex; align-items:center; gap:7px; }
  .ccsmo-mg-back {
    height:40px; padding:0 10px; display:inline-flex; align-items:center; justify-content:center;
    border:1px solid rgba(255,59,48,.46); background:rgba(255,59,48,.07);
    color:#fff!important; text-decoration:none!important; white-space:nowrap;
    font-size:8px!important; font-weight:800!important; letter-spacing:.8px!important; text-transform:uppercase;
  }
  .ccsmo-mg-toggle {
    width:40px; height:40px; padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
    border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.035); cursor:pointer;
  }
  .ccsmo-mg-toggle span { width:17px; height:1.5px; display:block; background:#fff; transition:.2s ease; }
  body.ccsmo-mg-menu-open .ccsmo-mg-toggle span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
  body.ccsmo-mg-menu-open .ccsmo-mg-toggle span:nth-child(2){opacity:0}
  body.ccsmo-mg-menu-open .ccsmo-mg-toggle span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}

  .ccsmo-mg-panel {
    position:fixed!important; z-index:99999; top:70px; left:0; right:0;
    padding:8px 14px 14px; background:rgba(4,4,5,.995);
    border-bottom:1px solid rgba(255,255,255,.12); box-shadow:0 24px 55px rgba(0,0,0,.48);
  }
  body.admin-bar .ccsmo-mg-panel { top:116px; }
  body.ccsmo-mg-menu-open .ccsmo-mg-panel { display:grid!important; }
  .ccsmo-mg-panel a {
    min-height:48px; display:flex; align-items:center; padding:0 3px;
    border-bottom:1px solid rgba(255,255,255,.075); color:#f2f3f4!important;
    text-decoration:none!important; font-size:10px!important; font-weight:700!important; letter-spacing:.9px!important; text-transform:uppercase;
  }
  .ccsmo-mg-panel a:last-child{border-bottom:0}
  .ccsmo-mg-panel .ccsmo-mg-home{color:#ff4b40!important;font-weight:850!important}

  /* MEGASTAR landing: image and copy are deliberately separated on phones.
     Nothing is stretched. The image is cropped proportionally if needed. */
  .mg-hero {
    min-height:0!important; height:auto!important; max-height:none!important;
    padding-top:70px!important; background:#050506!important; overflow:hidden!important;
  }
  body.admin-bar .mg-hero { padding-top:116px!important; }
  .mg-hero-fade { display:none!important; }
  .ccsmo-mg-hero-media {
    display:block!important; position:relative; width:100%; height:330px; overflow:hidden; background:#050506;
  }
  .ccsmo-mg-hero-media img {
    display:block; width:100%; height:100%; max-width:none!important;
    object-fit:cover; object-position:72% center;
  }
  .ccsmo-mg-hero-media::after {
    content:""; position:absolute; inset:0; pointer-events:none;
    background:linear-gradient(180deg,rgba(5,5,6,.02) 55%,rgba(5,5,6,.86) 100%);
  }
  .mg-hero-grid {
    position:relative!important; z-index:3; width:calc(100% - 32px)!important; min-height:0!important; height:auto!important;
    display:block!important; padding:30px 0 52px!important; margin:0 auto!important;
  }
  .mg-hero-copy { width:100%!important; max-width:none!important; }
  .mg-kicker { font-size:8px!important; line-height:1.45!important; letter-spacing:1.8px!important; }
  .mg-hero h1 {
    margin:16px 0 0!important; max-width:100%!important;
    font-size:clamp(39px,11.4vw,47px)!important; line-height:.88!important; letter-spacing:-2.6px!important;
    white-space:normal!important; overflow:visible!important; word-break:normal!important;
  }
  .mg-hero-copy p {
    margin:22px 0 0!important; max-width:100%!important;
    color:#b8bdc2!important; font-size:14px!important; line-height:1.62!important;
  }
  .mg-actions { margin-top:25px!important; display:grid!important; grid-template-columns:1fr!important; gap:9px!important; }
  .mg-actions .mg-btn { width:100%!important; min-height:50px!important; padding:0 12px!important; }

  /* Other MEGASTAR pages simply move below the fixed mobile bar. */
  .mg-subhero,.mg-product-hero,.mg-contact-hero { padding-top:116px!important; }
  .mg-product-hero-grid { grid-template-columns:1fr!important; gap:30px!important; }
  .mg-product-visual { min-height:300px!important; }
  .mg-product-machine { width:100%!important; max-width:none!important; transform:none!important; }
}

@media (max-width: 390px) {
  .ccsmo-mg-brand img { width:122px; max-width:36vw; }
  .ccsmo-mg-back { padding:0 8px; font-size:7.5px!important; letter-spacing:.65px!important; }
  .ccsmo-mg-hero-media { height:300px; }
  .ccsmo-mg-hero-media img { object-position:74% center; }
  .mg-hero h1 { font-size:40px!important; letter-spacing:-2.4px!important; }
}

/* =========================================================
   v1.4.0 — MEGASTAR MOBILE TOP RETURN
   A clear but quiet return path to the CCS umbrella site.
   Mobile only; desktop remains untouched.
   ========================================================= */
@media (max-width: 900px) {
  .ccsmo-mg-mobilebar {
    padding-left:14px;
    padding-right:12px;
  }
  .ccsmo-mg-actions {
    gap:10px;
  }
  .ccsmo-mg-back {
    height:auto!important;
    min-height:40px;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    box-shadow:none!important;
    color:rgba(255,255,255,.68)!important;
    font-size:8px!important;
    font-weight:600!important;
    line-height:1.1!important;
    letter-spacing:.65px!important;
    text-transform:uppercase;
    white-space:nowrap;
    transition:color .2s ease, opacity .2s ease;
  }
  .ccsmo-mg-back:hover,
  .ccsmo-mg-back:focus {
    color:#fff!important;
    opacity:1;
  }
  .ccsmo-mg-back::before {
    content:"";
    width:18px;
    height:1px;
    margin-right:7px;
    display:inline-block;
    vertical-align:middle;
    background:#e42e25;
    box-shadow:-4px 0 0 rgba(228,46,37,.25);
  }
  .ccsmo-mg-toggle {
    flex:0 0 40px;
  }
}

@media (max-width: 390px) {
  .ccsmo-mg-brand img { width:118px!important; max-width:34vw!important; }
  .ccsmo-mg-actions { gap:8px; }
  .ccsmo-mg-back {
    font-size:7.2px!important;
    letter-spacing:.42px!important;
  }
  .ccsmo-mg-back::before {
    width:13px;
    margin-right:5px;
  }
}

/* =========================================================
   v1.5.0 — RELIABLE MEGASTAR MOBILE HEADER
   Uses the real MEGASTAR header as the single mobile header.
   No duplicate injected bar. Desktop remains untouched.
   ========================================================= */
@media (max-width: 900px) {
  .ccsmo-mg-mobilebar,
  .ccsmo-mg-panel { display:none!important; }

  .mg-header {
    display:block!important;
    position:fixed!important;
    top:0!important; left:0!important; right:0!important;
    z-index:100050!important;
    height:74px!important;
    background:rgba(3,3,4,.97)!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    box-shadow:0 8px 26px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  body.admin-bar .mg-header { top:46px!important; }
  .mg-header-inner {
    width:calc(100% - 24px)!important;
    max-width:none!important;
    height:74px!important;
    min-height:74px!important;
    margin:0 auto!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
  }
  .mg-brand {
    flex:0 1 auto!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
  }
  .mg-brand img {
    display:block!important;
    width:148px!important;
    max-width:42vw!important;
    height:auto!important;
  }
  .mg-brand small { display:none!important; }
  .mg-header .mg-nav { display:none!important; }

  .ccsmo-mg-directback {
    margin-left:auto!important;
    min-height:42px!important;
    padding:0 5px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    background:transparent!important;
    color:rgba(255,255,255,.76)!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    font-size:8.5px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:.7px!important;
    text-transform:uppercase!important;
  }
  .ccsmo-mg-directback::before {
    content:"";
    width:16px; height:1px;
    margin-right:6px;
    background:#e42e25;
    box-shadow:-4px 0 0 rgba(228,46,37,.25);
  }
  .ccsmo-mg-directback:hover,
  .ccsmo-mg-directback:focus { color:#fff!important; }

  .mg-header-inner > .ccsmo-menu {
    display:block!important;
    margin-left:2px!important;
    flex:0 0 auto!important;
  }
  .mg-header-inner > .ccsmo-menu .ccsmo-toggle {
    width:42px!important; height:42px!important;
    min-width:42px!important; min-height:42px!important;
  }
  .mg-header-inner > .ccsmo-menu .ccsmo-panel {
    display:none!important;
    position:fixed!important;
    top:74px!important; left:12px!important; right:12px!important;
    width:auto!important;
    max-width:none!important;
    z-index:100049!important;
  }
  body.admin-bar .mg-header-inner > .ccsmo-menu .ccsmo-panel { top:120px!important; }
  .mg-header-inner > .ccsmo-menu.is-open .ccsmo-panel { display:grid!important; }

  /* Keep all MEGASTAR content clear of the fixed header. */
  .mg-hero { padding-top:74px!important; }
  body.admin-bar .mg-hero { padding-top:120px!important; }
  .mg-subhero,.mg-product-hero,.mg-contact-hero { padding-top:120px!important; }
}

@media (max-width: 390px) {
  .mg-brand img { width:136px!important; max-width:40vw!important; }
  .ccsmo-mg-directback { font-size:8px!important; letter-spacing:.55px!important; padding:0 2px!important; }
}


/* =========================================================
   v1.6.0 — MEGASTAR MOBILE HEADER + HERO RESTORE
   One real header, two calm rows. Original cinematic hero is
   restored as background. Mobile only. Desktop is untouched.
   ========================================================= */
@media (max-width: 900px) {
  /* Never show the old injected mobile bar or duplicate back buttons. */
  .ccsmo-mg-mobilebar,
  .ccsmo-mg-panel,
  .ccsmo-mg-directback,
  .ccsmo-mg-hero-media { display:none!important; }

  /* Real MEGASTAR header: row 1 = logo + menu, row 2 = return to CCS. */
  .mg-header {
    display:block!important;
    position:fixed!important;
    top:0!important; left:0!important; right:0!important;
    z-index:100050!important;
    height:108px!important;
    background:rgba(3,3,4,.97)!important;
    border-bottom:1px solid rgba(255,255,255,.10)!important;
    box-shadow:0 8px 26px rgba(0,0,0,.28)!important;
    backdrop-filter:blur(16px)!important;
    -webkit-backdrop-filter:blur(16px)!important;
  }
  body.admin-bar .mg-header { top:46px!important; }

  .mg-header .mg-header-inner {
    width:calc(100% - 28px)!important;
    max-width:none!important;
    height:108px!important;
    min-height:108px!important;
    margin:0 auto!important;
    padding:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-rows:70px 38px!important;
    grid-template-areas:"brand menu" "back back"!important;
    align-items:center!important;
    column-gap:12px!important;
    row-gap:0!important;
  }

  .mg-header .mg-brand {
    grid-area:brand!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    margin:0!important;
  }
  .mg-header .mg-brand img {
    display:block!important;
    width:158px!important;
    max-width:56vw!important;
    height:auto!important;
  }
  .mg-header .mg-brand small { display:none!important; }
  .mg-header .mg-nav { display:none!important; }

  .mg-header .mg-mobile-ccs-back {
    grid-area:back!important;
    width:100%!important;
    min-height:38px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    border:0!important;
    border-top:1px solid rgba(255,255,255,.07)!important;
    background:transparent!important;
    color:rgba(255,255,255,.62)!important;
    text-decoration:none!important;
    text-transform:uppercase!important;
    font-size:8px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:1.25px!important;
    white-space:nowrap!important;
  }
  .mg-header .mg-mobile-ccs-back::before {
    content:""!important;
    width:18px!important;
    height:1px!important;
    margin-right:8px!important;
    display:block!important;
    background:#e42e25!important;
    box-shadow:-4px 0 0 rgba(228,46,37,.22)!important;
  }

  .mg-header-inner > .ccsmo-menu {
    grid-area:menu!important;
    display:block!important;
    position:relative!important;
    margin:0!important;
    justify-self:end!important;
    align-self:center!important;
  }
  .mg-header-inner > .ccsmo-menu .ccsmo-toggle {
    width:44px!important; height:44px!important;
    min-width:44px!important; min-height:44px!important;
    border-color:rgba(255,255,255,.18)!important;
    background:rgba(255,255,255,.025)!important;
  }
  .mg-header-inner > .ccsmo-menu .ccsmo-panel {
    display:none!important;
    position:fixed!important;
    top:108px!important; left:14px!important; right:14px!important;
    width:auto!important; max-width:none!important;
    z-index:100049!important;
    padding:8px 12px!important;
    background:rgba(4,4,5,.99)!important;
    border:1px solid rgba(255,255,255,.11)!important;
    box-shadow:0 24px 60px rgba(0,0,0,.55)!important;
  }
  body.admin-bar .mg-header-inner > .ccsmo-menu .ccsmo-panel { top:154px!important; }
  .mg-header-inner > .ccsmo-menu.is-open .ccsmo-panel { display:grid!important; }

  /* Restore the original MEGASTAR hero as a cinematic mobile background. */
  .mg-hero {
    min-height:760px!important;
    height:100svh!important;
    max-height:920px!important;
    padding-top:108px!important;
    overflow:hidden!important;
    background-color:#050506!important;
    background-image:
      linear-gradient(180deg,rgba(3,3,4,.10) 0%,rgba(3,3,4,.18) 34%,rgba(3,3,4,.72) 70%,#050506 100%),
      linear-gradient(90deg,rgba(3,3,4,.38) 0%,rgba(3,3,4,.14) 56%,rgba(3,3,4,.04) 100%),
      var(--mg-hero)!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
    background-position:72% center!important;
  }
  body.admin-bar .mg-hero { padding-top:154px!important; }
  .mg-hero-fade {
    display:block!important;
    position:absolute!important;
    inset:0!important;
    background:linear-gradient(to top,#050506 0%,rgba(5,5,6,.78) 20%,transparent 54%)!important;
    pointer-events:none!important;
  }
  .mg-hero-grid {
    position:relative!important;
    z-index:3!important;
    width:calc(100% - 32px)!important;
    min-height:calc(100svh - 108px)!important;
    height:auto!important;
    display:flex!important;
    align-items:flex-end!important;
    padding:0 0 46px!important;
    margin:0 auto!important;
  }
  .mg-hero-copy {
    width:100%!important;
    max-width:620px!important;
    padding:0!important;
  }
  .mg-kicker {
    font-size:8px!important;
    line-height:1.5!important;
    letter-spacing:1.85px!important;
  }
  .mg-hero h1 {
    margin:14px 0 0!important;
    max-width:100%!important;
    font-size:clamp(42px,12.3vw,54px)!important;
    line-height:.89!important;
    letter-spacing:-2.8px!important;
    white-space:normal!important;
    overflow:visible!important;
  }
  .mg-hero-copy p {
    margin:20px 0 0!important;
    max-width:95%!important;
    color:rgba(255,255,255,.78)!important;
    font-size:14px!important;
    line-height:1.62!important;
  }
  .mg-hero .mg-actions {
    margin-top:24px!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
  }
  .mg-hero .mg-actions .mg-btn {
    width:100%!important;
    min-height:52px!important;
    padding:0 14px!important;
  }

  /* All other MEGASTAR pages start below the same two-row fixed header. */
  .mg-subhero,
  .mg-product-hero,
  .mg-contact-hero { padding-top:150px!important; }
}

@media (max-width: 390px) {
  .mg-header .mg-brand img { width:146px!important; max-width:55vw!important; }
  .mg-hero { background-position:75% center!important; min-height:735px!important; }
  .mg-hero h1 { font-size:42px!important; letter-spacing:-2.4px!important; }
}