/* Codeforce brand system — precise, calm and technology-led */
:root {
    --cf-blue: #0759e6;
    --cf-blue-deep: #073fbd;
    --cf-navy: #07162f;
    --cf-ink: #101a2c;
    --cf-muted: #5d687a;
    --cf-soft: #f4f7fb;
    --cf-line: #dce4ee;
    --cf-cyan: #08bfd1;
    --cf-violet: #647cf5;
    --cf-gradient: linear-gradient(118deg, #02c7cf 0%, #168ae7 56%, #6579f5 100%);
    --cf-canvas: #fbfdff;
    --cf-soft-gradient: linear-gradient(135deg, rgba(8,191,209,.055) 0%, rgba(247,252,255,.92) 34%, rgba(7,89,230,.045) 100%);
}

.cf-site,
.cf-service-page {
    color: var(--cf-ink);
    background-color: var(--cf-canvas);
    background-image:
        radial-gradient(ellipse at 5% 12%,rgba(8,191,209,.07),transparent 23%),
        radial-gradient(ellipse at 96% 38%,rgba(7,89,230,.055),transparent 24%),
        radial-gradient(ellipse at 12% 76%,rgba(100,124,245,.045),transparent 21%),
        linear-gradient(180deg,#fff 0%,#f9fcff 27%,#fff 49%,#f7fbff 76%,#fff 100%);
    overflow: hidden;
}
.cf-site *, .cf-service-page * { box-sizing: border-box; }
.cf-site h1,.cf-site h2,.cf-site h3,.cf-service-page h1,.cf-service-page h2,.cf-service-page h3 { line-break: strict; text-wrap: balance; }
@supports (word-break: auto-phrase) { .cf-site h1,.cf-site h2,.cf-site h3,.cf-service-page h1,.cf-service-page h2,.cf-service-page h3 { word-break: auto-phrase; } }
.cf-shell { width: min(1200px, calc(100% - 64px)); margin-inline: auto; }
.cf-section { position: relative; isolation: isolate; padding: 128px 0; overflow: hidden; }
.cf-section,.cf-contact-band { content-visibility:auto; contain-intrinsic-size:auto 760px; }
.cf-section > .cf-shell { position: relative; z-index: 2; }
.cf-section--soft { background: var(--cf-soft-gradient); }
.cf-section--ink { color: #fff; background: var(--cf-navy); }
.cf-section--blue { color: #fff; background: #082a6d; }
.cf-kicker, .cf-eyebrow { margin: 0 0 24px; color: var(--cf-blue); font: 800 11px/1.3 Manrope, sans-serif; letter-spacing: .18em; }
.cf-kicker--light { color: #70e2eb; }
.cf-section h2, .cf-assurance-copy h2 { margin: 0; font-size: clamp(38px, 4.7vw, 68px); font-weight: 600; line-height: 1.22; letter-spacing: -.045em; }
.cf-accent { color: var(--cf-blue); }
.cf-section-head { margin-bottom: 64px; }
.cf-section-head--split { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(320px, .72fr); gap: 96px; align-items: end; }
.cf-section-head--row { display: flex; align-items: end; justify-content: space-between; gap: 40px; }
.cf-section-copy { max-width: 520px; margin: 0; color: var(--cf-muted); font-size: 16px; line-height: 2; }
.cf-section-copy p { margin-bottom: 1.25em; }
.cf-section-copy p:last-child { margin-bottom: 0; }
.cf-section-subcopy { margin: 20px 0 0; color: #91a0b5; font-size: 15px; }
.cf-section--ink h2, .cf-section--blue h2 { color: #fff; }
.cf-site .cf-kicker::before { content: ''; display: inline-block; width: 5px; height: 5px; margin: 0 10px 1px 0; border-radius: 50%; background: currentColor; box-shadow: 0 0 0 0 rgba(8,191,209,.28); animation: cf-data-pulse 2.8s ease-out infinite; }

/* Brand loader — geometric construction translated from the Codeforce cube */
html.cf-loading,
html.cf-loading body { overflow: hidden; }
.cf-loader { position: fixed; z-index: 100000; inset: 0; display: grid; place-items: center; overflow: hidden; color: var(--cf-navy); background: #fff; clip-path: inset(0); transition: clip-path .62s cubic-bezier(.77,0,.18,1),opacity .25s ease .3s; }
.cf-loader__grid { position: absolute; inset: 0; opacity: 0; background-image: linear-gradient(rgba(7,89,230,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(7,89,230,.055) 1px,transparent 1px),radial-gradient(circle at center,rgba(8,191,209,.08),transparent 38%); background-size: 64px 64px,64px 64px,auto; animation: cf-loader-grid 1.25s .08s ease forwards; }
.cf-loader__grid::before,.cf-loader__grid::after { content: ''; position: absolute; background: rgba(7,89,230,.14); transform: scaleX(0); transform-origin: left; animation: cf-loader-rule 1s .18s cubic-bezier(.22,1,.36,1) forwards; }
.cf-loader__grid::before { top: calc(50% - 82px); left: 0; width: 100%; height: 1px; }
.cf-loader__grid::after { top: calc(50% + 82px); left: 0; width: 100%; height: 1px; animation-delay: .28s; }
.cf-loader__scan { position: absolute; z-index: 3; inset: 0 auto 0 -25%; width: 18%; opacity: 0; background: linear-gradient(90deg,transparent,rgba(14,196,211,.08),rgba(7,89,230,.05),transparent); transform: skewX(-12deg); animation: cf-loader-scan 1.2s .35s ease-in-out forwards; }
.cf-loader__content { position: relative; z-index: 2; width: min(430px,calc(100% - 80px)); min-height: 170px; display: grid; place-items: center; }
.cf-loader__blueprint { position: absolute; z-index: 1; top: 50%; left: calc(50% - 143px); width: 92px; height: 96px; transform: translate(-50%,-50%); animation: cf-loader-blueprint-out .45s 1.08s ease forwards; }
.cf-loader__cube { width: 100%; height: 100%; overflow: visible; }
.cf-loader__cube-lines { fill: none; stroke: var(--cf-blue); stroke-width: 1.25; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 920; stroke-dashoffset: 920; animation: cf-loader-draw 1.35s .18s cubic-bezier(.65,0,.35,1) forwards; }
.cf-loader__cube-lines path:nth-child(2) { stroke: var(--cf-cyan); }
.cf-loader__cube-lines path:nth-child(3) { stroke: var(--cf-violet); }
.cf-loader__cube-nodes { fill: #fff; stroke: var(--cf-cyan); stroke-width: 1.5; opacity: 0; animation: cf-loader-nodes .45s 1s ease forwards; }
.cf-loader__axis { position: absolute; opacity: 0; background: rgba(7,89,230,.12); animation: cf-loader-axis .7s .25s ease forwards; }
.cf-loader__axis--x { top: 50%; left: -18px; width: 128px; height: 1px; transform: scaleX(0); }
.cf-loader__axis--y { top: -14px; left: 50%; width: 1px; height: 124px; transform: scaleY(0); }
.cf-loader__logo-lockup { position: relative; z-index: 2; display: flex; align-items: center; justify-content: center; gap: 20px; opacity: 0; clip-path: inset(0 50% 100% 50%); filter: blur(8px); transform: translateY(10px) scale(.985); animation: cf-loader-logo-in .9s .52s cubic-bezier(.16,1,.3,1) forwards; }
.cf-loader__logo-mark,.cf-loader__logo-word { display: block; flex: 0 0 auto; }
.cf-loader__logo-mark { width: 74px; height: 84px; background-image:var(--cf-loader-logo-image); background-repeat:no-repeat; background-position:center; background-size:contain; }
.cf-loader__logo-word { color:var(--cf-blue); font:800 48px/1 Manrope,'Noto Sans JP',sans-serif; letter-spacing:-.055em; }
.cf-loader__status { position: absolute; z-index: 2; right: 40px; bottom: 30px; left: 40px; display: flex; align-items: center; justify-content: space-between; color: #8290a3; font: 700 9px/1 Manrope,sans-serif; letter-spacing: .16em; }
.cf-loader__status::before { content: ''; position: absolute; right: 52px; bottom: 3px; left: 250px; height: 1px; background: #e3e9f0; }
.cf-loader__status::after { content: ''; position: absolute; bottom: 3px; left: 250px; width: calc(100% - 302px); height: 1px; background: var(--cf-gradient); transform: scaleX(0); transform-origin: left; animation: cf-loader-progress 1.65s ease forwards; }
.cf-loader__status b { color: var(--cf-blue); font: 700 11px/1 Manrope,sans-serif; letter-spacing: .08em; }
.cf-loader-leaving .cf-loader { clip-path: inset(0 0 100% 0); opacity: .92; pointer-events: none; }
.cf-loader-leaving .cf-loader__content { transform: translateY(-18px); opacity: 0; transition: transform .45s ease,opacity .3s ease; }
html:not(.cf-loading):not(.cf-loader-leaving) .cf-loader { display: none; }
html.cf-loading .cf-hero__mesh,html.cf-loading .cf-eyebrow,html.cf-loading .cf-hero__title,html.cf-loading .cf-hero__lead,html.cf-loading .cf-actions,html.cf-loading .cf-hero__note,html.cf-loading .cf-logo-cube,html.cf-loading .cf-logo-stage::before,html.cf-loading .cf-logo-stage::after,html.cf-loading .cf-hero__orbit { animation-play-state:paused; }
@keyframes cf-loader-grid { from { opacity: 0; transform: scale(1.025); } to { opacity: 1; transform: scale(1); } }
@keyframes cf-loader-rule { to { transform: scaleX(1); } }
@keyframes cf-loader-draw { to { stroke-dashoffset: 0; } }
@keyframes cf-loader-nodes { to { opacity: 1; } }
@keyframes cf-loader-axis { to { opacity: 1; transform: scale(1); } }
@keyframes cf-loader-blueprint-out { to { opacity: .08; filter: blur(3px); transform: translate(-50%,-50%) scale(1.08); } }
@keyframes cf-loader-logo-in { to { opacity: 1; clip-path: inset(0); filter: blur(0); transform: translateY(0) scale(1); } }
@keyframes cf-loader-progress { to { transform: scaleX(1); } }
@keyframes cf-loader-scan { 0% { left: -25%; opacity: 0; } 20%,72% { opacity: 1; } 100% { left: 115%; opacity: 0; } }

/* Hero */
.cf-hero { position: relative; isolation: isolate; padding: 168px 0 0; overflow: hidden; background: linear-gradient(132deg,#fff 16%,#f5fcff 52%,#f7f8ff 78%,#fff 100%); }
.cf-hero::before { content: ''; position: absolute; z-index: 0; inset: -18% -12% -14%; opacity: .72; background: radial-gradient(circle at 18% 24%,rgba(8,191,209,.12),transparent 25%),radial-gradient(circle at 84% 18%,rgba(100,124,245,.12),transparent 28%),radial-gradient(circle at 64% 82%,rgba(7,89,230,.08),transparent 30%),linear-gradient(120deg,#fff 20%,#f7fbff 52%,#fff 82%); background-size: 120% 120%,130% 130%,125% 125%,100% 100%; filter: saturate(.86); animation: cf-aurora-drift 14s cubic-bezier(.45,0,.55,1) infinite alternate; pointer-events: none; }
.cf-hero::after { content: ''; position: absolute; z-index: 1; inset: 80px 0 0; opacity: .26; background-image: linear-gradient(115deg,transparent 0 47%,rgba(8,191,209,.14) 47.08%,transparent 47.16%),linear-gradient(90deg,transparent 0 72%,rgba(7,89,230,.11) 72.08%,transparent 72.16%); background-size: 720px 100%,540px 100%; mask-image: linear-gradient(to bottom,transparent,#000 28%,transparent 92%); animation: cf-circuit-drift 18s linear infinite; pointer-events: none; }
.cf-hero__mesh { position: absolute; z-index: 1; inset: 0 0 auto 52%; height: 760px; opacity: 0; background-image: radial-gradient(circle at var(--pointer-x,50%) var(--pointer-y,45%),rgba(0,192,207,.13),transparent 19%),linear-gradient(rgba(8,90,230,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(8,90,230,.07) 1px,transparent 1px); background-size: auto,52px 52px,52px 52px; mask-image: linear-gradient(110deg,transparent 5%,#000 42%,transparent 92%); animation: cf-mesh-in 1.2s .1s ease forwards; }
.cf-hero__inner { position: relative; z-index: 2; min-height: 680px; display: grid; grid-template-columns: minmax(0, 1.13fr) minmax(360px, .87fr); gap: 56px; align-items: center; }
.cf-hero__copy { position: relative; z-index: 2; padding-bottom: 44px; }
.cf-eyebrow { display: flex; align-items: center; gap: 12px; margin-bottom: 30px; color: #3f5068; animation: cf-reveal-up .7s .12s both; }
.cf-eyebrow span { width: 32px; height: 2px; background: var(--cf-gradient); }
.cf-hero__title { max-width: 760px; margin: 0; color: var(--cf-navy); font-size: clamp(48px, 5.65vw, 78px); font-weight: 600; line-height: 1.18; letter-spacing: -.055em; animation: cf-reveal-up .9s .24s both; }
.cf-hero__title em { color: transparent; font-style: normal; background: var(--cf-gradient); background-clip: text; -webkit-background-clip: text; }
.cf-mobile-only { display: none; }
.cf-hero__lead { max-width: 650px; margin: 32px 0 0; color: #536176; font-size: 16px; font-weight: 500; line-height: 2; animation: cf-reveal-up .8s .4s both; }
.cf-actions { display: flex; gap: 12px; margin-top: 38px; flex-wrap: wrap; animation: cf-reveal-up .8s .52s both; }
.cf-button { min-width: 214px; min-height: 58px; display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 15px 20px 15px 24px; border: 1px solid transparent; border-radius: 2px; font-size: 14px; font-weight: 700; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.cf-button b { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; font: 700 13px Manrope, sans-serif; }
.cf-button:hover { transform: translateY(-2px); }
.cf-button--primary { color: #fff; background: var(--cf-navy); }
.cf-button--primary b { color: var(--cf-navy); background: #fff; }
.cf-button--primary:hover { color: #fff; background: var(--cf-blue); box-shadow: 0 16px 36px rgba(7, 68, 180, .18); }
.cf-button--line { color: var(--cf-navy); border-color: #bcc9d8; background: #fff; }
.cf-button--line:hover { color: var(--cf-blue); border-color: var(--cf-blue); }
.cf-button--white { color: var(--cf-navy); background: #fff; }
.cf-button--white b { color: #fff; background: var(--cf-blue); }
.cf-button--white:hover { color: var(--cf-blue); box-shadow: 0 18px 42px rgba(0, 0, 0, .2); }
.cf-hero__note { display: flex; align-items: center; gap: 8px; margin: 18px 0 0; color: #7b8797; font-size: 12px; animation: cf-reveal-up .7s .64s both; }
.cf-hero__note span { color: var(--cf-cyan); font-size: 8px; }
.cf-hero__visual { --logo-scale: .57; position: relative; min-height: 540px; display: grid; place-items: center; }
.cf-logo-stage { position:relative; z-index:2; width:360px; height:410px; display:grid; place-items:center; perspective:980px; transform:translate3d(var(--motion-x,0),var(--motion-y,0),0) scale(var(--logo-scale,1)); transition:transform .8s cubic-bezier(.2,.8,.2,1); }
.cf-logo-stage::before { content: ''; position: absolute; z-index: 4; left: -8%; top: -12%; width: 116%; height: 14%; opacity: 0; background: linear-gradient(180deg,transparent,rgba(55,224,235,.52),transparent); filter: blur(5px); mix-blend-mode: screen; animation: cf-logo-scan 4.8s 1.45s cubic-bezier(.4,0,.2,1) infinite; pointer-events: none; }
.cf-logo-stage::after { content: ''; position: absolute; z-index: -1; inset: 15% 4%; opacity: 0; border-radius: 50%; background: radial-gradient(circle,rgba(14,184,207,.17),transparent 68%); animation: cf-signal-pulse 3.8s 1s ease-in-out infinite; }
.cf-logo-cube { --cube-size:246px; --cube-half:123px; position:relative; width:var(--cube-size); height:var(--cube-size); transform-style:preserve-3d; transform-origin:50% 50%; will-change:transform; animation:cf-logo-cube-rotate 15s linear infinite; }
.cf-logo-cube__face { position:absolute; inset:0; overflow:hidden; background-repeat:no-repeat; background-position:center; background-size:100% 100%; backface-visibility:hidden; }
.cf-logo-cube__face::after { content:''; position:absolute; inset:-55%; opacity:.22; background:linear-gradient(110deg,transparent 42%,rgba(255,255,255,.95) 49%,transparent 56%); transform:translateX(-38%); animation:cf-logo-face-shine 5.5s ease-in-out infinite; }
.cf-logo-cube__face--front { background-image:var(--cf-face-right); transform:translateZ(var(--cube-half)); }
.cf-logo-cube__face--back { background-image:var(--cf-face-right); transform:rotateY(180deg) translateZ(var(--cube-half)); }
.cf-logo-cube__face--right { background-image:var(--cf-face-left); transform:rotateY(90deg) translateZ(var(--cube-half)); }
.cf-logo-cube__face--left { background-image:var(--cf-face-left); transform:rotateY(-90deg) translateZ(var(--cube-half)); }
.cf-logo-cube__face--top { background-image:var(--cf-face-top); transform:rotateX(90deg) translateZ(var(--cube-half)); }
.cf-logo-cube__face--bottom { background-image:var(--cf-face-top); transform:rotateX(-90deg) translateZ(var(--cube-half)); }
.cf-hero__orbit { position: absolute; border: 1px solid rgba(7, 89, 230, .14); border-radius: 50%; }
.cf-hero__orbit::before { content: ''; position: absolute; left: 50%; top: -4px; width: 7px; height: 7px; border-radius: 50%; background: #08becf; box-shadow: 0 0 16px rgba(8,190,207,.8); }
.cf-hero__orbit--outer { width: 500px; height: 500px; opacity: 0; animation: cf-orbit-in 1s .48s ease forwards,cf-spin 28s 1.5s linear infinite; }
.cf-hero__orbit--inner { width: 385px; height: 385px; opacity: 0; border-style: dashed; animation: cf-orbit-in 1s .62s ease forwards,cf-spin-reverse 21s 1.5s linear infinite; }
.cf-hero__tag { position: absolute; z-index: 3; padding: 8px 12px; color: var(--cf-blue); border: 1px solid #d8e2ef; background: rgba(255, 255, 255, .9); box-shadow: 0 10px 28px rgba(31, 77, 140, .1); font: 800 9px Manrope, sans-serif; letter-spacing: .16em; }
.cf-hero__tag--one { top: 78px; left: 4px; }
.cf-hero__tag--two { right: -8px; top: 47%; }
.cf-hero__tag--three { bottom: 72px; left: 42px; }
@keyframes cf-spin { to { transform: rotate(360deg); } }
@keyframes cf-spin-reverse { to { transform: rotate(-360deg); } }
@keyframes cf-reveal-up { from { opacity: 0; transform: translateY(24px); filter: blur(8px); } to { opacity: 1; transform: translateY(0); filter: blur(0); } }
@keyframes cf-mesh-in { to { opacity: .65; } }
@keyframes cf-logo-reveal { from { opacity: 0; clip-path: inset(52% 0 48% 0); filter: blur(16px) drop-shadow(0 0 0 transparent); } to { opacity: 1; clip-path: inset(0); filter: blur(0) drop-shadow(0 34px 32px rgba(23,103,205,.13)); } }
@keyframes cf-logo-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-11px); } }
@keyframes cf-logo-cube-rotate { 0% { transform:rotateX(-28deg) rotateY(35deg); } 50% { transform:rotateX(-28deg) rotateY(215deg); } 100% { transform:rotateX(-28deg) rotateY(395deg); } }
@keyframes cf-logo-face-shine { 0%,22% { opacity:0; transform:translateX(-42%); } 42% { opacity:.38; } 72%,100% { opacity:0; transform:translateX(42%); } }
@keyframes cf-logo-scan { 0%,16% { opacity: 0; transform: translateY(-20%); } 24% { opacity: .85; } 58% { opacity: .35; } 72%,100% { opacity: 0; transform: translateY(760%); } }
@keyframes cf-signal-pulse { 0%,100% { opacity: .25; transform: scale(.88); } 50% { opacity: .8; transform: scale(1.06); } }
@keyframes cf-orbit-in { from { opacity: 0; transform: scale(.82); } to { opacity: 1; transform: scale(1); } }
@keyframes cf-aurora-drift { 0% { transform: translate3d(-1.5%,-1%,0) scale(1); background-position: 0 0,100% 0,50% 100%,0 0; } 100% { transform: translate3d(1.5%,1%,0) scale(1.035); background-position: 12% 8%,88% 12%,42% 88%,0 0; } }
@keyframes cf-circuit-drift { to { background-position: 720px 0,-540px 0; } }
@keyframes cf-data-pulse { 0% { box-shadow: 0 0 0 0 rgba(8,191,209,.3); } 55%,100% { box-shadow: 0 0 0 9px rgba(8,191,209,0); } }
/* Approach */
.cf-home-services::before { content: ''; position: absolute; z-index: 0; top: 54px; right: -170px; width: 430px; height: 430px; border: 1px solid rgba(7,89,230,.1); border-radius: 50%; box-shadow: 0 0 0 54px rgba(7,89,230,.025),0 0 0 108px rgba(8,191,209,.018); transform: translateY(var(--cf-scroll-shift-soft,0px)); animation: cf-section-orbit 24s linear infinite; pointer-events: none; }
.cf-home-services::after { content: ''; position: absolute; z-index: 0; left: 4.2%; top: 18%; width: 1px; height: 64%; opacity: .62; background: linear-gradient(transparent,rgba(8,191,209,.38) 20%,rgba(7,89,230,.2) 66%,transparent); box-shadow: 18px 34px 0 -0.25px rgba(7,89,230,.16),-12px 114px 0 -0.25px rgba(8,191,209,.2); animation: cf-signal-line 5.5s ease-in-out infinite; pointer-events: none; }
.cf-site .cf-section-head > div:first-child::after { content: ''; display: block; width: 72px; height: 1px; margin-top: 22px; background: linear-gradient(90deg,var(--cf-cyan),var(--cf-blue),transparent); transform-origin: left; animation: cf-line-breathe 4.2s ease-in-out infinite; }
.cf-service-highlight { display: grid; grid-template-columns: 1.15fr .85fr; border: 1px solid var(--cf-line); background: var(--cf-line); gap: 1px; }
.cf-service-highlight__primary { position: relative; isolation:isolate; min-height: 500px; display: flex; flex-direction: column; justify-content: space-between; padding: 46px; overflow: hidden; color: #fff; background:var(--cf-navy); }
.cf-service-highlight__primary::before { content:''; position:absolute; z-index:-1; inset:0; background:linear-gradient(180deg,rgba(7,22,47,0) 38%,rgba(7,22,47,.28) 57%,rgba(7,22,47,.96) 88%); }
.cf-service-highlight__primary::after { content: ''; position: absolute; right: -72px; bottom: -78px; width: 300px; height: 300px; border: 1px solid rgba(99,220,229,.25); border-radius: 50%; }
.cf-service-highlight__image { position:absolute; z-index:-2; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.8,.2,1); }
.cf-service-highlight__image--presence { object-position:center; }
.cf-service-highlight__primary:hover .cf-service-highlight__image { transform:scale(1.025); }
.cf-service-highlight__primary:hover { color: #fff; }
.cf-service-highlight__top { position:relative; z-index:1; display: flex; justify-content: space-between; gap: 20px; color:var(--cf-blue); font: 800 10px Manrope,sans-serif; letter-spacing: .13em; }
.cf-service-highlight__top > span { padding:9px 11px; background:rgba(255,255,255,.9); box-shadow:0 8px 24px rgba(7,44,96,.08); backdrop-filter:blur(12px); }
.cf-service-highlight__top b { padding: 7px 10px; color: #07162f; background: #69dde6; font-size: 9px; letter-spacing: .05em; }
.cf-service-highlight__copy { position:relative; z-index:1; padding-right:52px; }
.cf-service-highlight__primary h3 { max-width: 650px; margin: 0 0 20px; color: #fff; font-size: clamp(34px,4.2vw,54px); font-weight: 600; line-height: 1.3; letter-spacing: -.04em; }
.cf-service-highlight__primary p { max-width: 580px; margin: 0; color: #aebed3; font-size: 14px; line-height: 1.9; }
.cf-service-highlight__primary > i { position: absolute; right: 36px; bottom: 36px; z-index: 1; width: 46px; height: 46px; display: grid; place-items: center; color: #07162f; border-radius: 50%; background: #fff; font: normal 15px Manrope,sans-serif; }
.cf-service-highlight__list { display: grid; grid-template-rows: 1fr 1fr auto; background: #fff; }
.cf-service-highlight__list > a { display: grid; grid-template-columns: 32px 96px 1fr auto; align-items: center; gap: 18px; padding: 28px; color: var(--cf-ink); border-bottom: 1px solid var(--cf-line); }
.cf-service-highlight__thumb { width:96px; height:86px; object-fit:cover; background:var(--cf-navy); }
.cf-service-highlight__list > a:hover { color: var(--cf-blue); background: #f7f9fc; }
.cf-service-highlight__list > a > span { color: #8793a4; font: 700 10px Manrope,sans-serif; }
.cf-service-highlight__list p { margin: 0 0 8px; color: var(--cf-blue); font: 800 9px Manrope,sans-serif; letter-spacing: .13em; }
.cf-service-highlight__list h3 { margin: 0; font-size: 21px; font-weight: 600; }
.cf-service-highlight__list > a > b { font-size: 14px; }
.cf-service-highlight__list .cf-service-highlight__all { min-height: 72px; display: flex; justify-content: space-between; color: #fff; border: 0; background: var(--cf-blue); font-size: 13px; font-weight: 700; }
.cf-service-highlight__list .cf-service-highlight__all:hover { color: #fff; background: var(--cf-blue-deep); }
.cf-service-highlight__list .cf-service-highlight__all span { color: inherit; font: inherit; }
.cf-principles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--cf-line); border-bottom: 1px solid var(--cf-line); }
.cf-principles article { min-height: 330px; padding: 34px 34px 30px; border-right: 1px solid var(--cf-line); }
.cf-principles article:last-child { border: 0; }
.cf-principles article > span { color: #8491a3; font: 700 11px Manrope, sans-serif; }
.cf-principles article > p { margin: 64px 0 12px; color: var(--cf-blue); font: 800 10px Manrope, sans-serif; letter-spacing: .15em; }
.cf-principles h3 { margin: 0 0 24px; color: var(--cf-navy); font-size: 25px; font-weight: 600; line-height: 1.55; letter-spacing: -.025em; }
.cf-principles small { display: block; max-width: 275px; color: #6b7788; font-size: 13px; line-height: 1.8; }

/* Web feature */
.cf-web-panel { display: grid; grid-template-columns: 1.08fr .92fr; margin-top: 72px; color: #fff; background: var(--cf-navy); box-shadow: 0 34px 80px rgba(18, 45, 82, .15); }
.cf-web-panel__visual { min-height: 490px; display: grid; place-items: center; padding: 54px; overflow: hidden; background: var(--cf-gradient); }
.cf-browser { width: min(540px, 100%); transform: rotate(-1.5deg); background: #fff; border: 1px solid rgba(255, 255, 255, .6); border-radius: 8px; box-shadow: 0 28px 64px rgba(0, 31, 89, .28); overflow: hidden; }
.cf-browser__bar { display: flex; align-items: center; gap: 7px; padding: 12px 15px; background: #f0f4f8; }
.cf-browser__bar i { width: 7px; height: 7px; border-radius: 50%; background: #a9b5c3; }
.cf-browser__bar span { margin-left: auto; color: #8a96a6; font: 600 8px Manrope, sans-serif; letter-spacing: .08em; }
.cf-browser__canvas { min-height: 310px; padding: 42px; background: radial-gradient(circle at 90% 10%, rgba(18, 190, 209, .2), transparent 34%), #0a1831; }
.cf-browser__canvas small { color: #62dce5; font: 800 9px Manrope, sans-serif; letter-spacing: .18em; }
.cf-browser__canvas strong { display: block; margin-top: 18px; color: #fff; font: 600 clamp(34px, 3.7vw, 52px)/1.06 Manrope, sans-serif; letter-spacing: -.055em; }
.cf-browser__metric { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 46px; border-top: 1px solid rgba(255, 255, 255, .22); }
.cf-browser__metric span { padding: 15px 4px 0; color: #98a9be; font: 700 8px Manrope, sans-serif; letter-spacing: .1em; }
.cf-web-panel__content { display: flex; flex-direction: column; justify-content: space-between; padding: 60px; }
.cf-panel-label { margin: 0 0 24px; color: #65dce6; font: 800 10px Manrope, sans-serif; letter-spacing: .16em; }
.cf-chip-list { display: flex; flex-wrap: wrap; gap: 10px; list-style: none; }
.cf-chip-list li { padding: 10px 14px; color: #c9d6e6; border: 1px solid #34445d; border-radius: 2px; font-size: 12px; }
.cf-text-link { min-width: 230px; display: inline-flex; align-items: center; justify-content: space-between; gap: 30px; padding-bottom: 11px; color: var(--cf-blue); border-bottom: 1px solid currentColor; font-size: 14px; font-weight: 700; }
.cf-text-link:hover { color: var(--cf-blue-deep); }
.cf-text-link--light { color: #fff; }
.cf-text-link--light:hover { color: #69e3ea; }

/* Work */
.cf-site .cf-section--ink::before { content: ''; position: absolute; z-index: 0; inset: 0; opacity: .18; background-image: linear-gradient(rgba(88,213,226,.14) 1px,transparent 1px),linear-gradient(90deg,rgba(88,213,226,.14) 1px,transparent 1px),radial-gradient(circle at 82% 25%,rgba(36,115,255,.32),transparent 26%); background-size: 44px 44px,44px 44px,auto; mask-image: linear-gradient(105deg,transparent 4%,#000 48%,transparent 96%); animation: cf-dark-grid 18s linear infinite; pointer-events: none; }
.cf-site .cf-section--ink::after { content: ''; position: absolute; z-index: 1; top: 0; bottom: 0; left: -12%; width: 12%; opacity: 0; background: linear-gradient(90deg,transparent,rgba(97,222,232,.08),transparent); transform: skewX(-12deg); animation: cf-section-scan 7s 1.4s ease-in-out infinite; pointer-events: none; }
.cf-work-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.cf-work-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 36px; }
.cf-work-card__media { position: relative; aspect-ratio: 1.35; display: flex; align-items: flex-end; padding: 28px; overflow: hidden; color: #fff; background: linear-gradient(145deg, #12336d, #227cf0); }
.cf-work-card__media::before { content: ''; position: absolute; inset: 0; opacity: .35; background-image: linear-gradient(rgba(255,255,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.12) 1px,transparent 1px); background-size: 32px 32px; }
.cf-work-card__media::after { content: ''; position: absolute; z-index: 1; inset: -80% -35%; opacity: 0; background: linear-gradient(110deg,transparent 42%,rgba(255,255,255,.18) 50%,transparent 58%); transform: translateX(-38%); transition: opacity .25s ease,transform .8s cubic-bezier(.2,.8,.2,1); pointer-events: none; }
.cf-work-card:hover .cf-work-card__media::after { opacity: 1; transform: translateX(38%); }
.cf-work-card__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.cf-work-card:hover .cf-work-card__media img { transform: scale(1.035); }
.cf-work-card__media span { position: relative; z-index: 1; font: 700 27px/1.05 Manrope, sans-serif; letter-spacing: -.04em; }
.cf-work-card__media i { position: absolute; z-index: 2; top: 20px; right: 20px; width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255, 255, 255, .6); border-radius: 50%; color: #fff; font: normal 11px Manrope, sans-serif; }
.cf-work-card__media--violet { background: linear-gradient(145deg, #343a8d, #846be5); }
.cf-work-card__media--cyan { background: linear-gradient(145deg, #006c83, #12bdc7); }
.cf-work-card__label { margin: 20px 0 8px !important; color: #5edbe4; font: 800 9px Manrope, sans-serif; letter-spacing: .15em; }
.cf-work-card h3 { margin: 0 0 11px; font-size: 19px; font-weight: 600; line-height: 1.5; }
.cf-work-card h3 a { color: #fff; }
.cf-work-card > p:last-child { color: #9eacbf; font-size: 13px; line-height: 1.85; }

/* Capabilities */
.cf-capabilities { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--cf-line); background: var(--cf-line); }
.cf-capability { min-height: 210px; display: grid; grid-template-columns: 42px 1fr auto; gap: 18px; padding: 36px; color: var(--cf-ink); background: #fff; transition: background .25s ease, color .25s ease; }
.cf-capability--primary { grid-row: span 2; min-height: 421px; align-content: end; color: #fff; background: var(--cf-navy); }
.cf-capability--primary::before { content: ''; position: absolute; }
.cf-capability--more:hover { color: #fff; background: var(--cf-blue); }
.cf-capability:hover { color: var(--cf-ink); }
.cf-capability--primary:hover, .cf-capability--more:hover { color: #fff; }
.cf-capability__num { color: #8a96a5; font: 700 11px Manrope, sans-serif; }
.cf-capability p { margin: 0 0 9px; color: var(--cf-blue); font: 800 9px Manrope, sans-serif; letter-spacing: .14em; }
.cf-capability--primary p { color: #66dce5; }
.cf-capability h3 { margin: 0 0 11px; font-size: 22px; font-weight: 600; }
.cf-capability div > span { color: #6c788a; font-size: 13px; }
.cf-capability--primary div > span { color: #aebbd0; }
.cf-capability--more:hover p, .cf-capability--more:hover div > span, .cf-capability--more:hover .cf-capability__num { color: #dbeaff; }

/* Assurance */
.cf-site .cf-section--blue::before { content: ''; position: absolute; z-index: 0; inset: -20%; opacity: .52; background: radial-gradient(circle at 18% 72%,rgba(8,191,209,.18),transparent 20%),radial-gradient(circle at 78% 24%,rgba(104,124,245,.19),transparent 24%),repeating-radial-gradient(circle at 76% 24%,transparent 0 72px,rgba(255,255,255,.045) 73px 74px); transform: translateY(var(--cf-scroll-shift-field,0px)); animation: cf-blue-field 12s ease-in-out infinite alternate; pointer-events: none; }
.cf-site .cf-section--blue::after { content: ''; position: absolute; z-index: 0; right: 7%; bottom: 10%; width: 7px; height: 7px; border-radius: 50%; background: #6fe3ea; box-shadow: 0 0 20px rgba(111,227,234,.9),-118px -84px 0 -2px rgba(111,227,234,.65),80px -180px 0 -2px rgba(111,227,234,.42),-210px 54px 0 -2px rgba(111,227,234,.38); animation: cf-node-float 6s ease-in-out infinite; pointer-events: none; }
.cf-assurance-layout { display: grid; grid-template-columns: .72fr 1.28fr; gap: 110px; align-items: start; }
.cf-assurance-copy { position: sticky; top: 130px; }
.cf-assurance-copy > p:not(.cf-kicker) { max-width: 420px; margin: 30px 0; color: #b9c9df; font-size: 15px; line-height: 1.95; }
.cf-assurance-list { border-top: 1px solid rgba(255, 255, 255, .23); }
.cf-assurance-list article { position: relative; display: grid; grid-template-columns: 54px 1fr; gap: 26px; padding: 38px 4px; border-bottom: 1px solid rgba(255, 255, 255, .23); }
.cf-assurance-list article::after { content: ''; position: absolute; right: 0; bottom: -1px; left: 0; height: 1px; background: linear-gradient(90deg,#62dce6,var(--cf-violet),transparent); transform: scaleX(0); transform-origin: left; transition: transform .55s cubic-bezier(.22,1,.36,1); }
.cf-assurance-list article:hover::after { transform: scaleX(1); }
.cf-assurance-list article > span { color: #63dbe5; font: 700 11px Manrope, sans-serif; }
.cf-assurance-list h3 { margin: 0 0 14px; color: #fff; font-size: 24px; font-weight: 600; }
.cf-assurance-list p { max-width: 520px; margin: 0; color: #b4c4da; font-size: 14px; line-height: 1.9; }

/* Process and contact */
.cf-process { display: grid; grid-template-columns: repeat(5, 1fr); list-style: none; }
.cf-process li { min-height: 250px; padding: 28px 22px; border-top: 2px solid var(--cf-blue); border-right: 1px solid var(--cf-line); }
.cf-process li:last-child { border-right: 0; }
.cf-process span { color: #8390a1; font: 700 10px Manrope, sans-serif; }
.cf-process p { margin: 76px 0 12px; color: var(--cf-blue); font: 800 9px Manrope, sans-serif; letter-spacing: .14em; }
.cf-process h3 { font-size: 17px; font-weight: 600; line-height: 1.6; }
.cf-section--blue .cf-process li { border-color: rgba(255,255,255,.25); border-top-color: #60dfe8; }
.cf-section--blue .cf-process p, .cf-section--blue .cf-process span { color: #74e0e8; }
.cf-contact-band { position: relative; padding: 128px 0; overflow: hidden; color: #fff; text-align: center; background: var(--cf-navy); }
.cf-contact-band::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 78% 20%, rgba(0, 195, 210, .2), transparent 31%), linear-gradient(120deg, rgba(7,89,230,.14), transparent 60%); }
.cf-site .cf-contact-band::after { content: ''; position: absolute; z-index: 0; right: -120px; top: 50%; width: 420px; height: 420px; border: 1px solid rgba(105,227,234,.12); border-radius: 50%; box-shadow: inset 0 0 0 48px rgba(7,89,230,.025),0 0 0 76px rgba(105,227,234,.025); transform: translateY(-50%); animation: cf-contact-orbit 20s linear infinite; pointer-events: none; }
.cf-contact-band__mark { position: absolute; left: 6%; top: 50%; width: 300px; height: 340px; opacity: .08; transform: translateY(-50%); background-image: var(--cf-logo-image); background-repeat: no-repeat; background-size: contain; background-position: center; filter: brightness(0) invert(1); }
.cf-contact-band__inner { position: relative; z-index: 1; max-width: 900px; }
.cf-contact-band h2 { margin: 0; color: #fff; font-size: clamp(40px, 5.2vw, 66px); font-weight: 600; line-height: 1.25; letter-spacing: -.045em; }
.cf-contact-band p:not(.cf-kicker) { max-width: 690px; margin: 30px auto; color: #bdcadc; font-size: 15px; line-height: 1.95; }
.cf-contact-band .cf-button { margin-top: 10px; }
.cf-contact-band small { display: block; margin-top: 18px; color: #8193aa; font-size: 11px; letter-spacing: .08em; }

/* Scroll-led motion */
html.cf-motion-ready .cf-scroll-reveal { opacity: 0; transform: translateY(34px); transition: opacity .78s ease var(--cf-reveal-delay,0ms),transform .88s cubic-bezier(.16,1,.3,1) var(--cf-reveal-delay,0ms); }
html.cf-motion-ready .cf-scroll-reveal.is-visible { opacity: 1; transform: translateY(0); }
@keyframes cf-section-orbit { to { rotate: 360deg; } }
@keyframes cf-signal-line { 0%,100% { opacity: .3; transform: translateY(-16px); } 50% { opacity: .82; transform: translateY(16px); } }
@keyframes cf-line-breathe { 0%,100% { transform: scaleX(.55); opacity: .5; } 50% { transform: scaleX(1); opacity: 1; } }
@keyframes cf-dark-grid { to { background-position: 44px 44px,-44px -44px,0 0; } }
@keyframes cf-section-scan { 0%,12% { left: -12%; opacity: 0; } 20%,72% { opacity: 1; } 88%,100% { left: 112%; opacity: 0; } }
@keyframes cf-blue-field { to { transform: translate3d(1.5%,var(--cf-scroll-shift-field,0px),0) scale(1.04); } }
@keyframes cf-node-float { 0%,100% { transform: translate3d(0,-8px,0); opacity: .6; } 50% { transform: translate3d(-14px,12px,0); opacity: 1; } }
@keyframes cf-contact-orbit { to { transform: translateY(-50%) rotate(360deg); } }

/* Services and Web detail pages */
.cf-service-page { padding-top: 80px; }
.cf-page-hero { padding: 128px 0 96px; background: radial-gradient(circle at 84% 18%,rgba(100,124,245,.09),transparent 28%),linear-gradient(140deg,#eef9ff,#f8f9ff 48%,#fff 78%); }
.cf-page-hero--web { min-height: 680px; display: flex; align-items: center; color: #fff; background: var(--cf-navy); }
.cf-page-hero h1 { max-width: 1080px; margin: 0; color: var(--cf-navy); font-size: clamp(48px, 5.8vw, 78px); font-weight: 600; line-height: 1.15; letter-spacing: -.05em; }
.cf-page-hero--web h1 { max-width: 1120px; color: #fff; }
.cf-page-hero__lead { max-width: 700px; margin: 30px 0 0; color: #5d6b7e; font-size: 16px; line-height: 1.95; }
.cf-page-hero--web .cf-page-hero__lead { color: #c2cee0; }
.cf-service-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; }
.cf-service-card { min-height: 250px; display: flex; flex-direction: column; padding: 36px; color: var(--cf-ink); border: 1px solid var(--cf-line); background: #fff; transition: transform .25s ease, box-shadow .25s ease; }
.cf-service-card--web { grid-column: 1/-1; min-height: 400px; color: #fff; background: var(--cf-navy); }
.cf-service-card:hover { color: var(--cf-ink); transform: translateY(-3px); box-shadow: 0 18px 45px rgba(15, 47, 89, .09); }
.cf-service-card--web:hover { color: #fff; }
.cf-service-card__top { display: flex; justify-content: space-between; color: var(--cf-blue); font: 800 10px Manrope, sans-serif; letter-spacing: .13em; }
.cf-service-card--web .cf-service-card__top { color: #67dce6; }
.cf-service-card h2 { margin: auto 0 16px; font-size: clamp(28px, 3.7vw, 48px); }
.cf-service-card p { max-width: 650px; margin: 0; color: #687689; line-height: 1.9; }
.cf-service-card--web p { color: #b9c7da; }
.cf-service-domains { display:grid; gap:18px; }
.cf-service-domain { display:grid; grid-template-columns:minmax(280px,.85fr) minmax(0,1.15fr); min-height:430px; overflow:hidden; border:1px solid var(--cf-line); background:#fff; scroll-margin-top:110px; }
.cf-service-domain:nth-child(even) { grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr); }
.cf-service-domain:nth-child(even) .cf-service-domain__visual { order:2; }
.cf-service-domain__visual { position:relative; min-height:360px; overflow:hidden; background:#eef8ff; }
.cf-service-domain__visual::after { content:''; position:absolute; inset:0; background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(7,89,230,.06)); pointer-events:none; }
.cf-service-domain__visual img { width:100%; height:100%; object-fit:cover; transition:transform .8s cubic-bezier(.2,.8,.2,1); }
.cf-service-domain:hover .cf-service-domain__visual img { transform:scale(1.025); }
.cf-service-domain__visual span { position:absolute; z-index:1; top:28px; left:28px; width:42px; height:42px; display:grid; place-items:center; color:var(--cf-blue); border:1px solid rgba(7,89,230,.24); border-radius:50%; background:rgba(255,255,255,.9); box-shadow:0 8px 24px rgba(7,44,96,.08); font:700 10px Manrope,sans-serif; }
.cf-service-domain__content { display:flex; flex-direction:column; justify-content:center; padding:clamp(38px,5vw,72px); }
.cf-service-domain__label { margin:0 0 24px; color:var(--cf-blue); font:800 10px Manrope,sans-serif; letter-spacing:.13em; }
.cf-service-domain__content h2 { margin:0 0 22px; color:var(--cf-navy); font-size:clamp(32px,3.8vw,48px); line-height:1.35; letter-spacing:-.04em; }
.cf-service-domain__content > p:not(.cf-service-domain__label) { max-width:620px; margin:0; color:#637187; font-size:14px; line-height:1.9; }
.cf-service-domain__content ul { display:flex; flex-wrap:wrap; gap:8px; margin:28px 0 0; padding:0; list-style:none; }
.cf-service-domain__content li { padding:8px 11px; color:#385674; border:1px solid #d5e0eb; background:#f7fbff; font-size:11px; }
.cf-service-domain__content > a { width:min(300px,100%); display:flex; justify-content:space-between; margin-top:34px; padding-bottom:10px; color:var(--cf-blue); border-bottom:1px solid currentColor; font-size:13px; font-weight:700; }
.cf-feature-grid { display: grid; grid-template-columns: repeat(5, 1fr); border: 1px solid var(--cf-line); }
.cf-feature-grid > div { min-height: 290px; padding: 28px 22px; border-right: 1px solid var(--cf-line); }
.cf-feature-grid > div:last-child { border: 0; }
.cf-feature-grid span, .cf-site-types span { color: var(--cf-blue); font: 800 9px Manrope, sans-serif; }
.cf-feature-grid h3 { margin: 88px 0 14px; font-size: 19px; }
.cf-feature-grid p { color: #657386; font-size: 13px; line-height: 1.8; }
.cf-site-types { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.cf-site-types div { min-height: 128px; padding: 23px; border: 1px solid var(--cf-line); }
.cf-site-types h3 { margin-top: 27px; font-size: 17px; }
.cf-about-band { background: linear-gradient(125deg,rgba(8,191,209,.075),#f4f9ff 45%,rgba(100,124,245,.075)); }
.cf-about-band__inner { display: grid; grid-template-columns: 1.15fr .85fr; gap: 96px; align-items: end; }
.cf-about-band__inner > div:last-child { color: #536277; font-size: 16px; line-height: 1.95; }
.cf-price-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.cf-price { padding: 36px; border: 1px solid var(--cf-line); background: #fff; }
.cf-price--featured { color: #fff; background: var(--cf-navy); }
.cf-price__name { color: var(--cf-blue); font: 800 9px Manrope, sans-serif; letter-spacing: .14em; }
.cf-price--featured .cf-price__name { color: #6bdde6; }
.cf-price h3 { margin: 28px 0 8px; font-size: 24px; }
.cf-price strong { display: block; margin-bottom: 22px; font-size: 34px; }
.cf-price p { color: #687689; line-height: 1.85; }
.cf-price--featured p { color: #b9c7da; }
.cf-faq { border-top: 1px solid var(--cf-line); }
.cf-faq details { padding: 25px 5px; border-bottom: 1px solid var(--cf-line); }
.cf-faq summary { cursor: pointer; font-weight: 600; font-size: 17px; }
.cf-faq details p { padding: 16px 0 0 28px; color: #627084; line-height: 1.9; }

@media (max-width: 1024px) {
    .cf-shell { width: min(100% - 48px, 1200px); }
    .cf-section { padding: 96px 0; }
    .cf-hero__inner { min-height: 620px; grid-template-columns: 1.12fr .88fr; gap: 20px; }
    .cf-hero__visual { --logo-scale: .51; }
    .cf-hero__orbit--outer { width: 400px; height: 400px; }
    .cf-hero__orbit--inner { width: 315px; height: 315px; }
    .cf-section-head--split, .cf-about-band__inner { grid-template-columns: 1fr; gap: 34px; }
    .cf-web-panel { grid-template-columns: 1fr; }
    .cf-service-highlight { grid-template-columns: 1fr; }
    .cf-service-highlight__primary { min-height: 430px; }
    .cf-work-grid { grid-template-columns: 1fr 1fr; }
    .cf-capabilities { grid-template-columns: 1fr; }
    .cf-capability--primary { grid-row: auto; min-height: 300px; }
    .cf-assurance-layout { grid-template-columns: 1fr; gap: 52px; }
    .cf-assurance-copy { position: static; }
    .cf-process, .cf-feature-grid { grid-template-columns: repeat(2, 1fr); }
    .cf-site-types { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 900px) {
    .cf-shell { width: min(100% - 32px, 1200px); }
    .cf-section { padding: 76px 0; }
    .cf-section h2, .cf-assurance-copy h2 { font-size: clamp(34px, 10vw, 48px); line-height: 1.3; }
    .cf-section-head { margin-bottom: 44px; }
    .cf-home-services::before { right: -210px; width: 340px; height: 340px; }
    .cf-home-services::after { display: none; }
    .cf-site .cf-contact-band::after { right: -230px; width: 340px; height: 340px; }
    .cf-loader__grid { background-size: 40px 40px,40px 40px,auto; }
    .cf-loader__content { width: calc(100% - 32px); min-height: 140px; }
    .cf-loader__blueprint { left: calc(50% - 112px); width: 72px; height: 75px; }
    .cf-loader__axis--x { left: -14px; width: 100px; }
    .cf-loader__axis--y { top: -11px; height: 97px; }
    .cf-loader__logo-lockup { gap: 14px; }
    .cf-loader__logo-mark { width: 58px; height: 66px; }
    .cf-loader__logo-word { font-size:38px; }
    .cf-loader__status { right: 20px; bottom: 20px; left: 20px; }
    .cf-loader__status::before,.cf-loader__status::after { left: 0; right: 0; bottom: 24px; width: 100%; }
    .cf-hero { padding-top: 112px; }
    .cf-hero__mesh { left: 20%; height: 560px; }
    .cf-hero__inner { min-height: auto; display: flex; flex-direction: column; align-items: stretch; gap: 12px; }
    .cf-hero__copy { padding-bottom: 0; }
    .cf-eyebrow { margin-bottom: 22px; font-size: 9px; }
    .cf-hero__title { font-size: clamp(40px, 12vw, 58px); line-height: 1.22; }
    .cf-mobile-only { display: block; }
    .cf-hero__lead { margin-top: 24px; font-size: 14px; line-height: 1.9; }
    .cf-actions { margin-top: 28px; }
    .cf-button { width: 100%; }
    .cf-hero__visual { min-height: 390px; margin-top: 14px; }
    .cf-hero__visual { --logo-scale: .43; }
    .cf-hero__orbit--outer { width: 330px; height: 330px; }
    .cf-hero__orbit--inner { width: 260px; height: 260px; }
    .cf-hero__tag--one { top: 52px; left: 0; }
    .cf-hero__tag--two { right: 0; }
    .cf-hero__tag--three { bottom: 42px; left: 26px; }
    .cf-principles { grid-template-columns: 1fr; }
    .cf-service-highlight__primary { min-height: 420px; padding: 30px 24px; }
    .cf-service-highlight__primary h3 { font-size: 34px; }
    .cf-service-highlight__primary > i { right: 24px; bottom: 24px; }
    .cf-service-highlight__list > a { padding: 22px; grid-template-columns: 26px 76px 1fr auto; gap: 12px; }
    .cf-service-highlight__thumb { width:76px; height:72px; }
    .cf-principles article { min-height: 260px; padding: 28px 4px; border-right: 0; border-bottom: 1px solid var(--cf-line); }
    .cf-principles article:last-child { border-bottom: 0; }
    .cf-principles article > p { margin-top: 42px; }
    .cf-web-panel { margin-top: 46px; }
    .cf-web-panel__visual { min-height: 330px; padding: 24px 16px; }
    .cf-browser__canvas { min-height: 235px; padding: 28px 24px; }
    .cf-browser__metric { margin-top: 32px; }
    .cf-web-panel__content { padding: 34px 24px; gap: 44px; }
    .cf-section-head--row { align-items: flex-start; flex-direction: column; }
    .cf-work-grid, .cf-service-list, .cf-price-grid { grid-template-columns: 1fr; }
    .cf-capability { min-height: 190px; padding: 28px 22px; grid-template-columns: 32px 1fr auto; }
    .cf-capability--primary { min-height: 280px; }
    .cf-assurance-list article { grid-template-columns: 38px 1fr; gap: 14px; padding: 30px 0; }
    .cf-process, .cf-feature-grid, .cf-site-types { grid-template-columns: 1fr; }
    .cf-process li, .cf-feature-grid > div { min-height: 190px; border-right: 0; border-bottom: 1px solid var(--cf-line); }
    .cf-process p, .cf-feature-grid h3 { margin-top: 44px; }
    .cf-contact-band { padding: 80px 0; text-align: left; }
    .cf-contact-band p:not(.cf-kicker) { margin-left: 0; }
    .cf-contact-band small { text-align: center; }
    .cf-page-hero { padding: 90px 0 72px; }
    .cf-page-hero--web { min-height: 600px; }
    .cf-service-card--web { grid-column: auto; min-height: 330px; }
    .cf-service-domain,.cf-service-domain:nth-child(even) { grid-template-columns:1fr; }
    .cf-service-domain:nth-child(even) .cf-service-domain__visual { order:0; }
    .cf-service-domain__visual { min-height:290px; }
    .cf-service-domain__content { padding:34px 24px 42px; }
}

@media (pointer:coarse) {
    .cf-hero::before,.cf-hero::after,.cf-hero__mesh,.cf-home-services::before,.cf-site .cf-section--ink::before,.cf-site .cf-section--ink::after,.cf-site .cf-section--blue::before,.cf-site .cf-section--blue::after,.cf-site .cf-contact-band::after { animation:none; }
    .cf-logo-cube { animation-duration:24s; }
    .cf-logo-cube__face::after,.cf-logo-stage::before { display:none; }
    .cf-hero__orbit--outer,.cf-hero__orbit--inner { animation-duration:0s,40s; }
}

html.cf-lite-motion .cf-hero::before,html.cf-lite-motion .cf-hero::after,html.cf-lite-motion .cf-hero__mesh,html.cf-lite-motion .cf-home-services::before,html.cf-lite-motion .cf-home-services::after,html.cf-lite-motion .cf-site .cf-section--ink::before,html.cf-lite-motion .cf-site .cf-section--ink::after,html.cf-lite-motion .cf-site .cf-section--blue::before,html.cf-lite-motion .cf-site .cf-section--blue::after,html.cf-lite-motion .cf-site .cf-contact-band::after { animation:none; }
html.cf-lite-motion .cf-logo-cube { animation-duration:28s; }
html.cf-lite-motion .cf-logo-cube__face::after,html.cf-lite-motion .cf-logo-stage::before { display:none; }
html.cf-page-hidden .cf-logo-cube { animation-play-state:paused; }

@media (prefers-reduced-motion: reduce) {
    .cf-hero__mesh,.cf-eyebrow,.cf-hero__title,.cf-hero__lead,.cf-actions,.cf-hero__note,.cf-logo-cube,.cf-logo-cube__face::after,.cf-logo-stage::before,.cf-logo-stage::after,.cf-hero__orbit { animation:none; opacity:1; clip-path:none; filter:none; }
    .cf-button, .cf-work-card__media img { transition: none; }
    .cf-logo-stage { transform: scale(var(--logo-scale,1)); transition: none; }
    .cf-logo-cube { transform:rotateX(-28deg) rotateY(35deg); }
    .cf-hero::before,.cf-hero::after,.cf-site .cf-kicker::before,.cf-home-services::before,.cf-home-services::after,.cf-site .cf-section-head > div:first-child::after,.cf-site .cf-section--ink::before,.cf-site .cf-section--ink::after,.cf-site .cf-section--blue::before,.cf-site .cf-section--blue::after,.cf-site .cf-contact-band::after { animation: none; }
    html.cf-motion-ready .cf-scroll-reveal { opacity: 1; filter: none; transform: none; transition: none; }
    .cf-loader { transition: none; }
    .cf-loader__grid,.cf-loader__scan,.cf-loader__blueprint,.cf-loader__cube-lines,.cf-loader__cube-nodes,.cf-loader__axis,.cf-loader__logo-lockup,.cf-loader__status::after { animation: none; }
    .cf-loader__logo-lockup { opacity: 1; clip-path: none; filter: none; transform: none; }
}
