.c8srv-root, .c8srv-root * { box-sizing: border-box !important; }
.c8srv-root { overflow: visible !important; background: #FFFFFF !important; color: #080808 !important; font-family: 'DM Sans', sans-serif !important; line-height: 1.65 !important; position: relative !important; }
.c8srv-root .c8srv-wrap { padding: 5rem 3.5rem !important; max-width: 1440px !important; margin: 0 auto !important; position: relative !important; z-index: 2 !important; }
@media (max-width: 1100px) { .c8srv-root .c8srv-wrap { padding: 3rem 1.25rem 0px !important; margin-top: 50px !important; } }
.c8srv-root h1, .c8srv-root h2, .c8srv-root h3, .c8srv-root h4 { margin-top: 0 !important; margin-left: 0 !important; margin-right: 0 !important; line-height: 1.1 !important; }
.c8srv-root p { margin: 0 0 1rem 0 !important; }
.c8srv-root p:last-child { margin-bottom: 0 !important; }
.c8srv-root button { font-family: inherit !important; cursor: pointer !important; border: none !important; background: none !important; }
.c8srv-root a { text-decoration: none !important; }
.c8srv-root .c8srv-label { font-family: 'Space Mono', monospace !important; font-size: 10px !important; letter-spacing: .25em !important; text-transform: uppercase !important; color: #0047E1 !important; display: flex !important; align-items: center !important; gap: 10px !important; margin-bottom: 1.75rem !important; }
.c8srv-root .c8srv-label::before { content: '—' !important; color: #0047E1 !important; font-weight: 700 !important; }
.c8srv-root .c8srv-label.is-light { color: #7C93FF !important; }
.c8srv-root .c8srv-label.is-light::before { color: #7C93FF !important; }
.c8srv-root .c8srv-stroke-text { color: transparent !important; -webkit-text-stroke: 1.5px #080808 !important; }
.c8srv-root .c8-btn-primary,
.c8srv-root .c8srv-price-btn {
background: #0047E1 !important;
color: #FFFFFF !important;
font-family: 'Space Mono', monospace !important;
font-size: 0.82rem !important;
font-weight: 700 !important;
padding: 0.9rem 2.2rem !important;
border-radius: 4px !important;
border: 1px solid transparent !important;
position: relative !important;
overflow: hidden !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 0.5rem !important;
text-decoration: none !important;
text-transform: uppercase !important;
cursor: pointer !important;
transition: transform 0.3s ease, background 0.3s ease, color 0.3s ease !important;
}
.c8srv-root .c8-btn-primary.is-dark { background: #080808 !important; color: #FFFFFF !important; }
.c8srv-root .c8-btn-primary.is-light { background: #FFFFFF !important; color: #080808 !important; border: 1px solid rgba(8,8,8,0.14) !important; }
.c8srv-root .c8-btn-primary.is-dark:hover { background: #0047E1 !important; color: #FFFFFF !important; }
.c8srv-root .c8-btn-primary.is-light:hover { background: #F4F4F4 !important; color: #0047E1 !important; }
.c8srv-root .c8-btn-primary::before,
.c8srv-root .c8srv-price-btn::before {
content: '' !important;
position: absolute !important;
top: -50% !important; left: -100% !important;
width: 100% !important; height: 200% !important;
background: linear-gradient(115deg, transparent, rgba(255,255,255,0.4), rgba(61, 107, 255, 0.4), rgba(0, 194, 255, 0.4), transparent) !important;
transform: rotate(25deg) !important;
transition: left 0.75s ease !important;
pointer-events: none !important;
}
.c8srv-root .c8-btn-primary:hover::before,
.c8srv-root .c8srv-price-btn:hover::before { left: 150% !important; }
.c8srv-root .c8-btn-primary:hover,
.c8srv-root .c8srv-price-btn:hover { transform: translateY(-2px) !important; }
.c8srv-root .c8srv-hero-ctas {
display: flex !important;
flex-wrap: wrap !important;
gap: 1rem !important;
margin-top: 2rem !important;
margin-bottom: 1.5rem !important;
align-items: center !important;
}
.c8srv-root .c8srv-btn-ghost {
background: transparent !important;
color: #080808 !important;
font-family: 'Space Mono', monospace !important;
font-size: 11px !important;
letter-spacing: .08em !important;
text-transform: uppercase !important;
padding: 16px 28px !important;
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
border: 1px solid rgba(8,8,8,0.2) !important;
border-radius: 4px !important;
transition: border-color 0.2s ease, color 0.2s ease !important;
text-decoration: none !important;
}
.c8srv-root .c8srv-btn-ghost:hover {
border-color: #0047E1 !important;
color: #0047E1 !important;
}
.c8srv-root .c8srv-showcase-card,
.c8srv-root .c8srv-showcase-card-img,
.c8srv-root .c8srv-folder-card,
.c8srv-root .c8srv-folder-card-img,
.c8srv-root .c8srv-flank-card,
.c8srv-root .c8srv-price-box,
.c8srv-root .c8srv-estimator,
.c8srv-root .c8srv-est-result,
.c8srv-root .c8srv-badge,
.c8srv-root .c8srv-pill,
.c8srv-root .c8srv-est-choice {
border-radius: 4px !important;
}
.c8srv-root .c8srv-serif-text { font-family: 'Georgia', serif !important; font-style: italic !important; text-transform: none !important; font-weight: 400 !important; }
.c8srv-root .c8srv-gradient-text {
background: linear-gradient(135deg, #0047E1 0%, #00C6FF 100%) !important;
-webkit-background-clip: text !important;
-webkit-text-fill-color: transparent !important;
display: inline-block !important;
}
.c8srv-root .c8srv-tearline { display: flex !important; align-items: center !important; margin: 0 0 5rem 0 !important; position: relative !important; z-index: 2 !important; }
.c8srv-root .c8srv-tearline-dot { width: 9px !important; height: 9px !important; border-radius: 50% !important; background: #080808 !important; flex-shrink: 0 !important; }
.c8srv-root .c8srv-tearline-line { flex: 1 !important; border-top: 1px dashed rgba(8,8,8,0.28) !important; margin: 0 10px !important; }
.c8srv-root .c8srv-reveal { opacity: 0 !important; transform: translateY(24px) !important; transition: opacity 0.7s cubic-bezier(.16,.8,.24,1), transform 0.7s cubic-bezier(.16,.8,.24,1) !important; }
.c8srv-root .c8srv-reveal.is-visible { opacity: 1 !important; transform: translateY(0) !important; }
.c8srv-root .c8srv-reveal-d1 { transition-delay: 0.08s !important; }
.c8srv-root .c8srv-reveal-d2 { transition-delay: 0.16s !important; }
.c8srv-root .c8srv-reveal-d3 { transition-delay: 0.24s !important; }
@media (prefers-reduced-motion: reduce) { .c8srv-root .c8srv-reveal { opacity: 1 !important; transform: none !important; transition: none !important; } }
.c8srv-root .c8srv-explore { font-family: 'Space Mono', monospace !important; font-size: 11px !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: #0047E1 !important; display: inline-flex !important; align-items: center !important; gap: 6px !important; transition: gap 0.2s ease !important; }
.c8srv-root .c8srv-explore:hover { gap: 10px !important; }
.c8srv-root .c8srv-icon-sq { width: 40px !important; height: 40px !important; background: #0047E1 !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; }
.c8srv-root .c8srv-icon-sq svg { width: 20px !important; height: 20px !important; stroke: #FFFFFF !important; }
.c8srv-root .c8srv-hero { position: relative !important; z-index: 2 !important; padding-top: 2rem !important; }
.c8srv-root .c8srv-hero-atmos {
position: absolute !important; top: 0 !important; left: 0 !important; width: 100% !important; height: 420px !important;
z-index: 0 !important; pointer-events: none !important; overflow: hidden !important;
}
@media (max-width: 700px) { .c8srv-root .c8srv-hero-atmos { height: 300px !important; } }
.c8srv-root .c8srv-hero-atmos[data-c8srv-atmos] { pointer-events: auto !important; }
.c8srv-root .c8srv-atmos-svg { position: absolute !important; top: -10% !important; left: 0 !important; width: 100% !important; height: 130% !important; }
.c8srv-root .c8srv-atmos-blob { filter: blur(1px) !important; opacity: 0.4 !important; mix-blend-mode: normal !important; }
.c8srv-root .c8srv-atmos-glow {
position: absolute !important; top: 0 !important; left: 0 !important; width: 340px !important; height: 340px !important; border-radius: 50% !important;
background: radial-gradient(circle, rgba(0,71,225,0.4) 0%, rgba(0,71,225,0) 70%) !important;
transform: translate(-50%, -50%) !important; opacity: 0 !important; transition: opacity 0.4s ease !important; will-change: transform !important;
}
.c8srv-root .c8srv-hero-atmos.is-active .c8srv-atmos-glow { opacity: 1 !important; }
@media (prefers-reduced-motion: reduce) { .c8srv-root .c8srv-atmos-svg animate { display: none !important; } .c8srv-root .c8srv-atmos-glow { display: none !important; } }
.c8srv-root .c8srv-hero-content { position: relative !important; z-index: 2 !important; max-width: 760px !important; }
.c8srv-root .c8srv-headline { font-family: 'Michroma', sans-serif !important; font-size: clamp(1.8rem, 4vw, 2.5rem) !important; letter-spacing: 0.02em !important; line-height: 1.2 !important; font-weight: 700 !important; color: #080808 !important; text-transform: uppercase !important; margin-bottom: 1.5rem !important; }
.c8srv-root .c8srv-hero-intro { font-size: 15px !important; font-weight: 300 !important; color: #6B6B6B !important; max-width: 480px !important; margin-top: 1.5rem !important; line-height: 1.6 !important; font-family: 'DM Sans', sans-serif !important; }
.c8srv-root .c8srv-pill-row { display: flex !important; flex-wrap: wrap !important; gap: 0.6rem !important; margin-top: 2.25rem !important; }
.c8srv-root .c8srv-pill { border: 1px solid rgba(8,8,8,0.15) !important; background: #FFFFFF !important; padding: 8px 15px !important; font-size: 12px !important; font-weight: 500 !important; border-radius: 4px !important; font-family: 'Space Mono', monospace !important; letter-spacing: 0.05em !important; }
.c8srv-root .c8srv-section-title { font-family: 'Michroma', sans-serif !important; font-size: clamp(1.4rem, 2.5vw, 2.0rem) !important; font-weight: 700 !important; letter-spacing: 0.02em !important; color: #080808 !important; margin-bottom: 1.25rem !important; text-transform: uppercase !important; }
.c8srv-root .c8srv-lead { font-size: 17px !important; font-weight: 300 !important; color: #6B6B6B !important; max-width: 720px !important; margin-bottom: 0 !important; line-height: 1.6 !important; font-family: 'DM Sans', sans-serif !important; }
.c8srv-root .c8srv-showcase {
display: flex !important;
gap: 5rem !important;
align-items: flex-start !important;
position: relative !important;
padding: 4rem 0 !important;
margin-bottom: 0 !important;
}
@media (max-width: 1024px) {
.c8srv-root .c8srv-showcase {
flex-direction: column !important;
gap: 3rem !important;
}
}
.c8srv-root .c8srv-showcase-sticky-left {
position: sticky !important;
top: 100px !important;
width: 35% !important;
flex-shrink: 0 !important;
z-index: 10 !important;
}
@media (max-width: 1024px) {
.c8srv-root .c8srv-showcase-sticky-left {
position: relative !important;
top: 0 !important;
width: 100% !important;
}
}
.c8srv-root .c8srv-showcase-nav-list {
display: flex !important;
flex-direction: column !important;
gap: 0.75rem !important;
margin-top: 3rem !important;
}
@media (max-width: 1024px) {
.c8srv-root .c8srv-showcase-nav-list {
flex-direction: row !important;
flex-wrap: wrap !important;
gap: 0.5rem !important;
margin-top: 1.5rem !important;
}
}
.c8srv-root .c8srv-showcase-nav-item {
font-family: 'Space Mono', monospace !important;
font-size: 11px !important;
letter-spacing: .08em !important;
text-transform: uppercase !important;
padding: 12px 18px !important;
background: #FFFFFF !important;
border: 1px solid rgba(8,8,8,0.1) !important;
color: #6B6B6B !important;
text-align: left !important;
cursor: pointer !important;
transition: all 0.3s ease !important;
display: flex !important;
align-items: center !important;
gap: 12px !important;
}
.c8srv-root .c8srv-showcase-nav-item .c8srv-nav-num {
font-size: 9px !important;
opacity: 0.5 !important;
}
.c8srv-root .c8srv-showcase-nav-item.is-active {
background: #0047E1 !important;
color: #FAFAF7 !important;
border-color: #0047E1 !important;
padding-left: 24px !important;
}
@media (max-width: 1024px) {
.c8srv-root .c8srv-showcase-nav-item.is-active {
padding-left: 18px !important;
}
}
.c8srv-root .c8srv-showcase-scroll-right {
width: 65% !important;
display: flex !important;
flex-direction: column !important;
gap: 5rem !important;
position: relative !important;
}
@media (max-width: 1024px) {
.c8srv-root .c8srv-showcase-scroll-right {
width: 100% !important;
gap: 3rem !important;
}
}
.c8srv-root .c8srv-showcase-card {
border: 1px solid rgba(255,255,255,0.08) !important;
border-radius: 4px !important;
padding: 2.5rem !important;
display: grid !important;
grid-template-columns: 1.15fr 1fr !important;
gap: 2.5rem !important;
align-items: center !important;
box-shadow: 0 10px 40px rgba(8, 8, 8, 0.015) !important;
position: sticky !important;
z-index: 2 !important;
transition: transform 0.4s ease, opacity 0.4s ease !important;
}
.c8srv-root .c8srv-showcase-card:nth-child(1) { top: 100px !important; background: linear-gradient(135deg, #1C2436 0%, #0B111E 100%) !important; }
.c8srv-root .c8srv-showcase-card:nth-child(2) { top: 125px !important; background: linear-gradient(135deg, #1A2E66 0%, #0E1A3D 100%) !important; }
.c8srv-root .c8srv-showcase-card:nth-child(3) { top: 150px !important; background: linear-gradient(135deg, #153C9E 0%, #0B225C 100%) !important; }
.c8srv-root .c8srv-showcase-card:nth-child(4) { top: 175px !important; background: linear-gradient(135deg, #072899 0%, #031352 100%) !important; }
.c8srv-root .c8srv-showcase-card:nth-child(5) { top: 200px !important; background: linear-gradient(135deg, #0047E1 0%, #001B5C 100%) !important; }
.c8srv-root .c8srv-showcase-card:nth-child(6) { top: 225px !important; background: linear-gradient(135deg, #0f38b0 0%, #071c59 100%) !important; }
.c8srv-root .c8srv-showcase-card .c8srv-showcase-card-title { color: #FAFAF7 !important; }
.c8srv-root .c8srv-showcase-card .c8srv-showcase-card-desc { color: rgba(250, 250, 247, 0.8) !important; }
.c8srv-root .c8srv-showcase-card .c8srv-cap-item { color: #FAFAF7 !important; }
.c8srv-root .c8srv-showcase-card .c8srv-cap-dot { background: #FAFAF7 !important; }
.c8srv-root .c8srv-showcase-card .c8srv-explore { color: #FAFAF7 !important; }
.c8srv-root .c8srv-showcase-card .c8srv-showcase-card-img { box-shadow: 8px 8px 0px rgba(255,255,255,0.06) !important; border-color: rgba(255,255,255,0.1) !important; }
@media (max-width: 768px) {
.c8srv-root .c8srv-showcase-card {
grid-template-columns: 1fr !important;
padding: 1.5rem !important;
gap: 1.5rem !important;
position: sticky !important;
top: 80px !important;
margin-bottom: 60px !important;
}
}
.c8srv-root .c8srv-showcase-card-img {
border: 1px solid rgba(8,8,8,0.08) !important;
background: #FFFFFF !important;
padding: 8px !important;
box-shadow: 8px 8px 0px rgba(0,71,225,0.04) !important;
border-radius: 4px !important;
width: 100% !important;
aspect-ratio: 16/11 !important;
overflow: hidden !important;
}
.c8srv-root .c8srv-showcase-card-img img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
display: block !important;
border-radius: 4px !important;
}
.c8srv-root .c8srv-showcase-card-html, html, body {
overflow-x: clip !important;
width: 100% !important;
}
body {
overflow-x: clip !important;
width: 100% !important;
}
html, body {
overflow-x: clip !important;
width: 100% !important;
}
body {
display: flex !important;
flex-direction: column !important;
}
.c8srv-root .c8srv-showcase-card-title {
font-family: 'Michroma', sans-serif !important;
font-size: clamp(1.1rem, 2vw, 1.4rem) !important;
font-weight: 700 !important;
letter-spacing: 0.02em !important;
color: #080808 !important;
margin-bottom: 0.75rem !important;
text-transform: uppercase !important;
}
.c8srv-root .c8srv-showcase-card-desc {
font-size: 14px !important;
color: #6B6B6B !important;
margin-bottom: 1.5rem !important;
line-height: 1.6 !important;
font-family: 'DM Sans', sans-serif !important;
}
.c8srv-root .c8srv-cap-list { display: flex !important; flex-direction: column !important; gap: 0.75rem !important; margin-bottom: 1.5rem !important; }
.c8srv-root .c8srv-cap-item { display: flex !important; gap: 10px !important; align-items: center !important; font-size: 13px !important; color: #080808 !important; font-weight: 500 !important; }
.c8srv-root .c8srv-cap-dot { width: 6px !important; height: 6px !important; background: #0047E1 !important; flex-shrink: 0 !important; }
.c8srv-root .c8srv-hoverlist-section { position: relative !important; z-index: 2 !important; margin-bottom: 0 !important; }
.c8srv-root .c8srv-hoverlist { border-top: 1px solid rgba(8,8,8,0.1) !important; }
.c8srv-root .c8srv-hoverlist-item { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 2rem !important; padding: 2.1rem 0.5rem !important; border-bottom: 1px solid rgba(8,8,8,0.1) !important; cursor: pointer !important; position: relative !important; transition: padding-left 0.3s ease !important; }
.c8srv-root .c8srv-hoverlist-item:hover { padding-left: 1.25rem !important; }
.c8srv-root .c8srv-hoverlist-left { display: flex !important; align-items: baseline !important; gap: 1.5rem !important; flex: 1 !important; min-width: 0 !important; }
.c8srv-root .c8srv-hoverlist-num { font-family: 'Space Mono', monospace !important; font-size: 12px !important; color: #0047E1 !important; flex-shrink: 0 !important; }
.c8srv-root .c8srv-hoverlist-title { font-family: 'Bebas Neue', sans-serif !important; font-size: clamp(1.8rem, 4vw, 3.2rem) !important; text-transform: uppercase !important; letter-spacing: 0.01em !important; transition: color 0.25s ease !important; }
.c8srv-root .c8srv-hoverlist-item:hover .c8srv-hoverlist-title { color: #0047E1 !important; }
.c8srv-root .c8srv-hoverlist-tagline { font-size: 13px !important; color: #8A8A8A !important; font-weight: 300 !important; display: none !important; }
@media (min-width: 951px) { .c8srv-root .c8srv-hoverlist-tagline { display: block !important; margin-left: 1rem !important; } }
.c8srv-root .c8srv-hoverlist-thumb-mobile { display: none !important; }
@media (max-width: 950px) { .c8srv-root .c8srv-hoverlist-thumb-mobile { display: block !important; width: 56px !important; height: 56px !important; object-fit: cover !important; flex-shrink: 0 !important; border: 1px solid rgba(8,8,8,0.1) !important; } }
.c8srv-root .c8srv-hoverlist-right { display: flex !important; align-items: center !important; gap: 1.5rem !important; flex-shrink: 0 !important; }
@media (prefers-reduced-motion: reduce) { .c8srv-root .c8srv-hoverlist-preview { display: none !important; } }
.c8srv-root .c8srv-folder-section {
padding: 0 !important;
position: relative !important;
z-index: 2 !important;
}
.c8srv-root .c8srv-folder-deck {
position: relative !important;
display: block !important;
margin-top: 5rem !important;
padding-bottom: 0 !important;
margin-bottom: 6rem !important;
}
.c8srv-root .c8srv-folder-card {
background: #FAFAF9 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
border-radius: 4px !important;
padding: 3rem 3.5rem !important;
display: grid !important;
grid-template-columns: 1fr 1.2fr !important;
gap: 4rem !important;
align-items: center !important;
box-shadow: 0 10px 10px rgba(8, 8, 8, 0.01), 0 20px 40px rgba(8, 8, 8, 0) !important;
position: sticky !important;
transform-origin: center center !important;
transition: transform 0.1s ease, box-shadow 0.3s ease !important;
margin-bottom: 0px !important;
}
.c8srv-root .c8srv-folder-card:nth-child(1) { top: 130px !important; z-index: 10 !important; position: sticky !important; }
.c8srv-root .c8srv-folder-card:nth-child(2) { top: 130px !important; z-index: 20 !important; position: sticky !important; }
.c8srv-root .c8srv-folder-card:nth-child(3) { top: 130px !important; z-index: 30 !important; position: sticky !important; }
.c8srv-root .c8srv-folder-card:nth-child(4) { top: 130px !important; z-index: 40 !important; position: sticky !important; }
.c8srv-root .c8srv-folder-card:nth-child(5) { top: 130px !important; z-index: 50 !important; position: sticky !important; }
@media (max-width: 900px) {
.c8srv-root .c8srv-folder-deck {
margin-top: 3rem !important;
padding-bottom: 100px !important;
margin-bottom: 0px !important;
}
.c8srv-root .c8srv-folder-card {
grid-template-columns: 1fr !important;
padding: 2rem 1.5rem !important;
gap: 1.75rem !important;
position: sticky !important;
min-height: 480px !important;
}
.c8srv-root .c8srv-folder-card:nth-child(1),
.c8srv-root .c8srv-folder-card:nth-child(2),
.c8srv-root .c8srv-folder-card:nth-child(3),
.c8srv-root .c8srv-folder-card:nth-child(4),
.c8srv-root .c8srv-folder-card:nth-child(5) {
top: 100px !important;
position: sticky !important;
}
}
.c8srv-root .c8srv-folder-card-left {
display: flex !important;
flex-direction: column !important;
}
.c8srv-root .c8srv-folder-card-num {
font-family: 'Space Mono', monospace !important;
font-size: 12px !important;
color: #0047E1 !important;
margin-bottom: 1rem !important;
}
.c8srv-root .c8srv-folder-card-title {
font-family: 'Michroma', sans-serif !important;
font-size: clamp(1.4rem, 2.5vw, 1.8rem) !important;
font-weight: 700 !important;
letter-spacing: 0.02em !important;
color: #080808 !important;
margin-bottom: 1rem !important;
text-transform: uppercase !important;
}
.c8srv-root .c8srv-folder-card-desc {
font-size: 15px !important;
color: #6B6B6B !important;
line-height: 1.65 !important;
margin-bottom: 2rem !important;
font-family: 'DM Sans', sans-serif !important;
}
.c8srv-root .c8srv-folder-card-right {
display: flex !important;
justify-content: flex-end !important;
}
@media (max-width: 900px) {
.c8srv-root .c8srv-folder-card-right {
justify-content: flex-start !important;
}
}
.c8srv-root .c8srv-folder-card-img img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
border-radius: 6px !important;
display: block !important;
}
.c8srv-root .c8srv-folder-card-tag {
font-family: 'Space Mono', monospace !important;
font-size: 10px !important;
color: #E24F30 !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
margin-bottom: 0.5rem !important;
}
.c8srv-root .c8srv-flank-section {
width: 100% !important;
max-width: 100% !important;
margin-left: 0 !important;
transform: none !important;
left: 0 !important;
right: 0 !important;
background: #FFFFFF !important;
padding: 6rem 0 !important;
overflow: hidden !important;
position: relative !important;
z-index: 2 !important;
}
.c8srv-root .c8srv-flank-inner {
max-width: 1200px !important;
margin: 0 auto !important;
padding: 0 2rem !important;
text-align: center !important;
}
.c8srv-root .c8srv-flank-section.is-left-head .c8srv-flank-inner { text-align: left !important; max-width: 1400px !important; padding: 0 3.5rem !important; }
.c8srv-root .c8srv-flank-section.is-left-head .c8srv-label { justify-content: flex-start !important; }
.c8srv-root .c8srv-flank-section.is-left-head .c8srv-section-title { text-align: left !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 760px; }
@media (max-width: 1100px) { .c8srv-root .c8srv-flank-section.is-left-head .c8srv-flank-inner { padding: 0 1.25rem !important; } }
.c8srv-root .c8srv-flank-container {
position: relative !important;
height: 480px !important;
margin-top: 4rem !important;
display: flex !important;
justify-content: center !important;
align-items: center !important;
}
@media (max-width: 768px) {
.c8srv-root .c8srv-flank-container {
height: auto !important;
flex-direction: column !important;
gap: 2rem !important;
}
}
.c8srv-root .c8srv-flank-card {
width: 320px !important;
height: 380px !important;
background: #FFFFFF !important;
border: 1px solid rgba(8,8,8,0.08) !important;
border-radius: 4px !important;
padding: 2.5rem 2rem !important;
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: flex-start !important;
text-align: left !important;
position: absolute !important;
transition: transform 0.6s cubic-bezier(.16, 1, .3, 1), opacity 0.6s ease !important;
box-shadow: 0 10px 30px rgba(8, 8, 8, 0.03) !important;
}
@media (max-width: 768px) {
.c8srv-root .c8srv-flank-card {
position: relative !important;
width: 100% !important;
height: auto !important;
box-shadow: none !important;
pointer-events: auto !important;
}
}
.c8srv-root .c8srv-flank-card.is-center {
z-index: 5 !important;
border-color: rgba(0, 71, 225, 0.15) !important;
box-shadow: 0 15px 40px rgba(0, 71, 225, 0.06) !important;
}
.c8srv-root .c8srv-flank-card.is-left {
z-index: 3 !important;
transform: translate3d(0, 15px, 0) scale(0.9) rotate(0deg);
opacity: 0;
pointer-events: none;
}
.c8srv-root .c8srv-flank-card.is-right {
z-index: 3 !important;
transform: translate3d(0, 15px, 0) scale(0.9) rotate(0deg);
opacity: 0;
pointer-events: none;
}
.c8srv-root .c8srv-flank-card-quote {
font-family: 'Georgia', serif !important;
font-size: 3rem !important;
line-height: 1 !important;
color: #0047E1 !important;
margin-bottom: 0.5rem !important;
}
.c8srv-root .c8srv-flank-card-step {
font-family: 'Space Mono', monospace !important;
font-size: 10px !important;
letter-spacing: 0.1em !important;
color: #080808 !important;
text-transform: uppercase !important;
margin-bottom: 0.5rem !important;
}
.c8srv-root .c8srv-flank-card-divider {
width: 100% !important;
height: 1px !important;
background: rgba(8,8,8,0.12) !important;
margin-bottom: 1.5rem !important;
}
.c8srv-root .c8srv-flank-card-title {
font-family: 'Michroma', sans-serif !important;
font-size: 1.25rem !important;
font-weight: 700 !important;
color: #080808 !important;
margin-bottom: 0.75rem !important;
text-transform: uppercase !important;
letter-spacing: 0.01em !important;
}
.c8srv-root .c8srv-flank-card-desc {
font-size: 13.5px !important;
color: #6B6B6B !important;
line-height: 1.6 !important;
font-family: 'DM Sans', sans-serif !important;
margin-bottom: 1.5rem !important;
}
.c8srv-root .c8srv-flank-card-icon {
width: 46px !important;
height: 46px !important;
border-radius: 4px !important;
background: rgba(0, 71, 225, 0.06) !important;
color: #0047E1 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
margin-top: auto !important;
padding: 10px !important;
}
.c8srv-root .c8srv-flank-card-icon svg {
width: 100% !important;
height: 100% !important;
stroke: #0047E1 !important;
fill: none !important;
}
.c8srv-root .c8srv-pricing-section {
padding: 6rem 0 !important;
position: relative !important;
z-index: 2 !important;
}
.c8srv-root .c8srv-pricing-split {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 3.5rem !important;
margin-top: 4rem !important;
margin-bottom: 5rem !important;
}
@media (max-width: 900px) {
.c8srv-root .c8srv-pricing-split {
grid-template-columns: 1fr !important;
gap: 2.5rem !important;
}
}
.c8srv-root .c8srv-price-box {
background: #FAFAF9 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
border-radius: 4px !important;
padding: 3.5rem !important;
display: flex !important;
flex-direction: column !important;
box-shadow: 0 10px 40px rgba(0,0,0,0.02) !important;
position: relative !important;
}
@media (max-width: 600px) {
.c8srv-root .c8srv-price-box {
padding: 2rem !important;
}
}
.c8srv-root .c8srv-price-box.is-highlight {
background: #080808 !important;
border-color: #080808 !important;
color: #FAFAF7 !important;
}
.c8srv-root .c8srv-price-header {
margin-bottom: 2rem !important;
}
.c8srv-root .c8srv-price-type {
font-family: 'Space Mono', monospace !important;
font-size: 11px !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #0047E1 !important;
margin-bottom: 0.75rem !important;
}
.c8srv-root .c8srv-price-box.is-highlight .c8srv-price-type {
color: #7C93FF !important;
}
.c8srv-root .c8srv-price-title {
font-family: 'Michroma', sans-serif !important;
font-size: clamp(1.2rem, 2.5vw, 1.8rem) !important;
font-weight: 700 !important;
letter-spacing: 0.02em !important;
margin-bottom: 1rem !important;
text-transform: uppercase !important;
}
.c8srv-root .c8srv-price-amount {
font-family: 'DM Sans', sans-serif !important;
margin-bottom: 1.5rem !important;
display: flex !important;
align-items: baseline !important;
gap: 4px !important;
}
.c8srv-root .c8srv-price-amount .c8srv-price-num {
font-family: 'DM Sans', sans-serif !important;
font-size: clamp(2rem, 4vw, 2.8rem) !important;
font-weight: 700 !important;
letter-spacing: -0.02em !important;
color: #0047E1 !important;
line-height: 1 !important;
}
.c8srv-root .c8srv-price-box.is-highlight .c8srv-price-amount .c8srv-price-num {
color: #FAFAF7 !important;
}
.c8srv-root .c8srv-price-amount .c8srv-price-period {
font-size: 14px !important;
font-weight: 400 !important;
font-family: 'DM Sans', sans-serif !important;
color: #6B6B6B !important;
}
.c8srv-root .c8srv-price-box.is-highlight .c8srv-price-amount .c8srv-price-period {
color: rgba(250, 250, 247, 0.6) !important;
}
.c8srv-root .c8srv-price-desc {
font-size: 14.5px !important;
color: #6B6B6B !important;
line-height: 1.6 !important;
margin-bottom: 2rem !important;
}
.c8srv-root .c8srv-price-box.is-highlight .c8srv-price-desc {
color: rgba(250, 250, 247, 0.7) !important;
}
.c8srv-root .c8srv-price-features {
display: flex !important;
flex-direction: column !important;
gap: 1rem !important;
margin-bottom: 3rem !important;
margin-top: auto !important;
}
.c8srv-root .c8srv-price-feature {
display: flex !important;
align-items: center !important;
gap: 12px !important;
font-size: 14px !important;
font-weight: 500 !important;
}
.c8srv-root .c8srv-price-feature .c8srv-icon-sq {
width: 24px !important;
height: 24px !important;
border-radius: 4px !important;
}
.c8srv-root .c8srv-price-feature .c8srv-icon-sq svg {
width: 14px !important;
height: 14px !important;
}
.c8srv-root .c8srv-price-btn {
font-family: 'Space Mono', monospace !important;
font-size: 11px !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
padding: 16px 24px !important;
text-align: center !important;
font-weight: 700 !important;
border-radius: 4px !important;
transition: all 0.3s ease !important;
display: block !important;
width: 100% !important;
}
.c8srv-root .c8srv-price-btn.is-primary {
background: #0047E1 !important;
color: #FFFFFF !important;
}
.c8srv-root .c8srv-price-btn.is-primary:hover {
background: #0036ad !important;
}
.c8srv-root .c8srv-price-btn.is-light {
background: #FFFFFF !important;
color: #FAFAF7 !important;
border: 1px solid rgba(255,255,255,0.2) !important;
}
.c8srv-root .c8srv-price-btn.is-light:hover {
background: rgba(255,255,255,0.05) !important;
}
.c8srv-root .c8srv-estimator {
background: #FAFAF9 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
border-radius: 4px !important;
padding: 4rem !important;
box-shadow: 0 10px 40px rgba(0,0,0,0.02) !important;
margin-top: 4rem !important;
}
@media (max-width: 900px) {
.c8srv-root .c8srv-estimator {
padding: 2rem !important;
}
}
.c8srv-root .c8srv-estimator-grid {
display: grid !important;
grid-template-columns: 1.2fr 1fr !important;
gap: 4rem !important;
}
@media (max-width: 900px) {
.c8srv-root .c8srv-estimator-grid {
grid-template-columns: 1fr !important;
gap: 3rem !important;
}
}
.c8srv-root .c8srv-est-options {
display: flex !important;
flex-direction: column !important;
gap: 2rem !important;
}
.c8srv-root .c8srv-est-group-title {
font-family: 'Space Mono', monospace !important;
font-size: 11px !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #6B6B6B !important;
margin-bottom: 1rem !important;
display: block !important;
}
.c8srv-root .c8srv-est-choices {
display: flex !important;
flex-wrap: wrap !important;
gap: 0.75rem !important;
}
.c8srv-root .c8srv-est-choice {
font-family: 'DM Sans', sans-serif !important;
font-weight: 500 !important;
font-size: 13.5px !important;
padding: 10px 18px !important;
background: #FFFFFF !important;
border: 1px solid rgba(8,8,8,0.12) !important;
color: #080808 !important;
border-radius: 4px !important;
cursor: pointer !important;
transition: all 0.25s ease !important;
}
.c8srv-root .c8srv-est-choice.is-active {
background: #0047E1 !important;
color: #FFFFFF !important;
border-color: #0047E1 !important;
box-shadow: 0 4px 12px rgba(0, 71, 225, 0.15) !important;
}
.c8srv-root .c8srv-est-result {
background: #FFFFFF !important;
border: 1px solid rgba(8,8,8,0.08) !important;
border-radius: 4px !important;
padding: 3rem !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
box-shadow: 0 8px 30px rgba(0,0,0,0.01) !important;
}
@media (max-width: 600px) {
.c8srv-root .c8srv-est-result {
padding: 2rem 1.5rem !important;
}
}
.c8srv-root .c8srv-est-range-label {
font-family: 'Space Mono', monospace !important;
font-size: 10px !important;
letter-spacing: 0.1em !important;
text-transform: uppercase !important;
color: #6B6B6B !important;
margin-bottom: 0.5rem !important;
}
.c8srv-root .c8srv-est-range {
font-family: 'DM Sans', sans-serif !important;
font-size: 2.6rem !important;
font-weight: 700 !important;
color: #0047E1 !important;
letter-spacing: -0.02em !important;
margin-bottom: 1.5rem !important;
}
.c8srv-root .c8srv-est-deliverables-title {
font-size: 12px !important;
font-weight: 700 !important;
color: #080808 !important;
margin-bottom: 1rem !important;
text-transform: uppercase !important;
letter-spacing: 0.05em !important;
}
.c8srv-root .c8srv-est-deliverables {
display: flex !important;
flex-direction: column !important;
gap: 0.75rem !important;
margin-bottom: 2rem !important;
}
.c8srv-root .c8srv-est-item {
display: flex !important;
align-items: center !important;
gap: 8px !important;
font-size: 13px !important;
color: #6B6B6B !important;
}
.c8srv-root .c8srv-est-dot {
width: 5px !important;
height: 5px !important;
background: #0047E1 !important;
border-radius: 50% !important;
}
.c8srv-root .c8srv-vs { position: relative !important; z-index: 2 !important; margin-bottom: 8rem !important; }
.c8srv-root .c8srv-vs-priority-row { display: flex !important; flex-wrap: wrap !important; gap: 0.6rem !important; margin: 2rem 0 3rem 0 !important; }
.c8srv-root .c8srv-vs-priority-btn { font-family: 'Space Mono', monospace !important; font-size: 11px !important; letter-spacing: .06em !important; text-transform: uppercase !important; padding: 12px 18px !important; background: #FFFFFF !important; border: 1px solid rgba(8,8,8,0.15) !important; color: #080808 !important; }
.c8srv-root .c8srv-vs-priority-btn.is-active { background: #0047E1 !important; color: #FFFFFF !important; border-color: #0047E1 !important; }
.c8srv-root .c8srv-vs-table-wrap { overflow-x: auto !important; }
.c8srv-root .c8srv-vs-table { width: 100% !important; border-collapse: collapse !important; min-width: 640px !important; }
.c8srv-root .c8srv-vs-table th { text-align: left !important; font-family: 'Space Mono', monospace !important; font-size: 10.5px !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: #6B6B6B !important; padding: 1rem 1.25rem !important; border-bottom: 1px solid rgba(8,8,8,0.12) !important; }
.c8srv-root .c8srv-vs-table th:first-child { color: #080808 !important; }
.c8srv-root .c8srv-vs-table td { padding: 1.25rem !important; border-bottom: 1px solid rgba(8,8,8,0.08) !important; font-size: 14px !important; font-weight: 300 !important; color: #6B6B6B !important; vertical-align: top !important; transition: background 0.25s ease !important; }
.c8srv-root .c8srv-vs-table td:first-child { font-weight: 500 !important; color: #080808 !important; }
.c8srv-root .c8srv-vs-table tr[data-c8srv-row].is-highlighted td { background: #F4F1EA !important; }
@media (max-width: 700px) {
.c8srv-root .c8srv-vs-table-wrap { overflow-x: visible !important; }
.c8srv-root .c8srv-vs-table, .c8srv-root .c8srv-vs-table tbody, .c8srv-root .c8srv-vs-table tr, .c8srv-root .c8srv-vs-table td { display: block !important; min-width: 0 !important; width: 100% !important; }
.c8srv-root .c8srv-vs-table thead { display: none !important; }
.c8srv-root .c8srv-vs-table tr { border: 1px solid rgba(8,8,8,0.12) !important; margin-bottom: 1rem !important; background: #FFFFFF !important; }
.c8srv-root .c8srv-vs-table td { padding: 0.9rem 1.1rem !important; border-bottom: 1px solid rgba(8,8,8,0.08) !important; }
.c8srv-root .c8srv-vs-table td:first-child { background: #F4F1EA !important; font-size: 15px !important; }
.c8srv-root .c8srv-vs-table td:last-child { border-bottom: 0 !important; }
.c8srv-root .c8srv-vs-table td[data-label]::before { content: attr(data-label); display: block; font-family: 'Space Mono', monospace; font-size: 10.5px; letter-spacing: .08em; text-transform: uppercase; color: #0047E1; margin-bottom: 0.35rem; }
}
.c8srv-root .c8srv-vs-winner { font-family: 'Space Mono', monospace !important; font-size: 9.5px !important; letter-spacing: .08em !important; text-transform: uppercase !important; color: #0047E1 !important; display: block !important; margin-top: 4px !important; }
.c8srv-root .c8srv-vs-note { font-size: 12.5px !important; color: #8A8A8A !important; font-weight: 300 !important; margin-top: 1.5rem !important; }
.c8srv-root .c8srv-folder-tab {
position: absolute !important;
top: -38px !important;
height: 38px !important;
background: #FAFAF9 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
border-bottom: none !important;
border-radius: 4px 4px 0 0 !important;
padding: 8px 20px !important;
font-family: 'Space Mono', monospace !important;
font-size: 10.5px !important;
font-weight: 700 !important;
color: #0047E1 !important;
text-transform: uppercase !important;
letter-spacing: 0.05em !important;
display: flex !important;
align-items: center !important;
}
.c8srv-root .c8srv-folder-card:nth-child(1) .c8srv-folder-tab { left: 2.5rem !important; }
.c8srv-root .c8srv-folder-card:nth-child(2) .c8srv-folder-tab { left: 14.9rem !important; }
.c8srv-root .c8srv-folder-card:nth-child(3) .c8srv-folder-tab { left: 26.9rem !important; }
.c8srv-root .c8srv-folder-card:nth-child(4) .c8srv-folder-tab { left: 38.4rem !important; }
.c8srv-root .c8srv-folder-card:nth-child(5) .c8srv-folder-tab { left: 49.4rem !important; }
@media (max-width: 900px) {
.c8srv-root .c8srv-folder-tab {
position: absolute !important;
top: -30px !important;
left: 1.5rem !important;
height: 30px !important;
padding: 0 15px !important;
background: #FAFAF9 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
border-bottom: none !important;
border-radius: 4px 4px 0 0 !important;
display: flex !important;
align-items: center !important;
margin-bottom: 0 !important;
width: 220px !important;
max-width: 80vw !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
.c8srv-root .c8srv-folder-card:nth-child(1) .c8srv-folder-tab,
.c8srv-root .c8srv-folder-card:nth-child(2) .c8srv-folder-tab,
.c8srv-root .c8srv-folder-card:nth-child(3) .c8srv-folder-tab,
.c8srv-root .c8srv-folder-card:nth-child(4) .c8srv-folder-tab,
.c8srv-root .c8srv-folder-card:nth-child(5) .c8srv-folder-tab { left: 1.5rem !important; }
}
.c8srv-root .c8srv-folder-card-left { display: flex !important; flex-direction: column !important; height: 100% !important; }
.c8srv-root .c8srv-folder-card-title {
font-family: 'Michroma', sans-serif !important;
font-size: clamp(1.2rem, 2vw, 1.6rem) !important;
font-weight: 700 !important;
letter-spacing: 0.02em !important;
color: #080808 !important;
margin-bottom: 1rem !important;
text-transform: uppercase !important;
}
.c8srv-root .c8srv-folder-card-desc {
font-size: 14.5px !important;
color: #6B6B6B !important;
line-height: 1.65 !important;
font-family: 'DM Sans', sans-serif !important;
margin-top: auto !important;
margin-bottom: 1.5rem !important;
}
.c8srv-root .c8srv-folder-card-right { display: flex !important; justify-content: center !important; }
.c8srv-root .c8srv-folder-card-img {
border: 1px solid rgba(8,8,8,0.08) !important;
background: #FFFFFF !important;
padding: 8px !important;
box-shadow: 10px 10px 0px rgba(0,71,225,0.03) !important;
border-radius: 4px !important;
width: 100% !important;
max-width: 440px !important;
aspect-ratio: 4/3 !important;
overflow: hidden !important;
}
.c8srv-root .c8srv-folder-card-img img {
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
border-radius: 6px !important;
display: block !important;
}
.c8srv-root .c8srv-catalog-item {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
padding: 2.25rem 0.5rem !important;
border-bottom: 1px solid rgba(8,8,8,0.1) !important;
cursor: pointer !important;
position: relative !important;
transition: padding-left 0.3s ease !important;
}
.c8srv-root .c8srv-catalog-item:hover {
padding-left: 1.25rem !important;
}
.c8srv-root .c8srv-catalog-title {
font-family: 'Bebas Neue', sans-serif !important;
font-size: clamp(1.8rem, 4vw, 3.2rem) !important;
text-transform: uppercase !important;
letter-spacing: 0.01em !important;
transition: color 0.25s ease !important;
margin: 0 !important;
}
.c8srv-root .c8srv-catalog-item:hover .c8srv-catalog-title {
color: #0047E1 !important;
}
.c8srv-root .c8srv-catalog-tagline {
font-size: 13px !important;
color: #8A8A8A !important;
font-weight: 300 !important;
margin-left: 1.5rem !important;
}
.c8srv-root .c8srv-catalog-badges {
display: flex !important;
gap: 0.5rem !important;
opacity: 0 !important;
transform: translateX(12px) !important;
transition: opacity 0.3s ease, transform 0.3s ease !important;
pointer-events: none !important;
}
@media (max-width: 768px) {
.c8srv-root .c8srv-catalog-item {
flex-direction: column !important;
align-items: flex-start !important;
gap: 1rem !important;
}
.c8srv-root .c8srv-catalog-left {
flex-direction: column !important;
gap: 0.5rem !important;
}
.c8srv-root .c8srv-catalog-tagline {
margin-left: 0 !important;
}
.c8srv-root .c8srv-catalog-badges {
opacity: 1 !important;
transform: none !important;
pointer-events: auto !important;
flex-wrap: wrap !important;
}
}
.c8srv-root .c8srv-catalog-item:hover .c8srv-catalog-badges {
opacity: 1 !important;
transform: translateX(0) !important;
}
.c8srv-root .c8srv-badge {
font-family: 'Space Mono', monospace !important;
font-size: 10px !important;
background: #080808 !important;
color: #FAFAF7 !important;
padding: 0.4rem 0.8rem !important;
border-radius: 4px !important;
letter-spacing: 0.05em !important;
white-space: nowrap !important;
}
.c8srv-root .c8srv-hoverlist-preview {
position: absolute !important;
width: 310px !important;
height: 240px !important;
pointer-events: none !important;
z-index: 50 !important;
display: block !important;
opacity: 0 !important;
transition: opacity 0.28s ease !important;
transform: translate(-50%, -50%) !important;
}
.c8srv-root .c8srv-hoverlist-preview.is-active {
opacity: 1 !important;
}
.c8srv-root .c8srv-fan-card {
position: absolute !important;
bottom: 0 !important;
left: 50% !important;
width: 118px !important;
height: 155px !important;
margin-left: -59px !important;
border-radius: 4px !important;
box-shadow: 0 14px 36px rgba(8,8,8,0.22) !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
overflow: hidden !important;
padding: 0 10px !important;
transition: transform 0.45s cubic-bezier(.16,.8,.24,1), opacity 0.4s ease !important;
}
.c8srv-root .c8srv-fan-left {
background: #0047E1 !important;
border: 1px solid rgba(255,255,255,0.12) !important;
z-index: 10 !important;
transform: translateX(-105px) translateY(-18px) rotate(-10deg) !important;
}
.c8srv-root .c8srv-fan-center {
background: #F5F0E8 !important;
border: 1px solid rgba(8,8,8,0.1) !important;
z-index: 20 !important;
transform: translateX(0px) rotate(0deg) !important;
}
.c8srv-root .c8srv-fan-right {
background: #080808 !important;
border: 1px solid rgba(255,255,255,0.08) !important;
z-index: 15 !important;
transform: translateX(105px) translateY(-18px) rotate(10deg) !important;
}
.c8srv-root .c8srv-fan-word {
font-family: 'Bebas Neue', sans-serif !important;
font-size: 36px !important;
line-height: 1 !important;
letter-spacing: 0.04em !important;
text-align: center !important;
white-space: normal !important;
word-break: break-word !important;
overflow: hidden !important;
width: 100% !important;
display: block !important;
transition: opacity 0.18s ease !important;
}
.c8srv-root .c8srv-fan-left .c8srv-fan-word,
.c8srv-root .c8srv-fan-right .c8srv-fan-word { color: #FAFAF7 !important; }
.c8srv-root .c8srv-fan-center .c8srv-fan-word { color: #080808 !important; }
.c8srv-root .c8srv-faq-section { padding: 6rem 0 !important; }
.c8srv-root .c8srv-accordion { border-top: 1px solid rgba(8,8,8,0.1) !important; margin-top: 2.5rem !important; }
.c8srv-root .c8srv-accordion-item { border-bottom: 1px solid rgba(8,8,8,0.1) !important; }
.c8srv-root .c8srv-accordion-head { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 1.5rem !important; padding: 1.6rem 0.25rem !important; cursor: pointer !important; }
.c8srv-root .c8srv-accordion-title { font-family: 'Michroma', sans-serif !important; font-size: clamp(.9rem, 1.4vw, 1.1rem) !important; font-weight: 700 !important; text-transform: uppercase !important; letter-spacing: 0.01em !important; color: #080808 !important; margin: 0 !important; }
.c8srv-root .c8srv-accordion-toggle { width: 26px !important; height: 26px !important; border: 1px solid rgba(8,8,8,0.2) !important; border-radius: 4px !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; position: relative !important; }
.c8srv-root .c8srv-accordion-toggle::before, .c8srv-root .c8srv-accordion-toggle::after { content: '' !important; position: absolute !important; background: #080808 !important; transition: transform 0.25s ease, opacity 0.25s ease !important; }
.c8srv-root .c8srv-accordion-toggle::before { width: 12px !important; height: 1px !important; }
.c8srv-root .c8srv-accordion-toggle::after { width: 1px !important; height: 12px !important; }
.c8srv-root .c8srv-accordion-item.is-open .c8srv-accordion-toggle::after { transform: rotate(90deg) !important; opacity: 0 !important; }
.c8srv-root .c8srv-accordion-body { display: grid !important; grid-template-rows: 0fr !important; transition: grid-template-rows 0.35s ease !important; }
.c8srv-root .c8srv-accordion-item.is-open .c8srv-accordion-body { grid-template-rows: 1fr !important; }
.c8srv-root .c8srv-accordion-body > div { overflow: hidden !important; }
.c8srv-root .c8srv-accordion-desc { font-size: 14.5px !important; font-weight: 300 !important; color: #6B6B6B !important; max-width: 720px !important; line-height: 1.72 !important; padding: 0 0.25rem 1.75rem 0.25rem !important; }