and generic
s, so the mobile sheet's four groups overlapped each other.
Everything inside the new chrome is taken out of float flow, once.
============================================================================ */
.hf-head, .hf-head *,
.hf-sheet, .hf-sheet *,
.hf-foot, .hf-foot *,
.hf-contact, .hf-contact *{
float:none !important;
}
.hf-sheet ul,
.hf-sheet h4,
.hf-sheet > .wrap > *{
width:auto !important;
clear:both;
}
.hf-sheet h4{ display:block; }
.hf-sheet ul{ display:block; margin-bottom:18px; }
/* the two sheet CTAs sat on top of each other on narrow screens */
.hf-sheet .hf-btn{ display:inline-flex; width:100%; }
.hf-sheet .hf-langs{ width:auto !important; }
.hf-sheet .hf-langs a{ width:auto !important; }
/* footer columns are grid items, never floats */
.hf-foot__grid > *{ width:auto !important; min-width:0; }
/* ============================================================================
30. INNER-PAGE TOP SPACE + LARGER, GRABBABLE GLOBE
The sub-hero still reserved 180px of padding above the breadcrumb — space
the old design needed for a background photo that is no longer shown.
============================================================================ */
body.lux-theme .sub-hero{
padding:calc(var(--hf-head-h) + 26px) 0 clamp(20px,2.6vw,34px) !important;
}
body.lux-theme .sub-hero .wrap{ gap:10px; }
body.lux-theme .breadcrumb{ margin-bottom:6px; }
/* the "IXP NETWORK" pill floated off on its own line at the right */
body.lux-theme .sub-hero .tx-pill{ align-self:flex-start; }
/* first content block after the sub-hero does not need another big gap */
body.lux-theme .sub-hero + .w100,
body.lux-theme .sub-hero + .page-gap{ padding-top:clamp(24px,3vw,44px); }
/* --- globe: larger, and it reads as something you can grab --- */
.hf-globe-wrap{ max-width:600px; max-height:600px; }
.hf-globe-wrap canvas{ cursor:grab; }
.hf-globe-wrap canvas:active{ cursor:grabbing; }
.hf-globe-grid{ grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
@media (max-width:900px){
.hf-globe-grid{ grid-template-columns:1fr; }
.hf-globe-wrap{ max-width:520px; }
}
/* breadcrumb: one compact row, not five stacked blocks */
body.lux-theme .breadcrumb{
display:flex; flex-wrap:wrap; align-items:center; gap:.55em;
min-height:0 !important; height:auto !important; line-height:1.4;
}
body.lux-theme .breadcrumb > *{
display:inline !important;
height:auto !important; min-height:0 !important;
margin:0 !important; padding:0 !important;
line-height:inherit;
}
body.lux-theme .breadcrumb i,
body.lux-theme .breadcrumb svg{ opacity:.5; }
/* the sub-hero title reserved room for artwork that is no longer rendered */
body.lux-theme .sub-hero-title{
padding:0 !important;
min-height:0 !important;
height:auto !important;
}
/* final trim: content starts just below the fixed bar */
body.lux-theme .sub-hero{ padding-top:calc(var(--hf-head-h) + 12px) !important; }
body.lux-theme .sub-hero .wrap{ gap:6px; }
/* ============================================================================
31. UNBREAKABLE STRINGS
Values like "7/24/365", "EVPN/MPLS" and "Ethernet • LR4" are single tokens
with no space to wrap at, so at display sizes they pushed out of their card.
============================================================================ */
body.lux-theme .maxtelekom :is(strong,b,small,span,td,dd,h3,h4){
overflow-wrap:anywhere;
min-width:0;
}
body.lux-theme .maxtelekom :is(.tx-stat-value,.topology-stat-box strong,.service-tech-card strong){
font-size:clamp(1.2rem,2.2vw,1.9rem) !important;
line-height:1.12;
letter-spacing:-.02em;
}
body.lux-theme .maxtelekom small{ font-size:.6875rem; line-height:1.5; }
/* the globe no longer paints a coloured ring around itself */
.hf-globe-wrap::after{ display:none !important; }