:root {
	--color-background: #f1f0ec;
	--color-background-dark: #0c0d0d;
	--color-text: #111313;
	--color-text-light: #f1f0ec;
	--color-accent: #f07a49;
	--color-cobalt: #d85a36;
	--color-border: rgba(17, 19, 19, .18);
	--color-border-light: rgba(241, 240, 236, .24);
	--font-primary: 'Manrope', Arial, sans-serif;
	--font-display: 'Space Grotesk', Arial, sans-serif;
	--container-width: 1360px;
	--spacing: clamp(1.25rem, 3vw, 3rem);
	--ease: cubic-bezier(.22, .61, .36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--color-background); color: var(--color-text); font-family: var(--font-primary); font-size: 17px; line-height: 1.58; }
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { max-width: 100%; height: auto; }
.container { width: min(calc(100% - 2 * var(--spacing)), var(--container-width)); margin-inline: auto; }
.narrow-content { max-width: 900px; }
.sr-only, .skip-link:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link:focus { position: fixed; z-index: 100; top: 1rem; left: 1rem; background: var(--color-accent); color: var(--color-text); padding: .75rem 1rem; }
:focus-visible { outline: 2px solid var(--color-cobalt); outline-offset: 4px; }
.section-light { background: var(--color-background); color: var(--color-text); }
.section-dark, .section-ink { background: var(--color-background-dark); color: var(--color-text-light); }
.section-cobalt { background: var(--color-cobalt); color: var(--color-text-light); }
.section-space { padding-block: clamp(6rem, 13vw, 12rem); }
.eyebrow { margin: 0; color: currentColor; font-size: .74rem; font-weight: 700; letter-spacing: .14em; line-height: 1.4; text-transform: uppercase; }
.eyebrow span { opacity: .45; }
.section-dark .eyebrow, .section-ink .eyebrow, .section-cobalt .eyebrow { color: var(--color-accent); }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.055em; }
h1 em, h2 em, h3 em { color: var(--color-cobalt); font-style: normal; }
.section-dark h1 em, .section-ink h1 em, .section-dark h2 em, .section-ink h2 em, .section-cobalt h1 em, .section-cobalt h2 em { color: var(--color-accent); }

/* Header */
.site-header { position: fixed; z-index: 20; top: 0; right: 0; left: 0; color: var(--color-text-light); transition: background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease); }
body:not(.is-home) .site-header { background: var(--color-background-dark); border-bottom: 1px solid var(--color-border-light); }
.site-header.is-scrolled { background: rgba(12, 13, 13, .92); border-bottom: 1px solid var(--color-border-light); backdrop-filter: blur(14px); }
.site-header__inner { display: flex; min-height: 76px; align-items: center; justify-content: space-between; gap: 2rem; }
.brand { display: inline-flex; align-items: center; gap: .78rem; font-family: var(--font-display); font-size: 1.14rem; font-weight: 600; letter-spacing: -.045em; }
.brand__mark { position: relative; display: inline-grid; width: 2rem; height: 2rem; place-items: center; border: 1px solid rgba(241,240,236,.9); border-radius: 50%; color: var(--color-text-light); font-size: .82rem; font-weight: 700; letter-spacing: -.08em; transition: border-color .3s var(--ease), color .3s var(--ease), transform .3s var(--ease); }
.brand__mark::before { position: absolute; top: .25rem; right: .25rem; width: .3rem; height: .3rem; border-radius: 50%; background: var(--color-accent); content: ''; }
.brand__mark::after { position: absolute; inset: .28rem; border: 1px solid rgba(241,240,236,.28); border-radius: 50%; content: ''; }
.brand__wordmark { display: inline-block; color: var(--color-text-light); font-family: var(--font-primary); font-size: 1.26em; font-weight: 800; letter-spacing: -.105em; line-height: 1; transform: scaleX(.96); transform-origin: left center; }
.brand--footer { font-size: 1.45rem; }
.brand--footer .brand__wordmark { font-size: 1.3em; }
.brand--footer .brand__mark { width: 2.2rem; height: 2.2rem; }
.brand:hover .brand__mark { border-color: var(--color-accent); color: var(--color-accent); transform: rotate(12deg); }
.primary-nav { display: flex; align-items: center; gap: clamp(1rem, 2.5vw, 2.5rem); margin-left: auto; font-size: .82rem; font-weight: 600; }
.primary-nav a, .footer-nav a, .footer-social a { opacity: .72; transition: opacity .25s var(--ease); }
.primary-nav a:hover, .footer-nav a:hover, .footer-social a:hover { opacity: 1; }
.header-cta { display: inline-flex; align-items: center; gap: .8rem; padding: .7rem 1rem; border: 1px solid var(--color-border-light); border-radius: 2px; font-size: .78rem; font-weight: 700; transition: background .25s var(--ease), color .25s var(--ease); }
.header-cta:hover { background: var(--color-accent); color: var(--color-text); }
.menu-toggle { display: none; width: 40px; height: 40px; border: 0; background: transparent; color: currentColor; }
.menu-toggle span:not(.sr-only) { display: block; width: 20px; height: 1px; margin: 5px auto; background: currentColor; transition: transform .25s var(--ease); }

/* Hero */
.hero { min-height: 100svh; overflow: hidden; padding-top: 76px; }
.hero__grid { display: grid; min-height: calc(100svh - 126px); align-items: center; grid-template-columns: minmax(0, 1fr) minmax(300px, .8fr); gap: 4vw; }
.hero__copy { position: relative; z-index: 2; padding-block: 5rem; }
.hero h1 { max-width: 1000px; margin: 1.4rem 0 2rem; font-size: clamp(3.15rem, 5.4vw, 5.8rem); line-height: .92; }
.hero-line { display: block; }
.hero-line--quiet { color: rgba(241,240,236,.66); font-size: .7em; letter-spacing: -.07em; }
.hero-line--offset { padding-left: clamp(1.5rem, 8vw, 9rem); }
.hero-line--accent { padding-left: clamp(3rem, 16vw, 17rem); }
.accent-dot { color: var(--color-accent); }
.hero__intro { max-width: 390px; margin-bottom: 2rem; color: rgba(241,240,236,.72); font-size: 1.08rem; line-height: 1.5; }
.hero__actions, .final-cta__bottom { display: flex; align-items: center; gap: 1.6rem; flex-wrap: wrap; }
.button { display: inline-flex; align-items: center; justify-content: space-between; gap: 2.5rem; min-height: 50px; padding: .8rem 1.1rem; border: 1px solid currentColor; border-radius: 2px; font-size: .72rem; font-weight: 800; letter-spacing: .02em; transition: background .25s var(--ease), color .25s var(--ease), transform .25s var(--ease); }
.button:hover { transform: translateY(-3px); }
.button--light { background: var(--color-text-light); border-color: var(--color-text-light); color: var(--color-text); }
.button--light:hover { background: var(--color-accent); border-color: var(--color-accent); }
.text-link { display: inline-flex; align-items: center; gap: .6rem; font-size: .75rem; font-weight: 700; }
.text-link span { color: var(--color-accent); transition: transform .25s var(--ease); }
.text-link:hover span { transform: translateY(3px); }
.hero__visual { position: relative; min-height: min(65vw, 700px); }
.hero__visual::before { position: absolute; inset: 14% 7% 12% 8%; border: 1px solid rgba(241,240,236,.18); content: ''; transform: rotate(-13deg); }
.orbit { position: absolute; top: 50%; left: 50%; border: 1px solid rgba(184,245,95,.45); border-radius: 50%; transform: translate(-50%, -50%) rotate(-28deg); }
.orbit::before { position: absolute; top: -5px; left: 50%; width: 9px; height: 9px; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 20px rgba(184,245,95,.8); content: ''; }
.orbit--one { width: 86%; height: 42%; }
.orbit--two { width: 72%; height: 72%; transform: translate(-50%, -50%) rotate(53deg); border-color: rgba(241,240,236,.28); }
.orbit--three { width: 45%; height: 92%; transform: translate(-50%, -50%) rotate(70deg); border-color: rgba(241,240,236,.18); }
.hero-core { position: absolute; top: 50%; left: 50%; display: grid; width: clamp(9rem, 18vw, 15rem); height: clamp(9rem, 18vw, 15rem); place-items: center; border: 1px solid rgba(241,240,236,.42); border-radius: 50%; transform: translate(-50%, -50%) rotate(-13deg); }
.hero-core__ring { position: absolute; display: block; border: 1px solid var(--color-accent); border-radius: 50%; }
.hero-core__ring--outer { inset: -1.6rem; opacity: .62; }
.hero-core__ring--inner { inset: 1.2rem; border-color: rgba(241,240,236,.25); }
.hero-core__letter { position: relative; z-index: 1; color: var(--color-text-light); font-family: var(--font-display); font-size: clamp(4rem, 8vw, 7rem); font-weight: 500; letter-spacing: -.12em; line-height: .8; }
.hero-cross { position: absolute; color: var(--color-accent); font-size: 1.5rem; }
.hero-cross--a { top: 15%; right: 13%; }.hero-cross--b { bottom: 18%; left: 8%; }
.hero-visual__code { position: absolute; right: 4%; bottom: 14%; color: rgba(241,240,236,.5); font-family: monospace; font-size: .66rem; line-height: 1.5; letter-spacing: .08em; }
.hero__footer { display: flex; align-items: center; gap: 1rem; padding-bottom: 1.6rem; color: rgba(241,240,236,.5); font-size: .6rem; letter-spacing: .12em; text-transform: uppercase; }
.hero__line { width: 90px; height: 1px; background: rgba(241,240,236,.35); }

/* Shared sections */
.manifesto__grid, .capabilities__grid { display: grid; grid-template-columns: 1fr 2fr; gap: 4vw; }
.manifesto__content h2, .section-heading h2 { margin: 0 0 2rem; font-size: clamp(2.75rem, 4.5vw, 4.8rem); line-height: .98; }
.manifesto__content h2 span { color: var(--color-cobalt); }
.manifesto__content > p { max-width: 540px; margin: 0 0 2rem; color: rgba(17,19,19,.67); font-size: 1.12rem; line-height: 1.58; }
.arrow-link { display: inline-flex; align-items: center; gap: 2rem; padding-bottom: .4rem; border-bottom: 1px solid var(--color-text); font-size: .72rem; font-weight: 800; }
.arrow-link__arrow { color: var(--color-cobalt); font-size: 1.2rem; transition: transform .25s var(--ease); }
.arrow-link:hover .arrow-link__arrow { transform: translate(4px, -4px); }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: clamp(3rem, 7vw, 6rem); }
.section-heading__note { margin: 0 0 .4rem; color: rgba(17,19,19,.58); font-size: .9rem; line-height: 1.5; text-align: right; }
.section-heading--light .section-heading__note { color: rgba(241,240,236,.52); }
.section-end { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 3rem; }
.section-end__label { color: rgba(17,19,19,.45); font-family: monospace; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }

/* Projects */
.projects-list { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(2.5rem, 6vw, 7rem) 2rem; counter-reset: project; }
.project-card { position: relative; grid-column: span 7; counter-increment: project; }
.project-card::before { position: absolute; z-index: 3; top: 1rem; left: 1rem; color: rgba(17,19,19,.62); content: counter(project, decimal-leading-zero); font-family: monospace; font-size: .65rem; letter-spacing: .12em; }
.project-card:nth-child(even) { grid-column: 7 / span 6; margin-top: 8rem; }
.project-card__link { display: block; }
.project-art { position: relative; min-height: clamp(300px, 44vw, 620px); overflow: hidden; background: #d9d7cf; transition: transform .55s var(--ease); }
.project-card__link:hover .project-art { transform: scale(.985); }
.project-art::after { position: absolute; inset: 0; background: linear-gradient(135deg, transparent 50%, rgba(255,255,255,.15)); content: ''; }
.project-card__link:hover .project-art::after { opacity: .65; }
.project-card__link:hover .project-art__word { transform: translateX(.04em); }
.project-art__label { position: absolute; z-index: 2; top: 1rem; right: 1rem; padding: .35rem .5rem; border: 1px solid currentColor; border-radius: 2px; font-family: monospace; font-size: .58rem; letter-spacing: .1em; }
.project-art__word { position: absolute; z-index: 2; right: 8%; bottom: 7%; left: 8%; color: var(--color-text); font-family: var(--font-display); font-size: clamp(2.5rem, 6vw, 6.4rem); font-weight: 500; letter-spacing: -.09em; line-height: .84; }
.product-screen { position: absolute; z-index: 1; inset: 0; overflow: hidden; }
.product-screen ~ .project-art__word { display: none; }
.product-screen__top, .store-nav, .north-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; font-size: .65rem; letter-spacing: .03em; }
.ui-brand { font-family: var(--font-display); font-size: 1rem; font-weight: 700; letter-spacing: -.07em; }
.ui-status, .ui-menu, .north-nav span:last-child { opacity: .55; }
.product-screen--nova { background: #e6e5df; color: #151719; }.product-screen__body { display: flex; height: calc(100% - 58px); padding: 1.4rem 1.2rem 1.2rem; gap: 1.5rem; }.ui-sidebar { display: flex; width: 23%; flex-direction: column; gap: .9rem; padding-top: .4rem; color: rgba(21,23,25,.46); font-size: .65rem; }.ui-sidebar__active { color: #151719; font-weight: 700; }.ui-dashboard { flex: 1; padding: 1rem 1.2rem; border: 1px solid rgba(21,23,25,.15); background: rgba(255,255,255,.35); }.ui-overline, .ui-stat-grid span { margin: 0; color: rgba(21,23,25,.5); font-family: monospace; font-size: .6rem; letter-spacing: .05em; text-transform: uppercase; }.ui-dashboard h4 { margin: 1.8rem 0 1.5rem; font-family: var(--font-display); font-size: clamp(1.7rem, 3.2vw, 3.8rem); font-weight: 500; letter-spacing: -.07em; line-height: .92; }.ui-dashboard h4 strong { color: #2947e8; font-weight: 500; }.ui-stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }.ui-stat-grid div { display: flex; flex-direction: column; gap: .3rem; padding: .65rem; border-top: 1px solid rgba(21,23,25,.16); }.ui-stat-grid strong { font-family: var(--font-display); font-size: 1.5rem; font-weight: 500; }.ui-chart { position: relative; height: 24%; margin-top: 1.3rem; border-bottom: 1px solid rgba(21,23,25,.18); background: repeating-linear-gradient(0deg, transparent 0 24px, rgba(21,23,25,.08) 25px); }.ui-chart__line { position: absolute; bottom: 12%; left: 4%; width: 92%; height: 60%; border-top: 2px solid #2947e8; border-radius: 50%; transform: rotate(-8deg); }.ui-chart__line--two { bottom: 27%; border-color: #b8f55f; transform: rotate(11deg); }.ui-chart__line--three { bottom: 42%; border-color: rgba(21,23,25,.38); transform: rotate(-3deg); }
.product-screen--alma { background: #e1cdbb; color: #251d19; }.store-nav { border-bottom: 1px solid rgba(37,29,25,.22); }.store-content { display: grid; height: calc(100% - 58px); grid-template-columns: 1.1fr .9fr; align-items: center; gap: 1rem; padding: 2rem 1.5rem; }.store-hero > span { display: block; font-family: var(--font-display); font-size: clamp(2.4rem, 5vw, 5.6rem); letter-spacing: -.09em; line-height: .82; }.store-hero em { color: #f46d4f; font-style: normal; }.store-hero small, .store-product small { display: block; max-width: 160px; margin-top: 1.4rem; color: rgba(37,29,25,.62); font-size: .7rem; line-height: 1.4; }.store-product { display: flex; flex-direction: column; align-items: flex-start; }.store-product__shape { display: block; width: min(22vw, 230px); height: min(28vw, 280px); margin-inline: auto; border-radius: 48% 52% 35% 65%; background: #f46d4f; transform: rotate(18deg); }.store-product strong { margin-top: 1rem; font-family: var(--font-display); font-size: 1.1rem; font-weight: 500; }
.product-screen--move { background: #ccd7cf; color: #151719; }.phone { position: absolute; display: flex; flex-direction: column; border: 1px solid rgba(21,23,25,.4); border-radius: 1.4rem; background: #f2efe8; box-shadow: 1rem 1rem 0 rgba(41,71,232,.18); }.phone--main { top: 9%; left: 18%; width: 43%; height: 82%; padding: .9rem; }.phone--small { right: 9%; bottom: 9%; width: 28%; height: 52%; align-items: center; justify-content: center; background: #2947e8; color: #f2efe8; transform: rotate(8deg); }.phone__bar, .phone__eyebrow { display: flex; justify-content: space-between; font-family: monospace; font-size: .55rem; }.phone__eyebrow { display: block; margin: 1.4rem 0 .7rem; color: rgba(21,23,25,.55); }.phone h4 { margin: 0; font-family: var(--font-display); font-size: clamp(1.4rem, 2.6vw, 2.7rem); font-weight: 500; letter-spacing: -.08em; line-height: .9; }.phone h4 em { color: #2947e8; font-style: normal; }.phone__progress { margin-top: auto; padding-top: .8rem; border-top: 1px solid rgba(21,23,25,.18); font-size: .55rem; }.phone__progress strong { float: right; font-family: var(--font-display); font-size: 1.1rem; font-weight: 500; }.phone__progress div { height: 4px; margin-top: .7rem; background: #d5d0c5; }.phone__progress i { display: block; width: 68%; height: 100%; background: #b8f55f; }.phone__card { display: flex; flex-direction: column; gap: .3rem; margin-top: .8rem; padding: .7rem; background: #b8f55f; font-size: .55rem; }.phone__card strong { font-family: var(--font-display); font-size: .8rem; font-weight: 600; }.phone__card b { margin-top: .4rem; font-size: .6rem; }.phone__orb { width: 3rem; height: 3rem; margin-bottom: 1rem; border: 1px solid #b8f55f; border-radius: 50%; box-shadow: inset 0 0 0 9px #2947e8; }.phone--small span { font-family: var(--font-display); font-size: .75rem; }
.product-screen--north { background: #17211f; color: #f1f0ec; }.north-nav { border-bottom: 1px solid rgba(241,240,236,.25); }.north-content { display: flex; height: calc(100% - 106px); flex-direction: column; justify-content: center; padding: 1.5rem 2rem; }.north-content h4 { max-width: 680px; margin: 0; font-family: var(--font-display); font-size: clamp(2.3rem, 5vw, 5.7rem); font-weight: 500; letter-spacing: -.09em; line-height: .88; }.north-content h4 em { color: #b8f55f; font-style: normal; }.north-data { display: flex; gap: 1.2rem; margin-top: 3rem; color: rgba(241,240,236,.62); font-family: monospace; font-size: .6rem; text-transform: uppercase; }.north-foot { display: flex; justify-content: space-between; padding: 1rem 1.2rem; color: #b8f55f; font-family: monospace; font-size: .6rem; }
.product-screen--luma { background: #e5ded2; color: #242321; }.luma-nav, .kora-top, .pulse-nav, .field-nav { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1rem 1.2rem; border-bottom: 1px solid rgba(36,35,33,.22); font-size: .62rem; }.luma-content { display: grid; height: calc(100% - 58px); grid-template-columns: 1fr 1fr; align-items: center; gap: 2rem; padding: 1.5rem 2rem; }.luma-image { position: relative; display: flex; height: 78%; align-items: flex-end; justify-content: space-between; padding: .8rem; background: #b4c6b4; }.luma-image::before { position: absolute; top: 16%; left: 19%; width: 55%; height: 62%; border-radius: 50% 50% 42% 58%; background: #f17658; content: ''; transform: rotate(-19deg); }.luma-image::after { position: absolute; right: 12%; bottom: 12%; width: 28%; height: 28%; border: 1px solid #242321; border-radius: 50%; content: ''; }.luma-image span { position: relative; z-index: 1; font-family: monospace; font-size: .58rem; }.luma-copy small { color: rgba(36,35,33,.54); font-family: monospace; font-size: .62rem; }.luma-copy h4 { margin: 1.4rem 0 2rem; font-family: var(--font-display); font-size: clamp(1.8rem, 3.8vw, 4.5rem); font-weight: 500; letter-spacing: -.09em; line-height: .88; }.luma-copy h4 em { color: #f17658; font-style: normal; }.luma-copy b { font-size: .65rem; }
.product-screen--kora { background: #18283a; color: #edf1ee; }.kora-top { border-color: rgba(237,241,238,.2); }.kora-top span:nth-child(2) { color: rgba(237,241,238,.54); }.kora-grid { display: grid; height: calc(100% - 58px); grid-template-columns: 1fr 1.35fr; grid-template-rows: 1fr 1fr; gap: .8rem; padding: 1.2rem; }.kora-balance, .kora-chart, .kora-list { padding: 1rem; border: 1px solid rgba(237,241,238,.18); background: rgba(255,255,255,.035); }.kora-balance { display: flex; flex-direction: column; gap: .55rem; }.kora-balance small, .kora-chart small, .kora-list > span { color: rgba(237,241,238,.54); font-family: monospace; font-size: .58rem; }.kora-balance strong { margin-top: auto; font-family: var(--font-display); font-size: clamp(1.5rem, 3vw, 3.5rem); font-weight: 500; letter-spacing: -.08em; }.kora-balance span { color: #b8f55f; font-size: .62rem; }.kora-chart { position: relative; display: flex; align-items: flex-end; gap: 5%; padding-top: 2.7rem; }.kora-chart small { position: absolute; top: 1rem; left: 1rem; }.kora-chart i { display: block; flex: 1; background: #b8f55f; opacity: .86; }.kora-chart i:nth-of-type(1) { height: 34%; }.kora-chart i:nth-of-type(2) { height: 51%; }.kora-chart i:nth-of-type(3) { height: 43%; }.kora-chart i:nth-of-type(4) { height: 74%; background: #f57a5f; }.kora-chart i:nth-of-type(5) { height: 60%; }.kora-chart i:nth-of-type(6) { height: 88%; }.kora-list { display: flex; grid-column: 1 / -1; flex-direction: column; gap: .55rem; }.kora-list b { display: flex; justify-content: space-between; padding-top: .55rem; border-top: 1px solid rgba(237,241,238,.12); font-size: .65rem; font-weight: 500; }.kora-list em { color: #b8f55f; font-style: normal; }
.product-screen--pulse { background: #e6d9ee; color: #202128; }.pulse-nav { border-color: rgba(32,33,40,.2); }.pulse-content { display: grid; height: calc(100% - 58px); grid-template-columns: .8fr 1.2fr; align-items: center; gap: 1rem; padding: 1.8rem; }.pulse-orb { display: flex; width: min(18vw, 180px); height: min(18vw, 180px); align-items: center; justify-content: center; flex-direction: column; border: 1px solid #2947e8; border-radius: 50%; box-shadow: inset 0 0 0 16px rgba(41,71,232,.1); color: #2947e8; }.pulse-orb span { font-family: var(--font-display); font-size: clamp(2.5rem, 5vw, 5rem); letter-spacing: -.1em; line-height: .8; }.pulse-orb small, .pulse-content small { font-family: monospace; font-size: .58rem; }.pulse-content h4 { margin: 1rem 0 1.7rem; font-family: var(--font-display); font-size: clamp(1.8rem, 4vw, 4.5rem); font-weight: 500; letter-spacing: -.09em; line-height: .88; }.pulse-content h4 em { color: #2947e8; font-style: normal; }.pulse-wave { display: flex; height: 4rem; align-items: center; gap: .25rem; }.pulse-wave i { display: block; width: .28rem; height: 20%; border-radius: 100px; background: #f17658; }.pulse-wave i:nth-child(2) { height: 42%; }.pulse-wave i:nth-child(3) { height: 80%; }.pulse-wave i:nth-child(4) { height: 35%; }.pulse-wave i:nth-child(5) { height: 62%; }.pulse-wave i:nth-child(6) { height: 28%; }.pulse-wave i:nth-child(7) { height: 50%; }
.product-screen--field { background: #27312e; color: #f1f0ec; }.field-nav { border-color: rgba(241,240,236,.22); }.field-nav span:last-child { color: rgba(241,240,236,.58); }.field-content { position: relative; display: flex; height: calc(100% - 106px); justify-content: center; flex-direction: column; padding: 1.5rem 2rem; }.field-number { position: absolute; top: 1.5rem; right: 2rem; color: #b8f55f; font-family: monospace; font-size: .65rem; }.field-content h4 { max-width: 640px; margin: 0; font-family: var(--font-display); font-size: clamp(2.2rem, 5vw, 5.7rem); font-weight: 500; letter-spacing: -.09em; line-height: .87; }.field-content h4 em { color: #b8f55f; font-style: normal; }.field-stamp { position: absolute; right: 9%; bottom: 13%; display: grid; width: 86px; height: 86px; place-items: center; border: 1px solid #f17658; border-radius: 50%; color: #f17658; font-family: monospace; font-size: .52rem; line-height: 1.4; text-align: center; text-transform: uppercase; transform: rotate(12deg); }.field-foot { display: flex; justify-content: space-between; padding: 1rem 1.2rem; color: #b8f55f; font-family: monospace; font-size: .6rem; }
.project-art__shape { position: absolute; display: block; border-radius: 50%; }
.project-art__shape--one { top: 12%; left: 17%; width: 55%; height: 68%; background: #b8f55f; mix-blend-mode: multiply; transform: rotate(25deg); }
.project-art__shape--two { right: 5%; bottom: 6%; width: 47%; height: 70%; border: 1px solid #111313; transform: rotate(-34deg); }
.project-art--nova { background: #d2d0c7; }.project-art--nova .project-art__shape--one { background: #2947e8; mix-blend-mode: normal; border-radius: 46% 54% 62% 38%; }.project-art--nova .project-art__shape--two { border-color: #b8f55f; width: 70%; height: 40%; }
.project-art--alma { background: #ddcbbb; }.project-art--alma .project-art__shape--one { background: #f57a5f; mix-blend-mode: normal; border-radius: 48% 52% 35% 65%; }.project-art--alma .project-art__shape--two { border-color: #2947e8; }
.project-art--move { background: #c4d2c6; }.project-art--move .project-art__shape--one { background: #2947e8; mix-blend-mode: normal; border-radius: 12%; transform: rotate(20deg); }.project-art--move .project-art__shape--two { border-color: #f57a5f; border-radius: 12%; transform: rotate(20deg); }
.project-art--north { background: #d7d7d2; }.project-art--north .project-art__shape--one { background: #b8f55f; mix-blend-mode: normal; border-radius: 0; transform: rotate(45deg); }.project-art--north .project-art__shape--two { border-color: #2947e8; }
.project-card__meta { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; padding-top: 1.1rem; border-top: 1px solid var(--color-border); }
.project-card__meta h3 { margin: .5rem 0 0; font-size: clamp(1.75rem, 2.9vw, 3.1rem); line-height: .95; }
.project-card__arrow { color: var(--color-cobalt); font-size: 1.8rem; transition: transform .25s var(--ease); }
.project-card__link:hover .project-card__arrow { transform: translate(4px, -4px); }
.project-card__description { max-width: 330px; margin: .9rem 0 0; color: rgba(17,19,19,.6); font-size: .92rem; line-height: 1.5; transition: color .3s var(--ease); }.project-card__link:hover .project-card__description { color: var(--color-text); }
.project-cursor { position: fixed; z-index: 30; display: grid; width: 86px; height: 86px; place-items: center; border-radius: 50%; background: var(--color-accent); color: var(--color-text); font-size: .66rem; font-weight: 800; line-height: 1; pointer-events: none; opacity: 0; transform: translate(-50%, -50%) scale(.75); transition: opacity .2s var(--ease), transform .35s var(--ease); }.project-cursor.is-visible { opacity: 1; transform: translate(-50%, -50%) scale(1); }.project-cursor span:last-child { position: absolute; right: 17px; top: 17px; font-size: 1rem; }
.projects-archive { padding-block: clamp(8rem, 14vw, 13rem); }.projects-list--archive .project-card:nth-child(even) { margin-top: 4rem; }
.portfolio-filter { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-bottom: clamp(3.5rem, 7vw, 6rem); padding-block: 1rem; border-top: 1px solid var(--color-border); border-bottom: 1px solid var(--color-border); }
.portfolio-filter__label { flex: 0 0 auto; color: rgba(17,19,19,.48); font-family: monospace; font-size: .64rem; letter-spacing: .12em; text-transform: uppercase; }
.portfolio-filter__options { display: flex; justify-content: flex-end; gap: .35rem; overflow-x: auto; }
.portfolio-filter__button { display: inline-flex; align-items: center; gap: .55rem; padding: .55rem .7rem; border: 1px solid transparent; border-radius: 100px; background: transparent; color: rgba(17,19,19,.56); cursor: pointer; font-size: .76rem; white-space: nowrap; transition: color .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease); }
.portfolio-filter__button span { color: rgba(17,19,19,.4); font-family: monospace; font-size: .62rem; }
.portfolio-filter__button:hover { color: var(--color-text); border-color: var(--color-border); }
.portfolio-filter__button.is-active { background: var(--color-text); color: var(--color-background); }
.portfolio-filter__button.is-active span { color: var(--color-accent); }
.project-card.is-filtered { display: none; }
.portfolio-filter__empty { margin: 0; padding: 5rem 0; color: rgba(17,19,19,.58); font-size: 1rem; text-align: center; }

/* Services / process */
.services { overflow: hidden; }.services-list { border-top: 1px solid var(--color-border-light); }.service-row { display: grid; grid-template-columns: 7% 35% 1fr 5%; gap: 1rem; align-items: center; min-height: 105px; border-bottom: 1px solid var(--color-border-light); transition: padding .35s var(--ease), background .35s var(--ease); }.service-row:hover { padding-inline: 1rem; background: rgba(184,245,95,.08); }.service-row__number { color: var(--color-accent); font-family: monospace; font-size: .74rem; }.service-row h3, .service-row h2 { margin: 0; font-size: clamp(1.15rem, 2vw, 2.15rem); letter-spacing: -.06em; }.service-row p { max-width: 370px; margin: 0; color: rgba(241,240,236,.64); font-size: .94rem; line-height: 1.5; transition: color .25s var(--ease); }.service-row:hover p { color: rgba(241,240,236,.9); }.service-row__arrow { color: var(--color-accent); font-size: 1.4rem; text-align: right; transition: transform .25s var(--ease); }.service-row:hover .service-row__arrow { transform: translate(4px, -4px); }.services-list--page { margin-top: 6rem; }.inner-page h1 { max-width: 950px; margin: 1.5rem 0; font-size: clamp(3.5rem, 7vw, 7.2rem); line-height: .9; }.lead { max-width: 580px; color: rgba(241,240,236,.76); font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.5; }.process-list { position: relative; border-top: 1px solid var(--color-border); }.process-list::before { position: absolute; top: 0; bottom: 0; left: calc(10% + .35rem); width: 1px; background: var(--color-border); content: ''; }.process-item { position: relative; display: grid; grid-template-columns: 10% 1fr; gap: 1rem; padding: 2.4rem 0 2.6rem; border-bottom: 1px solid var(--color-border); }.process-item__number { position: relative; z-index: 1; display: inline-flex; width: 1.8rem; height: 1.8rem; align-items: center; justify-content: center; border: 1px solid var(--color-background); border-radius: 50%; background: var(--color-cobalt); color: white; font-family: monospace; font-size: .62rem; }.process-item h3 { margin: 0 0 .3rem; font-size: clamp(1.65rem, 2.7vw, 2.8rem); }.process-item p { max-width: 420px; margin: 0; color: rgba(17,19,19,.6); font-size: .94rem; line-height: 1.5; }

/* Statement / capabilities / CTA */
.statement { padding-block: clamp(6rem, 13vw, 12rem); }.statement h2 { max-width: 1100px; margin: 5rem 0 7rem; font-size: clamp(3rem, 6.5vw, 6.8rem); line-height: .92; }.statement__bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }.statement__bottom p { max-width: 470px; margin: 0; color: rgba(241,240,236,.78); font-size: 1.1rem; line-height: 1.55; }.statement__symbol { color: var(--color-accent); font-size: 5rem; line-height: .6; }.capabilities__grid h2 { margin: 1.5rem 0 0; font-size: clamp(3rem, 5vw, 5.4rem); line-height: .94; }.capability-cloud { display: flex; align-content: center; align-items: center; flex-wrap: wrap; gap: .7rem; }.capability-cloud span { padding: .7rem 1rem; border: 1px solid var(--color-border); border-radius: 100px; font-family: var(--font-display); font-size: clamp(1rem, 1.4vw, 1.3rem); }.capability-cloud span:nth-child(3n) { border-color: var(--color-cobalt); color: var(--color-cobalt); }.capability-cloud span:nth-child(4n) { background: var(--color-cobalt); border-color: var(--color-cobalt); color: white; }.final-cta { padding-block: clamp(6rem, 13vw, 12rem); }.final-cta h2 { margin: 5rem 0 7rem; font-size: clamp(3.5rem, 7.5vw, 7.8rem); line-height: .9; }.final-cta__email { color: var(--color-accent); font-family: monospace; font-size: .9rem; }.final-cta__email:hover { text-decoration: underline; }

/* Inner pages / contact / case studies */
.page-shell { min-height: 70vh; padding-block: clamp(9rem, 15vw, 14rem); }.page-shell h1 { margin: 1rem 0 3rem; font-size: clamp(3.5rem, 7vw, 7.2rem); line-height: .9; }.post-preview { padding-block: 2rem; border-top: 1px solid var(--color-border); }.post-preview h2 { margin: .7rem 0; font-size: 2rem; }.post-preview p { color: rgba(17,19,19,.62); font-size: 1rem; }.entry-content { max-width: 760px; font-size: 1.1rem; line-height: 1.65; }.entry-content > * + * { margin-top: 1.4rem; }.inner-page { min-height: 100vh; }.inner-page__columns { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; margin-top: 6rem; }.inner-page__columns p { color: rgba(241,240,236,.76); font-size: 1.05rem; }.studio-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-top: 9rem; padding-top: 1.5rem; border-top: 1px solid var(--color-border-light); }.studio-principles span { color: var(--color-accent); font-family: monospace; font-size: .76rem; }.studio-principles h2 { margin-top: 2rem; color: white; font-size: clamp(1.7rem, 2.5vw, 2.8rem); line-height: .95; }.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8vw; }.contact-grid h1 { margin-bottom: 2rem; }.contact-note { max-width: 390px; margin-bottom: 2.5rem; color: rgba(241,240,236,.7); font-size: 1.05rem; line-height: 1.55; }.footer-email { display: inline-flex; align-items: center; gap: .8rem; color: var(--color-accent); font-family: monospace; font-size: .84rem; }.project-form { padding-top: .5rem; }.form-field { display: flex; flex-direction: column; gap: .45rem; margin-bottom: 1.25rem; }.form-field label { color: rgba(241,240,236,.66); font-size: .78rem; }.form-field input, .form-field select, .form-field textarea { width: 100%; padding: .75rem 0; border: 0; border-bottom: 1px solid var(--color-border-light); border-radius: 0; outline: 0; background: transparent; color: var(--color-text-light); font-size: 1rem; transition: border-color .25s var(--ease); }.form-field select option { color: var(--color-text); }.form-field input:focus, .form-field select:focus, .form-field textarea:focus { border-color: var(--color-accent); }.form-disclaimer { margin-top: 1.2rem; color: rgba(241,240,236,.48); font-size: .72rem; }.case-hero { display: grid; min-height: 88vh; align-items: end; grid-template-columns: .9fr 1.1fr; gap: 5vw; padding-top: 10rem; padding-bottom: 5rem; }.case-hero h1 { margin: 1.4rem 0; font-size: clamp(4rem, 8vw, 8.5rem); line-height: .86; }.case-client { color: rgba(17,19,19,.62); font-size: .9rem; }.case-hero__art { min-height: min(50vw, 600px); }.case-content { display: grid; grid-template-columns: 35% 1fr; gap: 8vw; padding-block: 8rem; border-top: 1px solid var(--color-border); }.case-lead { font-family: var(--font-display); font-size: clamp(1.55rem, 2.6vw, 2.6rem); line-height: 1.08; }.page-404 h1 { color: white; }

/* Footer */
.site-footer { padding-block: 5rem 2rem; background: var(--color-background-dark); color: var(--color-text-light); }.footer-top { display: flex; justify-content: space-between; gap: 2rem; padding-bottom: 8rem; }.brand--footer { font-size: 1.3rem; }.footer-tagline { margin: 1.5rem 0 0; color: rgba(241,240,236,.58); font-size: .9rem; line-height: 1.5; }.footer-bottom { display: grid; grid-template-columns: 1fr 1fr auto; gap: 2rem; align-items: end; padding-top: 1.2rem; border-top: 1px solid var(--color-border-light); }.footer-nav, .footer-social { display: flex; gap: 1rem; flex-wrap: wrap; font-size: .78rem; }.footer-copy { margin: 0; color: rgba(241,240,236,.46); font-family: monospace; font-size: .7rem; text-align: right; }

/* Motion */
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--ease), transform .8s var(--ease); }.reveal.is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }.reveal { opacity: 1; transform: none; } }
@media (max-width: 800px) { .primary-nav { position: fixed; inset: 76px 0 0; display: flex; visibility: hidden; flex-direction: column; align-items: flex-start; justify-content: center; gap: 1.5rem; padding: 2rem var(--spacing); background: var(--color-background-dark); opacity: 0; transition: opacity .25s var(--ease), visibility .25s; }.menu-open .primary-nav { visibility: visible; opacity: 1; }.primary-nav a { font-family: var(--font-display); font-size: 2.2rem; letter-spacing: -.06em; }.menu-toggle { display: block; order: 3; }.header-cta { display: none; }.menu-open .menu-toggle span:nth-child(2) { transform: translateY(3px) rotate(45deg); }.menu-open .menu-toggle span:nth-child(3) { transform: translateY(-3px) rotate(-45deg); }.hero__grid { min-height: auto; grid-template-columns: 1fr; padding-top: 4rem; }.hero__copy { padding-block: 4rem 2rem; }.hero h1 { font-size: clamp(3rem, 10vw, 4.8rem); }.hero-line--quiet { font-size: .62em; }.hero-line--offset { padding-left: 1.5rem; }.hero-line--accent { padding-left: 3rem; }.hero__visual { min-height: 72vw; margin-bottom: 2rem; }.hero__footer { display: none; }.manifesto__grid, .capabilities__grid, .contact-grid, .case-hero, .case-content, .inner-page__columns { grid-template-columns: 1fr; gap: 3rem; }.manifesto__content h2, .section-heading h2 { font-size: clamp(2.8rem, 10vw, 4.8rem); }.section-heading { align-items: flex-start; flex-direction: column; }.section-heading__note { text-align: left; }.project-card, .project-card:nth-child(even) { grid-column: 1 / -1; margin-top: 0; }.project-art { min-height: 74vw; }.section-end { align-items: flex-start; flex-direction: column; }.service-row { grid-template-columns: 10% 1fr 8%; padding-block: 1.35rem; }.service-row p { grid-column: 2 / -1; }.service-row h3, .service-row h2 { font-size: 1.25rem; }.statement h2, .final-cta h2 { margin-block: 4rem; font-size: clamp(3rem, 10vw, 5.2rem); }.statement__bottom, .footer-top { align-items: flex-start; flex-direction: column; }.capability-cloud { gap: .5rem; }.capability-cloud span { padding: .55rem .7rem; font-size: .9rem; }.studio-principles { grid-template-columns: 1fr; gap: 2rem; margin-top: 5rem; }.studio-principles h2 { margin: .8rem 0 0; }.case-hero { min-height: auto; align-items: start; padding-top: 9rem; }.case-hero h1 { font-size: clamp(3.5rem, 12vw, 6rem); }.case-hero__art { min-height: 80vw; }.case-content { padding-block: 5rem; }.process-list::before { left: .85rem; }.process-item { grid-template-columns: 2.2rem 1fr; gap: 1rem; }.footer-bottom { grid-template-columns: 1fr; align-items: start; }.footer-copy { text-align: left; }.page-shell h1 { font-size: clamp(3.5rem, 12vw, 5.7rem); } }
@media (pointer: coarse) { .project-cursor { display: none; } }

/* Type scale refinement: quieter display, more generous reading sizes. */
body { font-size: 17px; line-height: 1.58; }
.hero h1 { font-size: clamp(3.15rem, 5.4vw, 5.8rem); line-height: .92; }
.manifesto__content h2, .section-heading h2 { font-size: clamp(2.75rem, 4.5vw, 4.8rem); line-height: .98; }
.manifesto__content > p { max-width: 540px; font-size: 1.12rem; line-height: 1.58; }
.section-heading__note { font-size: .9rem; line-height: 1.5; }
.project-card__meta h3 { font-size: clamp(1.75rem, 2.9vw, 3.1rem); line-height: .95; }
.project-card__description { max-width: 330px; color: rgba(17,19,19,.6); font-size: .92rem; line-height: 1.5; }
.service-row h3, .service-row h2 { font-size: clamp(1.15rem, 2vw, 2.15rem); }
.service-row p { max-width: 370px; font-size: .94rem; line-height: 1.5; }
.inner-page h1, .page-shell h1 { font-size: clamp(3.5rem, 6.2vw, 6.3rem); line-height: .92; }
.lead { font-size: clamp(1.15rem, 1.8vw, 1.4rem); line-height: 1.5; }
.process-item h3 { font-size: clamp(1.65rem, 2.7vw, 2.8rem); }
.process-item p { max-width: 420px; font-size: .94rem; line-height: 1.5; }
.statement h2 { font-size: clamp(3rem, 5.8vw, 6rem); line-height: .94; }
.statement__bottom p { font-size: 1.1rem; line-height: 1.55; }
.capabilities__grid h2 { font-size: clamp(3rem, 4.5vw, 4.8rem); line-height: .98; }
.final-cta h2 { font-size: clamp(3.5rem, 6.8vw, 6.8rem); line-height: .92; }
.entry-content { font-size: 1.1rem; line-height: 1.65; }
.contact-note { font-size: 1.05rem; line-height: 1.55; }
.form-field input, .form-field select, .form-field textarea { font-size: 1rem; }
.footer-tagline { font-size: .9rem; line-height: 1.5; }
.footer-nav, .footer-social { font-size: .78rem; }

@media (max-width: 800px) {
	.hero h1 { font-size: clamp(3rem, 10vw, 4.8rem); }
	.manifesto__content h2, .section-heading h2 { font-size: clamp(2.8rem, 10vw, 4.8rem); }
	.statement h2, .final-cta h2 { font-size: clamp(3rem, 10vw, 5.2rem); }
	.inner-page h1, .page-shell h1 { font-size: clamp(3.5rem, 12vw, 5.7rem); }
	.service-row h3, .service-row h2 { font-size: 1.25rem; }
}

/* Editorial hero atmosphere and portfolio motion. */
.hero { position: relative; isolation: isolate; }
.hero::before { position: absolute; z-index: -1; inset: 0; background: radial-gradient(circle at 76% 48%, rgba(41,71,232,.16), transparent 26%), radial-gradient(circle at 60% 88%, rgba(184,245,95,.06), transparent 28%); content: ''; pointer-events: none; }
.hero::after { position: absolute; z-index: -1; right: 0; bottom: 0; left: 0; height: 14rem; background: linear-gradient(180deg, transparent, rgba(12,13,13,.72)); content: ''; pointer-events: none; }
.hero-core { box-shadow: 0 0 80px rgba(184,245,95,.08), inset 0 0 45px rgba(184,245,95,.05); }
.hero-core__letter { text-shadow: 0 0 28px rgba(241,240,236,.18); }
.project-art { transform: translate3d(0, var(--parallax-y, 0px), 0); transition: transform .45s var(--ease), box-shadow .45s var(--ease); will-change: transform; }
.project-card__link:hover .project-art { transform: translate3d(0, calc(var(--parallax-y, 0px) - 8px), 0) scale(1.012); box-shadow: 0 1.5rem 3rem rgba(17,19,19,.12); }

/* Hero mini-game: the C stays fixed while the canvas handles the action. */
.hero__copy { transform: none; opacity: 1; transition: none; will-change: auto; }
.hero__visual { transform: none; transition: none; will-change: auto; }
.orbit--one, .orbit--two { animation: none; }
.orbit::before { display: none; }
.space-game { cursor: crosshair; }
.space-game__canvas { position: absolute; z-index: 3; inset: 0; width: 100%; height: 100%; cursor: crosshair; touch-action: none; }
.space-game__hud { position: absolute; z-index: 5; right: 4%; bottom: 8%; left: 4%; display: flex; align-items: center; justify-content: space-between; color: rgba(241,240,236,.62); font-family: monospace; font-size: .6rem; letter-spacing: .12em; pointer-events: none; }
.space-game__hud strong { color: var(--color-accent); font-weight: 400; }
.space-game__hud > * { pointer-events: none; }
.space-game__sound { padding: .35rem .55rem; border: 1px solid rgba(241,240,236,.28); background: transparent; color: rgba(241,240,236,.62); cursor: pointer; font: inherit; font-size: .58rem; letter-spacing: .12em; pointer-events: auto !important; transition: border-color .25s var(--ease), color .25s var(--ease), background .25s var(--ease); }
.space-game__sound:hover, .space-game__sound:focus-visible { border-color: var(--color-accent); color: var(--color-accent); }
.space-game__sound[aria-pressed="false"] { color: rgba(241,240,236,.38); }
.hero-core { z-index: 4; transform: translate(-50%, -50%) rotate(var(--ship-angle, 0deg)); border-radius: 42% 50% 50% 42%; box-shadow: 0 0 80px rgba(184,245,95,.08), inset 0 0 45px rgba(184,245,95,.05); pointer-events: none; }
.hero-core::before { position: absolute; top: 50%; right: -1.5rem; width: 0; height: 0; border-top: .8rem solid transparent; border-bottom: .8rem solid transparent; border-left: 1.5rem solid var(--color-accent); content: ''; opacity: .9; transform: translateY(-50%); }
.hero-core::after { position: absolute; top: 50%; left: -2rem; width: 2.5rem; height: .2rem; background: linear-gradient(90deg, transparent, var(--color-accent)); box-shadow: 0 0 16px rgba(184,245,95,.7); content: ''; opacity: .8; transform: translateY(-50%); }
.hero-core__trail { position: absolute; top: 50%; left: -3.1rem; width: 1.1rem; height: .45rem; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 18px rgba(184,245,95,.85); content: ''; opacity: .72; transform: translateY(-50%); }
.hero-core__letter { text-shadow: 0 0 28px rgba(241,240,236,.18); }
@media (max-width: 800px) {
	.space-game__hud { bottom: 5%; font-size: .52rem; }
	.hero-core::before { right: -1rem; border-top-width: .55rem; border-bottom-width: .55rem; border-left-width: 1rem; }
	.hero-core::after { left: -1.4rem; width: 1.8rem; }
	.hero-core__trail { left: -2.1rem; }
}

/* Services page */
.services-page__hero { padding-top: clamp(10rem, 17vw, 15rem); padding-bottom: 2rem; }
.services-page__hero-grid { display: grid; min-height: 62vh; align-items: end; grid-template-columns: 1.35fr .65fr; gap: 6vw; }
.services-page__hero h1 { max-width: 980px; margin: 1.5rem 0 0; font-size: clamp(3.8rem, 7.4vw, 8rem); line-height: .88; }
.services-page__hero h1 em { color: var(--color-accent); font-style: normal; }
.services-page__hero-aside { padding-bottom: .5rem; }
.services-page__hero-aside .lead { max-width: 390px; margin-bottom: 2rem; }
.services-page__hero-foot { display: flex; justify-content: space-between; gap: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--color-border-light); color: rgba(241,240,236,.48); font-family: monospace; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; }
.services-page__catalog { padding-top: clamp(5rem, 9vw, 8rem); }
.services-list--expanded { margin-top: 1rem; }
.service-row--expanded { grid-template-columns: 7% 31% 1fr 5%; align-items: start; min-height: 170px; padding-block: 2.1rem 2.3rem; }
.service-row--expanded:hover { padding-inline: 1rem; }
.service-row__title h2 { max-width: 330px; margin-top: .35rem; font-size: clamp(1.45rem, 2.5vw, 2.65rem); line-height: .96; }
.service-row__label { color: rgba(241,240,236,.42); font-family: monospace; font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.service-row__body { max-width: 490px; }
.service-row--expanded .service-row__body > p { max-width: 460px; margin: 0; color: rgba(241,240,236,.74); font-size: 1rem; line-height: 1.55; }
.service-row__tags { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: 1.25rem; }
.service-row__tags span { padding: .38rem .62rem; border: 1px solid rgba(241,240,236,.22); border-radius: 100px; color: rgba(241,240,236,.62); font-size: .68rem; }
.services-proof__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 8vw; }
.services-proof__intro h2 { margin: 1.4rem 0 0; font-size: clamp(3rem, 5.2vw, 5.8rem); line-height: .9; }
.services-proof__intro h2 em { color: var(--color-cobalt); font-style: normal; }
.services-proof__lead { max-width: 600px; margin: 0 0 4rem; font-size: clamp(1.2rem, 1.7vw, 1.45rem); line-height: 1.45; }
.proof-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.2rem; }
.proof-card { min-height: 235px; padding: 1.2rem; border-top: 1px solid var(--color-border); }
.proof-card span { color: var(--color-cobalt); font-family: monospace; font-size: .7rem; }
.proof-card h3 { margin: 3rem 0 .6rem; font-size: clamp(1.35rem, 2vw, 2rem); line-height: .95; }
.proof-card p { margin: 0; color: rgba(17,19,19,.62); font-size: .88rem; line-height: 1.5; }
.services-process { padding-top: 0; }
.services-page__cta { padding-block: clamp(6rem, 12vw, 11rem); }
.services-page__cta h2 { max-width: 950px; margin: 5rem 0 6rem; font-size: clamp(3.5rem, 6.8vw, 7rem); line-height: .9; }
.services-page__cta h2 em { color: var(--color-accent); font-style: normal; }
.services-page__cta-bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.services-page__cta-bottom p { max-width: 460px; margin: 0; color: rgba(241,240,236,.78); font-size: 1.08rem; line-height: 1.55; }
@media (max-width: 800px) {
	.services-page__hero-grid, .services-proof__grid { grid-template-columns: 1fr; gap: 3rem; }
	.services-page__hero { padding-top: 9rem; }
	.services-page__hero-grid { min-height: auto; }
	.services-page__hero h1 { font-size: clamp(3.3rem, 12vw, 5.8rem); }
	.services-page__hero-foot { flex-direction: column; gap: .4rem; }
	.service-row--expanded { grid-template-columns: 12% 1fr; gap: .8rem; }
	.service-row--expanded .service-row__title, .service-row--expanded .service-row__body { grid-column: 2; }
	.service-row--expanded .service-row__arrow { grid-column: 2; grid-row: 1; justify-self: end; }
	.service-row__body { max-width: none; }
	.proof-cards { grid-template-columns: 1fr; gap: 0; }
	.proof-card { min-height: auto; padding-block: 1.5rem 2rem; }
	.proof-card h3 { margin-top: 1.8rem; }
	.services-page__cta h2 { margin-block: 4rem; font-size: clamp(3rem, 11vw, 5.5rem); }
	.services-page__cta-bottom { align-items: flex-start; flex-direction: column; }
	.portfolio-filter { align-items: flex-start; flex-direction: column; gap: .7rem; }
	.portfolio-filter__options { width: 100%; justify-content: flex-start; padding-bottom: .2rem; }
}

/* Studio page */
.studio-hero { padding-top: clamp(10rem, 15vw, 14rem); padding-bottom: clamp(4rem, 8vw, 8rem); }
.studio-hero__grid { display: grid; min-height: 72vh; align-items: end; grid-template-columns: .78fr 1.22fr; gap: 6vw; }
.studio-hero__copy h1 { max-width: 720px; margin: 1.5rem 0 2rem; font-size: clamp(3.8rem, 7vw, 7.6rem); line-height: .87; }
.studio-hero__copy .lead { max-width: 440px; color: rgba(241,240,236,.8); }
.studio-hero__media, .studio-gallery__image { margin: 0; }
.studio-hero__media img { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; filter: saturate(.84); }
.studio-hero__media figcaption, .studio-gallery__image figcaption, .studio-film__caption { display: flex; justify-content: space-between; gap: 1rem; padding-top: .8rem; color: rgba(241,240,236,.58); font-family: monospace; font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.studio-intro__grid { display: grid; grid-template-columns: 1fr 2fr; gap: 4vw; }
.studio-intro__copy { max-width: 800px; }
.studio-intro__copy h2 { margin: 0 0 2.5rem; font-size: clamp(2.8rem, 5vw, 5.6rem); line-height: .92; }
.studio-intro__copy h2 em { color: var(--color-cobalt); font-style: normal; }
.studio-intro__copy p:not(.eyebrow) { max-width: 650px; color: rgba(17,19,19,.68); font-size: 1.12rem; line-height: 1.6; }
.studio-gallery { overflow: hidden; }
.studio-gallery__grid { display: grid; grid-template-columns: 1.3fr .7fr; align-items: end; gap: 2rem; }
.studio-gallery__image img { display: block; width: 100%; height: 100%; object-fit: cover; }
.studio-gallery__image--large img { aspect-ratio: 1.42 / 1; }
.studio-gallery__image--portrait { margin-bottom: 7rem; }
.studio-gallery__image--portrait img { aspect-ratio: .78 / 1; }
.studio-film__grid { display: grid; grid-template-columns: .72fr 1.28fr; align-items: center; gap: 8vw; }
.studio-film__intro h2 { margin: 1.4rem 0 2rem; font-size: clamp(3rem, 5vw, 5.8rem); line-height: .87; }
.studio-film__intro h2 em { color: var(--color-cobalt); font-style: normal; }
.studio-film__intro > p:last-child { max-width: 390px; color: rgba(17,19,19,.64); font-size: 1rem; line-height: 1.55; }
.studio-film__media video { display: block; width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--color-background-dark); }
.studio-reel { position: relative; overflow: hidden; aspect-ratio: 16 / 10; background: var(--color-background-dark); }
.studio-reel__frame { position: absolute; inset: 0; animation-duration: 18s; animation-iteration-count: infinite; animation-timing-function: ease-in-out; }
.studio-reel__frame--one { animation-name: studio-reel-one; }
.studio-reel__frame--two, .studio-reel__frame--three { opacity: 0; }
.studio-reel__frame--two { animation-name: studio-reel-two; }
.studio-reel__frame--three { animation-name: studio-reel-three; }
.studio-reel__frame img { display: block; width: 100%; height: 100%; object-fit: cover; filter: saturate(.78) brightness(.78); }
.studio-reel__overlay { position: absolute; z-index: 2; right: 1rem; bottom: 1rem; left: 1rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--color-text-light); font-family: monospace; font-size: .6rem; letter-spacing: .08em; text-transform: uppercase; }
.studio-reel__overlay button { padding: .55rem .7rem; border: 1px solid rgba(241,240,236,.48); background: rgba(12,13,13,.48); color: var(--color-text-light); cursor: pointer; font: inherit; font-size: .58rem; letter-spacing: .08em; text-transform: uppercase; }
.studio-reel__overlay button:hover, .studio-reel__overlay button:focus-visible { border-color: var(--color-accent); color: var(--color-accent); }
.studio-reel.is-paused .studio-reel__frame { animation-play-state: paused; }
@keyframes studio-reel-one { 0%, 28% { opacity: 1; transform: scale(1); } 34%, 94% { opacity: 0; transform: scale(1.04); } 100% { opacity: 1; transform: scale(1); } }
@keyframes studio-reel-two { 0%, 28% { opacity: 0; transform: scale(1.04); } 34%, 61% { opacity: 1; transform: scale(1); } 67%, 100% { opacity: 0; transform: scale(1.04); } }
@keyframes studio-reel-three { 0%, 61% { opacity: 0; transform: scale(1.04); } 67%, 94% { opacity: 1; transform: scale(1); } 100% { opacity: 0; transform: scale(1.04); } }
.studio-film__caption { color: rgba(17,19,19,.48); }
.studio-values { padding-block: clamp(6rem, 12vw, 11rem); }
.studio-values__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; border-top: 1px solid var(--color-border-light); }
.studio-value { padding-top: 1.2rem; }
.studio-value span { color: var(--color-accent); font-family: monospace; font-size: .7rem; }
.studio-value h3 { max-width: 270px; margin: 3.5rem 0 .7rem; color: var(--color-text-light); font-size: clamp(1.5rem, 2.3vw, 2.5rem); line-height: .93; }
.studio-value p { max-width: 260px; margin: 0; color: rgba(241,240,236,.68); font-size: .92rem; line-height: 1.5; }
.studio-cta { padding-block: clamp(6rem, 12vw, 11rem); }
.studio-cta h2 { margin: 5rem 0 4rem; font-size: clamp(3.5rem, 6.8vw, 7rem); line-height: .9; }
.studio-cta h2 em { color: var(--color-accent); font-style: normal; }
@media (max-width: 800px) {
	.studio-hero { padding-top: 9rem; }
	.studio-hero__grid, .studio-intro__grid, .studio-gallery__grid, .studio-film__grid { grid-template-columns: 1fr; gap: 3rem; }
	.studio-hero__grid { min-height: auto; }
	.studio-hero__copy h1 { font-size: clamp(3.3rem, 12vw, 5.8rem); }
	.studio-gallery__image--portrait { max-width: 78%; margin: 0 0 0 auto; }
	.studio-values__grid { grid-template-columns: 1fr; gap: 0; }
	.studio-value { padding-block: 1.3rem 2rem; border-bottom: 1px solid var(--color-border-light); }
	.studio-value h3 { margin-top: 1.8rem; }
	.studio-cta h2 { margin-block: 4rem; font-size: clamp(3rem, 11vw, 5.5rem); }
}

/* Contact, trust and utility pages */
.contact-next { max-width: 430px; margin-top: clamp(5rem, 10vw, 9rem); padding-top: 1.4rem; border-top: 1px solid var(--color-border-light); }
.contact-next h2 { margin: 1.3rem 0 1rem; color: var(--color-text-light); font-size: clamp(1.8rem, 3vw, 3rem); line-height: .98; }
.contact-next > p:last-child { margin: 0; color: rgba(241,240,236,.62); font-size: .96rem; line-height: 1.55; }
.form-status { margin: 0 0 1.5rem; padding: .85rem 1rem; border: 1px solid currentColor; font-size: .86rem; line-height: 1.45; }
.form-status--success { color: var(--color-accent); }
.form-status--error { color: #ffab9c; }
.form-field label span, .privacy-consent a { color: var(--color-accent); }
.form-field--trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.privacy-consent { display: flex; align-items: flex-start; gap: .7rem; margin: 1.4rem 0 1.5rem; color: rgba(241,240,236,.64); font-size: .78rem; line-height: 1.45; }
.privacy-consent input { flex: 0 0 auto; width: 1rem; height: 1rem; margin-top: .15rem; accent-color: var(--color-accent); }
.privacy-consent a { text-decoration: underline; text-underline-offset: .16em; }
.legal-page .lead--dark { color: rgba(17,19,19,.68); }
.legal-page h1, .faq-page h1 { margin-bottom: 2.5rem; }
.legal-page .entry-content h2 { margin: 3rem 0 .75rem; font-family: var(--font-display); font-size: clamp(1.45rem, 2vw, 2rem); line-height: 1; }
.legal-page .entry-content p { margin-bottom: 1rem; }
.legal-page .entry-content a { color: var(--color-cobalt); text-decoration: underline; text-underline-offset: .16em; }
.legal-warning { margin: 0 0 3rem; padding: 1rem 1.1rem; border-left: 3px solid var(--color-accent); background: rgba(184,245,95,.14); color: rgba(17,19,19,.78); font-size: .86rem; line-height: 1.5; }
.faq-page .lead--dark { max-width: 560px; color: rgba(17,19,19,.65); }
.faq-list { margin-top: 5rem; border-top: 1px solid var(--color-border); }
.faq-item { border-bottom: 1px solid var(--color-border); }
.faq-item summary { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.3rem 0; cursor: pointer; list-style: none; font-family: var(--font-display); font-size: clamp(1.25rem, 2.1vw, 2rem); letter-spacing: -.045em; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary span { color: var(--color-cobalt); font-family: var(--font-primary); font-size: 1.5rem; font-weight: 400; transition: transform .25s var(--ease); }
.faq-item[open] summary span { transform: rotate(45deg); }
.faq-item p { max-width: 650px; margin: 0; padding: 0 3rem 1.5rem 0; color: rgba(17,19,19,.64); font-size: 1rem; line-height: 1.58; }
.faq-cta { display: flex; align-items: center; justify-content: space-between; gap: 2rem; margin-top: 4rem; }
.faq-cta p { margin: 0; color: rgba(17,19,19,.58); font-size: .9rem; }
.faq-preview__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; margin-bottom: 3rem; }
.faq-preview__grid .faq-item { border-top: 1px solid var(--color-border); }
.faq-preview__grid .faq-item summary { font-size: 1.2rem; }
.faq-preview__grid .faq-item p { padding-right: 0; font-size: .9rem; }
.testimonials-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }
.testimonial-card { display: flex; min-height: 250px; flex-direction: column; justify-content: space-between; margin: 0; padding: 1.3rem; border-top: 1px solid var(--color-border); }
.testimonial-card p { max-width: 330px; margin: 2.8rem 0 3rem; font-family: var(--font-display); font-size: clamp(1.35rem, 2vw, 2rem); line-height: 1.04; letter-spacing: -.045em; }
.testimonial-card footer { color: rgba(17,19,19,.5); font-family: monospace; font-size: .64rem; letter-spacing: .06em; text-transform: uppercase; }
.content-note { margin: 3rem 0 0; color: rgba(17,19,19,.46); font-size: .78rem; }
.timeline-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
.timeline-card { min-height: 250px; padding: 1.2rem; border-top: 1px solid var(--color-border-light); }
.timeline-card > span { color: var(--color-accent); font-family: monospace; font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; }
.timeline-card h3 { margin: 4rem 0 .8rem; color: var(--color-text-light); font-size: clamp(1.35rem, 2vw, 2rem); line-height: .96; }
.timeline-card p { margin: 0; color: rgba(241,240,236,.62); font-size: .9rem; line-height: 1.5; }
.footer-legal { display: flex; gap: 1rem; margin-top: 1.3rem; padding-top: 1rem; border-top: 1px solid var(--color-border-light); color: rgba(241,240,236,.42); font-size: .7rem; }
.footer-legal a:hover { color: var(--color-text-light); }
@media (max-width: 800px) {
	.contact-next { margin-top: 4rem; }
	.faq-cta { align-items: flex-start; flex-direction: column; }
	.faq-preview__grid, .testimonials-grid, .timeline-grid { grid-template-columns: 1fr; gap: 0; }
	.testimonial-card, .timeline-card { min-height: auto; padding-block: 1.5rem 2rem; }
	.testimonial-card p { margin-block: 2rem; }
	.timeline-card h3 { margin-top: 2rem; }
	.footer-legal { flex-wrap: wrap; }
}

/* Premium hero refinement */
.hero { background: var(--color-background-dark); }
.hero::before { background-image: linear-gradient(rgba(241,240,236,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(241,240,236,.035) 1px, transparent 1px), radial-gradient(circle at 75% 45%, rgba(41,71,232,.2), transparent 25%), radial-gradient(circle at 52% 72%, rgba(184,245,95,.06), transparent 28%); background-size: 72px 72px, 72px 72px, auto, auto; }
.hero__copy { max-width: 860px; }
.hero__copy .eyebrow__dot { display: inline-block; width: .38rem; height: .38rem; margin-right: .38rem; border-radius: 50%; background: var(--color-accent); vertical-align: .08em; }
.hero__signature { display: flex; align-items: center; gap: .7rem; margin-top: 3.3rem; color: rgba(241,240,236,.42); font-family: monospace; font-size: .61rem; letter-spacing: .12em; }
.hero__signature i { display: block; width: 1.8rem; height: 1px; background: rgba(241,240,236,.25); }
.hero-rail { border-bottom: 1px solid var(--color-border); }
.hero-rail__inner { display: flex; min-height: 74px; align-items: center; justify-content: space-between; gap: 2rem; }
.hero-rail__label, .hero-rail__signal { color: rgba(17,19,19,.48); font-family: monospace; font-size: .61rem; letter-spacing: .12em; }
.hero-rail__words { display: flex; align-items: center; gap: 1rem; color: var(--color-text); font-family: var(--font-display); font-size: clamp(1rem, 1.6vw, 1.35rem); letter-spacing: -.04em; }
.hero-rail__words i { width: .28rem; height: .28rem; border-radius: 50%; background: var(--color-cobalt); }
.hero-rail__signal b { display: inline-block; width: .38rem; height: .38rem; margin-right: .35rem; border-radius: 50%; background: var(--color-accent); vertical-align: .05em; }
.hero__visual { border: 1px solid rgba(241,240,236,.12); background: linear-gradient(145deg, rgba(241,240,236,.025), transparent 42%), radial-gradient(circle at 50% 50%, rgba(41,71,232,.08), transparent 42%); }
.hero__visual::before { inset: 8%; border-color: rgba(241,240,236,.12); transform: none; }
.hero-visual__topline, .hero-visual__legend { position: absolute; z-index: 5; right: 4%; left: 4%; display: flex; justify-content: space-between; gap: 1rem; color: rgba(241,240,236,.42); font-family: monospace; font-size: .58rem; letter-spacing: .1em; pointer-events: none; }
.hero-visual__topline { top: 4%; }
.hero-visual__legend { bottom: 3%; }
.hero-visual__badge { position: absolute; z-index: 5; top: 12%; right: 7%; display: flex; align-items: center; gap: .65rem; padding: .65rem .75rem; border: 1px solid rgba(241,240,236,.18); background: rgba(12,13,13,.54); backdrop-filter: blur(8px); pointer-events: none; }
.hero-visual__badge-dot { display: block; width: .42rem; height: .42rem; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 12px rgba(184,245,95,.75); }
.hero-visual__badge strong, .hero-visual__badge small { display: block; }
.hero-visual__badge strong { color: var(--color-text-light); font-family: var(--font-display); font-size: .78rem; font-weight: 500; letter-spacing: -.02em; }
.hero-visual__badge small { margin-top: .15rem; color: rgba(241,240,236,.46); font-family: monospace; font-size: .52rem; letter-spacing: .08em; text-transform: uppercase; }
.hero-visual__code { right: auto; bottom: 13%; left: 4%; }
.hero__visual .orbit--one { width: 82%; border-color: rgba(184,245,95,.34); }
.hero__visual .orbit--two { width: 68%; }
.hero__visual .orbit--three { width: 44%; }
@media (max-width: 800px) {
	.hero__signature { margin-top: 2.4rem; }
	.hero-rail__inner { align-items: flex-start; flex-direction: column; justify-content: center; gap: .65rem; padding-block: 1rem; }
	.hero-rail__signal { display: none; }
	.hero-rail__words { gap: .65rem; font-size: .9rem; }
	.hero-visual__badge { top: 10%; right: 5%; transform: scale(.88); transform-origin: top right; }
	.hero-visual__legend { font-size: .5rem; }
}

/* NODO hero product preview */
.nodo-hero { min-height: min(62vw, 680px); overflow: hidden; border-color: rgba(241,240,236,.16); background: radial-gradient(circle at 76% 20%, rgba(41,71,232,.24), transparent 28%), linear-gradient(145deg, #171a24, #0c0d0d 58%); }
.nodo-hero::before { display: none; }
.nodo-hero::after { position: absolute; inset: 0; background-image: linear-gradient(rgba(241,240,236,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(241,240,236,.025) 1px, transparent 1px); background-size: 38px 38px; content: ''; pointer-events: none; }
.nodo-hero__topline, .nodo-hero__legend { position: absolute; z-index: 4; right: 4%; left: 4%; display: flex; justify-content: space-between; gap: 1rem; color: rgba(241,240,236,.44); font-family: monospace; font-size: .58rem; letter-spacing: .1em; pointer-events: none; }
.nodo-hero__topline { top: 4%; }
.nodo-hero__legend { bottom: 3%; }
.nodo-window { position: absolute; z-index: 2; inset: 11% 5% 11%; overflow: hidden; border: 1px solid rgba(241,240,236,.24); background: rgba(20,22,29,.93); box-shadow: 0 2rem 5rem rgba(0,0,0,.2); }
.nodo-window__bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem; height: 36px; padding: 0 .8rem; border-bottom: 1px solid rgba(241,240,236,.14); color: rgba(241,240,236,.45); font-family: monospace; font-size: .56rem; letter-spacing: .08em; }
.nodo-window__dots { display: flex; gap: .25rem; }
.nodo-window__dots i { display: block; width: .35rem; height: .35rem; border-radius: 50%; background: rgba(241,240,236,.3); }
.nodo-window__body { display: grid; min-height: calc(100% - 36px); grid-template-columns: 28% 72%; }
.nodo-sidebar { display: flex; flex-direction: column; padding: 1.2rem; border-right: 1px solid rgba(241,240,236,.12); background: rgba(241,240,236,.025); }
.nodo-sidebar > strong { color: var(--color-text-light); font-family: var(--font-display); font-size: 1.15rem; letter-spacing: -.08em; }
.nodo-sidebar__status { display: flex; align-items: center; gap: .4rem; margin-top: .45rem; color: rgba(241,240,236,.45); font-family: monospace; font-size: .55rem; }
.nodo-sidebar__status b { display: block; width: .35rem; height: .35rem; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 10px rgba(184,245,95,.75); }
.nodo-sidebar nav { display: grid; gap: .3rem; margin-top: 3.2rem; }
.nodo-sidebar nav button { padding: .65rem .6rem; border: 0; border-left: 1px solid transparent; background: transparent; color: rgba(241,240,236,.45); cursor: pointer; font-family: monospace; font-size: .62rem; letter-spacing: .08em; text-align: left; transition: color .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease); }
.nodo-sidebar nav button:hover, .nodo-sidebar nav button:focus-visible { color: var(--color-text-light); }
.nodo-sidebar nav button.is-active { border-color: var(--color-accent); background: rgba(184,245,95,.08); color: var(--color-accent); }
.nodo-sidebar__index { margin-top: auto; color: rgba(241,240,236,.28); font-family: monospace; font-size: .56rem; letter-spacing: .1em; }
.nodo-content { min-width: 0; padding: clamp(1rem, 2.4vw, 2.1rem); }
.nodo-content__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.nodo-kicker { color: rgba(241,240,236,.42); font-family: monospace; font-size: .55rem; letter-spacing: .1em; text-transform: uppercase; }
.nodo-content h2 { margin: .9rem 0 0; color: var(--color-text-light); font-size: clamp(2rem, 4.4vw, 4.7rem); line-height: .84; }
.nodo-content h2 em { color: var(--color-accent); font-style: normal; }
.nodo-avatar { display: inline-grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 1px solid rgba(241,240,236,.3); border-radius: 50%; color: var(--color-accent); font-family: monospace; font-size: .58rem; }
.nodo-content__lead { max-width: 270px; margin: 1.5rem 0 2.5rem; color: rgba(241,240,236,.6); font-size: .72rem; line-height: 1.5; }
.nodo-progress { max-width: 420px; }
.nodo-progress__head { display: flex; justify-content: space-between; gap: 1rem; color: rgba(241,240,236,.48); font-family: monospace; font-size: .55rem; letter-spacing: .06em; text-transform: uppercase; }
.nodo-progress__head strong { color: var(--color-accent); font-weight: 400; }
.nodo-progress__track { display: block; height: 3px; margin-top: .65rem; background: rgba(241,240,236,.14); }
.nodo-progress__track i { display: block; width: 78%; height: 100%; background: var(--color-accent); transition: width .35s var(--ease); }
.nodo-data-grid { display: grid; max-width: 420px; grid-template-columns: repeat(2, 1fr); gap: 1px; margin-top: 3rem; border-top: 1px solid rgba(241,240,236,.14); border-bottom: 1px solid rgba(241,240,236,.14); }
.nodo-data-grid article { min-width: 0; padding: .85rem .6rem .95rem 0; }
.nodo-data-grid article + article { padding-left: .8rem; border-left: 1px solid rgba(241,240,236,.14); }
.nodo-data-grid span { display: block; color: rgba(241,240,236,.4); font-family: monospace; font-size: .55rem; letter-spacing: .08em; text-transform: uppercase; }
.nodo-data-grid strong { display: block; margin-top: .6rem; overflow: hidden; color: var(--color-text-light); font-family: var(--font-display); font-size: clamp(.85rem, 1.5vw, 1.2rem); font-weight: 500; letter-spacing: -.05em; text-overflow: ellipsis; white-space: nowrap; }
.nodo-content__foot { display: flex; justify-content: space-between; gap: 1rem; margin-top: 3rem; color: rgba(241,240,236,.28); font-family: monospace; font-size: .48rem; letter-spacing: .08em; text-transform: uppercase; }
@media (max-width: 800px) {
	.nodo-hero { min-height: 112vw; }
	.nodo-window { inset: 12% 4% 12%; }
	.nodo-window__body { grid-template-columns: 1fr; }
	.nodo-sidebar { flex-direction: row; flex-wrap: wrap; align-items: center; gap: .7rem; padding: .75rem; border-right: 0; border-bottom: 1px solid rgba(241,240,236,.12); }
	.nodo-sidebar__status { margin-top: 0; }
	.nodo-sidebar nav { width: 100%; order: 3; margin-top: .4rem; }
	.nodo-sidebar nav button { padding: .45rem .35rem; text-align: center; }
	.nodo-sidebar nav { display: grid; grid-template-columns: repeat(2, 1fr); }
	.nodo-sidebar nav button { min-height: 32px; font-size: .52rem; line-height: 1.2; }
	.nodo-sidebar nav button:last-child { grid-column: 1 / -1; }
	.nodo-sidebar__index { margin: 0 0 0 auto; }
	.nodo-content { padding: 1rem; }
	.nodo-content__lead { margin-block: 1rem 1.4rem; }
	.nodo-data-grid { margin-top: 1.8rem; }
	.nodo-content__foot { margin-top: 1.6rem; }
	.nodo-content__foot span:last-child { display: none; }
}

/* NODO concept visuals */
.nodo-visuals { min-height: 154px; margin: 0 0 1.8rem; }
.nodo-visual[hidden] { display: none; }
.nodo-visual { min-height: 154px; padding: .75rem; border: 1px solid rgba(241,240,236,.14); background: rgba(241,240,236,.045); }
.nodo-visual__top { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: rgba(241,240,236,.44); font-family: monospace; font-size: .52rem; letter-spacing: .06em; text-transform: uppercase; }
.nodo-visual__top strong { color: var(--color-accent); font-weight: 400; }
.nodo-finance__amount { margin-top: .7rem; color: var(--color-text-light); font-family: var(--font-display); font-size: 1.5rem; letter-spacing: -.07em; }
.nodo-finance__amount small { display: inline-block; margin-left: .4rem; color: rgba(241,240,236,.4); font-family: monospace; font-size: .5rem; letter-spacing: .02em; }
.nodo-chart { display: flex; height: 54px; align-items: flex-end; gap: .45rem; margin-top: .5rem; padding-top: .3rem; border-bottom: 1px solid rgba(241,240,236,.15); }
.nodo-chart i { flex: 1; min-height: 5px; background: linear-gradient(180deg, var(--color-accent), rgba(184,245,95,.22)); }
.nodo-visual__axis { display: flex; justify-content: space-between; margin-top: .35rem; color: rgba(241,240,236,.28); font-family: monospace; font-size: .45rem; }
.nodo-calendar { display: grid; grid-template-columns: repeat(5, 1fr); gap: .25rem; margin-top: .8rem; }
.nodo-calendar i, .nodo-calendar b { display: grid; min-height: 18px; place-items: center; color: rgba(241,240,236,.3); font-family: monospace; font-size: .48rem; font-style: normal; font-weight: 400; }
.nodo-calendar i { color: rgba(241,240,236,.5); }
.nodo-calendar b.is-selected { background: var(--color-accent); color: #0c0d0d; }
.nodo-booking-card { display: grid; grid-template-columns: auto 1fr auto; gap: .55rem; align-items: center; margin-top: .55rem; padding-top: .5rem; border-top: 1px solid rgba(241,240,236,.14); }
.nodo-booking-card span, .nodo-booking-card small { color: rgba(241,240,236,.4); font-family: monospace; font-size: .47rem; }
.nodo-booking-card strong { color: var(--color-text-light); font-family: var(--font-display); font-size: .75rem; font-weight: 500; letter-spacing: -.04em; }
.nodo-kanban { display: grid; grid-template-columns: repeat(3, 1fr); gap: .45rem; margin-top: .85rem; }
.nodo-kanban > div { min-width: 0; }
.nodo-kanban span { display: block; margin-bottom: .35rem; color: rgba(241,240,236,.34); font-family: monospace; font-size: .45rem; }
.nodo-kanban b { display: block; overflow: hidden; margin-bottom: .3rem; padding: .42rem .35rem; border: 1px solid rgba(241,240,236,.12); color: rgba(241,240,236,.65); font-family: var(--font-primary); font-size: .5rem; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.nodo-kanban b.is-highlight { border-color: var(--color-accent); color: var(--color-accent); }
.nodo-team-avatars { display: flex; justify-content: flex-end; gap: 0; margin-top: .35rem; }
.nodo-team-avatars i { display: grid; width: 1.15rem; height: 1.15rem; margin-left: -.2rem; place-items: center; border: 1px solid #171a20; border-radius: 50%; background: rgba(41,71,232,.8); color: var(--color-text-light); font-family: monospace; font-size: .4rem; font-style: normal; }
.nodo-team-avatars i:nth-child(2) { background: rgba(184,245,95,.8); color: #0c0d0d; }.nodo-team-avatars i:nth-child(3) { background: rgba(245,122,95,.85); color: #0c0d0d; }.nodo-team-avatars i:nth-child(4) { background: rgba(241,240,236,.2); }
.nodo-products { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; margin-top: .85rem; }
.nodo-products > div { min-width: 0; }
.nodo-products i { display: block; aspect-ratio: .9 / 1; margin-bottom: .45rem; background: linear-gradient(145deg, rgba(41,71,232,.9), rgba(184,245,95,.65)); }
.nodo-products > div:nth-child(2) i { background: linear-gradient(145deg, rgba(241,240,236,.78), rgba(245,122,95,.85)); }.nodo-products > div:nth-child(3) i { background: linear-gradient(145deg, rgba(184,245,95,.85), rgba(41,71,232,.75)); }
.nodo-products b, .nodo-products small { display: block; overflow: hidden; color: rgba(241,240,236,.7); font-family: monospace; font-size: .46rem; font-weight: 400; text-overflow: ellipsis; white-space: nowrap; }
.nodo-products small { margin-top: .2rem; color: rgba(241,240,236,.38); }
.nodo-commerce-line { display: grid; grid-template-columns: auto auto 1fr; gap: .6rem; align-items: center; margin-top: .7rem; padding-top: .45rem; border-top: 1px solid rgba(241,240,236,.14); color: rgba(241,240,236,.4); font-family: monospace; font-size: .48rem; }
.nodo-commerce-line strong { color: var(--color-accent); font-weight: 400; }.nodo-commerce-line i { height: 2px; background: linear-gradient(90deg, var(--color-accent) 74%, rgba(241,240,236,.16) 74%); }
.nodo-wellness { display: flex; align-items: center; gap: 1rem; margin-top: .75rem; }
.nodo-progress-ring { display: grid; width: 5rem; height: 5rem; flex: 0 0 auto; place-items: center; border: 5px solid rgba(241,240,236,.1); border-top-color: var(--color-accent); border-right-color: var(--color-accent); border-radius: 50%; transform: rotate(-25deg); }
.nodo-progress-ring strong { color: var(--color-text-light); font-family: var(--font-display); font-size: 1.2rem; font-weight: 500; transform: rotate(25deg); }.nodo-progress-ring small { color: var(--color-accent); font-family: monospace; font-size: .5rem; }
.nodo-habits { display: grid; flex: 1; gap: .45rem; }.nodo-habits b { display: flex; align-items: center; gap: .4rem; color: rgba(241,240,236,.62); font-family: monospace; font-size: .5rem; font-weight: 400; }.nodo-habits i { width: .35rem; height: .35rem; border-radius: 50%; background: var(--color-accent); }.nodo-habits span { margin-left: auto; color: rgba(241,240,236,.34); }
.nodo-week { display: flex; gap: .45rem; margin-top: .75rem; }.nodo-week i { display: block; width: .62rem; height: .62rem; border: 1px solid rgba(241,240,236,.22); border-radius: 50%; }.nodo-week i.is-done { border-color: var(--color-accent); background: var(--color-accent); }
@media (max-width: 800px) {
	.nodo-visuals { min-height: 148px; margin-bottom: 1.2rem; }
	.nodo-visual { min-height: 148px; }
	.nodo-progress-ring { width: 4rem; height: 4rem; }
}

/* CREAIWE / clear editorial system */
:root {
	--color-background: #f7f7f3;
	--color-background-dark: #171817;
	--color-text: #171817;
	--color-text-light: #f7f7f3;
	--color-accent: #f07a49;
	--color-cobalt: #d85a36;
	--color-border: rgba(23, 24, 23, .14);
	--color-border-light: rgba(247, 247, 243, .2);
}

body {
	background: var(--color-background);
	color: var(--color-text);
	font-size: 16px;
	line-height: 1.62;
}

.section-space { padding-block: clamp(4.75rem, 9vw, 8.5rem); }
.section-light { background: var(--color-background); color: var(--color-text); }

/* Header: quiet, white and typographic. */
.site-header,
body:not(.is-home) .site-header,
.site-header.is-scrolled {
	background: rgba(247, 247, 243, .94);
	border-bottom: 1px solid rgba(23, 24, 23, .12);
	color: var(--color-text);
	backdrop-filter: blur(16px);
}
.site-header__inner { min-height: 72px; }
.brand { gap: .72rem; font-size: 1.08rem; }
.brand__mark {
	width: 2.1rem;
	height: 2.1rem;
	border-color: var(--color-text);
	background: var(--color-text);
	color: var(--color-background);
	font-family: var(--font-display);
	font-size: .8rem;
}
.brand__mark::before { top: .27rem; right: .27rem; background: var(--color-accent); }
.brand__mark::after { border-color: rgba(247, 247, 243, .34); }
.brand__wordmark { color: var(--color-text); font-size: 1.4em; letter-spacing: -.12em; }
.brand:hover .brand__mark { border-color: var(--color-cobalt); background: var(--color-cobalt); color: white; }
.primary-nav { gap: clamp(1.25rem, 2.7vw, 2.75rem); font-size: .8rem; }
.primary-nav a, .footer-nav a, .footer-social a { opacity: .62; }
.primary-nav a:hover, .footer-nav a:hover, .footer-social a:hover { opacity: 1; }
.header-cta {
	padding: .7rem 1rem;
	border-color: var(--color-text);
	background: var(--color-text);
	color: var(--color-background);
}
.header-cta:hover { border-color: var(--color-cobalt); background: var(--color-cobalt); color: white; }

/* Home hero: a calmer first impression with a product preview. */
.hero {
	min-height: auto;
	padding-top: 72px;
	background: var(--color-background);
	color: var(--color-text);
}
.hero::before,
.hero::after { display: none; }
.hero__grid {
	min-height: calc(100svh - 142px);
	grid-template-columns: minmax(0, 1.02fr) minmax(360px, .98fr);
	gap: clamp(2.5rem, 5vw, 6rem);
}
.hero__copy { max-width: 700px; padding-block: 5.5rem 4.5rem; }
.hero .eyebrow { color: rgba(23, 24, 23, .66); }
.hero .eyebrow__dot { background: var(--color-cobalt); }
.hero h1 {
	max-width: 700px;
	margin: 1.25rem 0 1.8rem;
	font-size: clamp(2.8rem, 4.55vw, 5.15rem);
	line-height: .96;
	letter-spacing: -.075em;
}
.hero-line,
.hero-line--quiet,
.hero-line--offset,
.hero-line--accent { padding-left: 0; }
.hero-line--quiet { color: var(--color-text); font-size: 1em; }
.hero h1 em { color: var(--color-cobalt); }
.accent-dot { color: var(--color-cobalt); }
.hero__intro {
	max-width: 470px;
	margin-bottom: 2.1rem;
	color: rgba(23, 24, 23, .68);
	font-size: 1.04rem;
	line-height: 1.6;
}
.hero .button--light {
	background: var(--color-text);
	border-color: var(--color-text);
	color: var(--color-background);
}
.hero .button--light:hover { background: var(--color-cobalt); border-color: var(--color-cobalt); color: white; }
.hero .text-link--light { color: var(--color-text); }
.hero .text-link--light span { color: var(--color-cobalt); }
.hero__signature { margin-top: 3rem; color: rgba(23, 24, 23, .4); }
.hero__signature i { background: rgba(23, 24, 23, .2); }
.hero__footer { padding-bottom: 1.25rem; color: rgba(23, 24, 23, .42); }
.hero__line { background: rgba(23, 24, 23, .25); }

/* NODO: white interface, restrained colour, no space/HUD decoration. */
.hero__visual.nodo-hero {
	min-height: min(58vw, 620px);
	border: 1px solid rgba(23, 24, 23, .16);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1.5rem 4rem rgba(23, 24, 23, .08);
}
.nodo-hero::after { display: none; }
.nodo-hero__topline,
.nodo-hero__legend { color: rgba(23, 24, 23, .42); }
.nodo-window {
	inset: 10% 5% 10%;
	border: 1px solid rgba(23, 24, 23, .16);
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 .9rem 2.5rem rgba(23, 24, 23, .08);
}
.nodo-window__bar {
	border-color: rgba(23, 24, 23, .11);
	color: rgba(23, 24, 23, .42);
}
.nodo-window__dots i { background: rgba(23, 24, 23, .24); }
.nodo-sidebar {
	border-color: rgba(23, 24, 23, .1);
	background: #f1f2ee;
}
.nodo-sidebar > strong,
.nodo-content h2,
.nodo-data-grid strong { color: var(--color-text); }
.nodo-sidebar__status,
.nodo-sidebar__index,
.nodo-kicker,
.nodo-content__lead,
.nodo-data-grid span,
.nodo-content__foot { color: rgba(23, 24, 23, .48); }
.nodo-sidebar__status b { background: var(--color-accent); box-shadow: none; }
.nodo-sidebar nav button { color: rgba(23, 24, 23, .5); }
.nodo-sidebar nav button:hover,
.nodo-sidebar nav button:focus-visible { color: var(--color-text); }
.nodo-sidebar nav button.is-active { border-color: var(--color-cobalt); background: rgba(49, 86, 216, .1); color: var(--color-cobalt); }
.nodo-content h2 { font-size: clamp(1.8rem, 3.45vw, 3.65rem); line-height: .9; }
.nodo-content h2 em { color: var(--color-cobalt); }
.nodo-avatar { border-color: rgba(23, 24, 23, .22); color: var(--color-cobalt); }
.nodo-progress__head { color: rgba(23, 24, 23, .48); }
.nodo-progress__head strong { color: var(--color-cobalt); }
.nodo-progress__track { background: rgba(23, 24, 23, .11); }
.nodo-progress__track i { background: var(--color-cobalt); }
.nodo-data-grid { border-color: rgba(23, 24, 23, .13); }
.nodo-data-grid article + article { border-color: rgba(23, 24, 23, .13); }
.nodo-visual { border-color: rgba(23, 24, 23, .12); background: #f8f8f5; }
.nodo-visual__top { color: rgba(23, 24, 23, .48); }
.nodo-visual__top strong,
.nodo-commerce-line strong { color: var(--color-cobalt); }
.nodo-finance__amount { color: var(--color-text); }
.nodo-finance__amount small,
.nodo-visual__axis,
.nodo-calendar i,
.nodo-calendar b,
.nodo-booking-card span,
.nodo-booking-card small,
.nodo-kanban span,
.nodo-products small,
.nodo-commerce-line,
.nodo-habits span { color: rgba(23, 24, 23, .42); }
.nodo-chart { border-color: rgba(23, 24, 23, .13); }
.nodo-chart i { background: linear-gradient(180deg, var(--color-cobalt), rgba(49, 86, 216, .18)); }
.nodo-calendar b.is-selected { background: var(--color-cobalt); color: white; }
.nodo-booking-card,
.nodo-commerce-line { border-color: rgba(23, 24, 23, .12); }
.nodo-booking-card strong { color: var(--color-text); }
.nodo-kanban b { border-color: rgba(23, 24, 23, .12); color: rgba(23, 24, 23, .68); }
.nodo-kanban b.is-highlight { border-color: var(--color-cobalt); color: var(--color-cobalt); }
.nodo-team-avatars i { border-color: #fff; color: var(--color-text); }
.nodo-products b { color: rgba(23, 24, 23, .7); }
.nodo-products i { background: linear-gradient(145deg, rgba(49, 86, 216, .9), rgba(184, 237, 97, .78)); }
.nodo-products > div:nth-child(2) i { background: linear-gradient(145deg, #e7e5df, #f18d70); }
.nodo-products > div:nth-child(3) i { background: linear-gradient(145deg, rgba(184, 237, 97, .9), rgba(49, 86, 216, .78)); }
.nodo-commerce-line i { background: linear-gradient(90deg, var(--color-cobalt) 74%, rgba(23, 24, 23, .12) 74%); }
.nodo-progress-ring { border-color: rgba(23, 24, 23, .1); border-top-color: var(--color-cobalt); border-right-color: var(--color-cobalt); }
.nodo-progress-ring strong { color: var(--color-text); }
.nodo-progress-ring small { color: var(--color-cobalt); }
.nodo-habits b { color: rgba(23, 24, 23, .68); }
.nodo-habits i,
.nodo-week i.is-done { background: var(--color-cobalt); }
.nodo-week i { border-color: rgba(23, 24, 23, .2); }

/* Reading rhythm and content hierarchy. */
.hero-rail { border-bottom-color: var(--color-border); }
.hero-rail__label, .hero-rail__signal { color: rgba(23, 24, 23, .48); }
.hero-rail__words { font-size: clamp(.9rem, 1.35vw, 1.15rem); }
.hero-rail__words i { background: var(--color-cobalt); }
.hero-rail__signal b { background: var(--color-accent); }
.manifesto__content h2, .section-heading h2 { font-size: clamp(2.35rem, 3.9vw, 4.25rem); line-height: 1; }
.manifesto__content > p { max-width: 560px; font-size: 1.03rem; }
.section-heading { margin-bottom: clamp(2.8rem, 5vw, 4.5rem); }
.section-heading__note { font-size: .86rem; }
.process-item h3 { font-size: clamp(1.45rem, 2.35vw, 2.35rem); }
.statement h2 { max-width: 960px; margin-block: 3.5rem 5rem; font-size: clamp(2.8rem, 5.2vw, 5.4rem); }
.final-cta h2 { margin-block: 3.5rem 5rem; font-size: clamp(3rem, 5.8vw, 6rem); }
.page-shell h1, .inner-page h1 { font-size: clamp(2.8rem, 5.5vw, 5.8rem); }
.case-hero h1 { font-size: clamp(3rem, 6.8vw, 7rem); }
.services-page__hero h1,
.studio-hero__copy h1 { font-size: clamp(3rem, 5.8vw, 6rem); line-height: .94; }
.services-proof__intro h2,
.studio-intro__copy h2,
.studio-film__intro h2 { font-size: clamp(2.7rem, 4.5vw, 4.8rem); line-height: .95; }
.services-page__cta h2 { margin-block: 3.5rem 5rem; font-size: clamp(3rem, 5.7vw, 5.8rem); }
.project-card__meta h3 { font-size: clamp(1.55rem, 2.45vw, 2.7rem); }

/* Keep contrast sections intentional rather than decorative. */
.section-cobalt { background: #3156d8; }
.services .service-row:hover { background: rgba(184, 237, 97, .08); }
.site-footer { padding-top: 4rem; }
.brand--footer .brand__mark { background: var(--color-text-light); color: var(--color-text); }
.brand--footer .brand__wordmark { color: var(--color-text-light); }

@media (max-width: 800px) {
	.site-header__inner { min-height: 68px; }
	.primary-nav { inset: 68px 0 0; background: var(--color-background); color: var(--color-text); }
	.primary-nav a { font-size: 2rem; }
	.hero { padding-top: 68px; }
	.hero__grid { min-height: auto; gap: 0; padding-top: 1rem; }
	.hero__copy { padding-block: 4rem 2.5rem; }
	.hero h1 { font-size: clamp(2.7rem, 10vw, 4.6rem); line-height: .98; }
	.hero__intro { font-size: 1rem; }
	.hero__signature { margin-top: 2.3rem; font-size: .55rem; }
	.hero__visual.nodo-hero { min-height: 112vw; border-radius: 10px; }
	.nodo-window { inset: 11% 4% 11%; }
	.nodo-content h2 { font-size: clamp(1.65rem, 8vw, 2.8rem); }
	.nodo-content__lead { font-size: .76rem; }
	.manifesto__content h2, .section-heading h2 { font-size: clamp(2.35rem, 10vw, 4.4rem); }
	.services-page__hero h1, .studio-hero__copy h1 { font-size: clamp(2.8rem, 11vw, 5.2rem); }
	.page-shell h1, .inner-page h1 { font-size: clamp(2.8rem, 11vw, 5.3rem); }
}

/* Hero portfolio carousel */
.hero-carousel {
	min-height: min(58vw, 620px);
	border: 1px solid rgba(23, 24, 23, .16);
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 1.5rem 4rem rgba(23, 24, 23, .08);
	outline: none;
}
.hero-carousel:focus-visible { outline: 2px solid var(--color-cobalt); outline-offset: 5px; }
.hero-carousel__topline,
.hero-carousel__legend {
	position: absolute;
	right: 5%;
	left: 5%;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	color: rgba(23, 24, 23, .42);
	font-family: monospace;
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.hero-carousel__topline { top: 4%; }
.hero-carousel__legend { bottom: 3%; }
.hero-carousel__legend a { color: var(--color-cobalt); font-weight: 700; }
.hero-carousel__stage { position: absolute; inset: 10% 5% 18%; }
.hero-carousel__slide { display: none; height: 100%; flex-direction: column; }
.hero-carousel__slide.is-active { display: flex; animation: carousel-fade .45s var(--ease) both; }
.hero-carousel__slide .project-art {
	min-height: 0;
	height: auto;
	flex: 1;
	border: 1px solid rgba(23, 24, 23, .12);
	border-radius: 8px;
	box-shadow: none;
	transform: none;
}
.hero-carousel__slide .project-art::after { opacity: .18; }
.hero-carousel__caption {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1rem;
	padding: .85rem .1rem 0;
}
.hero-carousel__caption > div > span {
	color: rgba(23, 24, 23, .48);
	font-family: monospace;
	font-size: .58rem;
	letter-spacing: .08em;
	text-transform: uppercase;
}
.hero-carousel__caption h2 {
	margin: .25rem 0 .2rem;
	color: var(--color-text);
	font-size: clamp(1.25rem, 2vw, 2rem);
	line-height: 1;
}
.hero-carousel__caption p {
	max-width: 280px;
	margin: 0;
	color: rgba(23, 24, 23, .6);
	font-size: .75rem;
	line-height: 1.4;
}
.hero-carousel__counter {
	padding-top: .2rem;
	color: var(--color-cobalt);
	font-family: monospace;
	font-size: .62rem;
	letter-spacing: .08em;
}
.hero-carousel__controls {
	position: absolute;
	right: 5%;
	bottom: 8%;
	left: 5%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
}
.hero-carousel__arrow {
	display: inline-grid;
	width: 2.15rem;
	height: 2.15rem;
	place-items: center;
	border: 1px solid rgba(23, 24, 23, .2);
	border-radius: 50%;
	background: #fff;
	color: var(--color-text);
	cursor: pointer;
	font-size: 1rem;
	transition: background .25s var(--ease), border-color .25s var(--ease), color .25s var(--ease), transform .25s var(--ease);
}
.hero-carousel__arrow:hover,
.hero-carousel__arrow:focus-visible { border-color: var(--color-cobalt); background: var(--color-cobalt); color: #fff; transform: translateY(-2px); }
.hero-carousel__dots { display: flex; align-items: center; gap: .45rem; }
.hero-carousel__dot {
	width: .45rem;
	height: .45rem;
	padding: 0;
	border: 1px solid rgba(23, 24, 23, .3);
	border-radius: 50%;
	background: transparent;
	cursor: pointer;
	transition: background .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
}
.hero-carousel__dot:hover,
.hero-carousel__dot:focus-visible { border-color: var(--color-cobalt); }
.hero-carousel__dot.is-active { border-color: var(--color-cobalt); background: var(--color-cobalt); transform: scale(1.35); }
@keyframes carousel-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

@media (max-width: 800px) {
	.hero-carousel { min-height: 112vw; border-radius: 10px; }
	.hero-carousel__topline, .hero-carousel__legend { right: 4%; left: 4%; font-size: .5rem; }
	.hero-carousel__stage { inset: 11% 4% 22%; }
	.hero-carousel__caption { padding-top: .65rem; }
	.hero-carousel__caption h2 { font-size: 1.25rem; }
	.hero-carousel__caption p { max-width: 220px; font-size: .68rem; }
	.hero-carousel__controls { right: 4%; bottom: 8%; left: 4%; }
	.hero-carousel__legend { bottom: 3%; }
	.hero-carousel__arrow { width: 1.9rem; height: 1.9rem; }
}

/* CREAIWE / refined warm visual system */
:root {
	--color-background: #f7f5f0;
	--color-background-dark: #171719;
	--color-text: #1b1b1d;
	--color-text-light: #f7f5f0;
	--color-accent: #f07a49;
	--color-cobalt: #d85a36;
	--color-border: rgba(27, 27, 29, .14);
	--color-border-light: rgba(247, 245, 240, .2);
	--font-primary: 'DM Sans', Arial, sans-serif;
	--font-display: 'Sora', Arial, sans-serif;
}

body {
	background: var(--color-background);
	color: var(--color-text);
	font-family: var(--font-primary);
	font-size: 16.5px;
	line-height: 1.65;
}
h1, h2, h3 { font-family: var(--font-display); font-weight: 500; letter-spacing: -.065em; }
h1 em, h2 em, h3 em { color: var(--color-cobalt); }
.section-dark, .section-ink { background: var(--color-background-dark); color: var(--color-text-light); }
.section-cobalt { background: var(--color-cobalt); color: var(--color-text-light); }
.section-dark .eyebrow, .section-ink .eyebrow, .section-cobalt .eyebrow { color: var(--color-accent); }
.section-dark h1 em, .section-ink h1 em, .section-dark h2 em, .section-ink h2 em, .section-cobalt h1 em, .section-cobalt h2 em { color: var(--color-accent); }
.section-space { padding-block: clamp(4.5rem, 8vw, 8rem); }

/* Brand and navigation */
.site-header, body:not(.is-home) .site-header, .site-header.is-scrolled {
	background: rgba(247, 245, 240, .94);
	border-bottom: 1px solid rgba(27, 27, 29, .1);
	color: var(--color-text);
	backdrop-filter: blur(18px);
}
.site-header__inner { min-height: 72px; }
.brand { gap: .7rem; font-size: 1.1rem; }
.brand__mark {
	width: 2.15rem;
	height: 2.15rem;
	border-color: var(--color-text);
	background: var(--color-text);
	color: var(--color-background);
	font-family: var(--font-display);
	font-size: .78rem;
}
.brand__mark::before { background: var(--color-accent); }
.brand__mark::after { border-color: rgba(247, 245, 240, .3); }
.brand__wordmark { color: var(--color-text); font-family: var(--font-display); font-size: 1.24em; font-weight: 600; letter-spacing: -.11em; }
.brand:hover .brand__mark { border-color: var(--color-cobalt); background: var(--color-cobalt); color: white; }
.primary-nav { gap: clamp(1.25rem, 2.6vw, 2.6rem); font-size: .82rem; }
.primary-nav a, .footer-nav a, .footer-social a { opacity: .62; }
.primary-nav a:hover, .footer-nav a:hover, .footer-social a:hover { opacity: 1; }
.header-cta { border-color: var(--color-text); background: var(--color-text); color: var(--color-background); }
.header-cta:hover { border-color: var(--color-cobalt); background: var(--color-cobalt); color: #fff; }

/* Editorial hero with a circular project carousel */
.hero {
	padding-top: 72px;
	background: var(--color-background);
	color: var(--color-text);
}
.hero::before, .hero::after { display: none; }
.hero__grid { min-height: calc(100svh - 142px); grid-template-columns: minmax(0, 1fr) minmax(390px, .92fr); gap: clamp(2.5rem, 5vw, 6rem); }
.hero__copy { max-width: 700px; padding-block: 5.2rem 4rem; }
.hero .eyebrow { color: rgba(27, 27, 29, .6); }
.hero .eyebrow__dot { background: var(--color-cobalt); }
.hero h1 { max-width: 700px; margin: 1.25rem 0 1.8rem; font-size: clamp(2.75rem, 4.35vw, 5rem); line-height: .98; }
.hero-line, .hero-line--quiet, .hero-line--offset, .hero-line--accent { padding-left: 0; }
.hero-line--quiet { color: var(--color-text); font-size: 1em; }
.hero h1 em, .accent-dot { color: var(--color-cobalt); }
.hero__intro { max-width: 465px; margin-bottom: 2.1rem; color: rgba(27, 27, 29, .68); font-size: 1.04rem; line-height: 1.62; }
.hero .button--light { border-color: var(--color-text); background: var(--color-text); color: var(--color-background); }
.hero .button--light:hover { border-color: var(--color-cobalt); background: var(--color-cobalt); color: #fff; }
.hero .text-link--light { color: var(--color-text); }
.hero .text-link--light span { color: var(--color-cobalt); }
.hero__signature { margin-top: 2.8rem; color: rgba(27, 27, 29, .38); }
.hero__signature i { background: rgba(27, 27, 29, .18); }
.hero__footer { color: rgba(27, 27, 29, .4); }
.hero__line { background: rgba(27, 27, 29, .22); }
.hero-rail { border-bottom-color: var(--color-border); }
.hero-rail__label, .hero-rail__signal { color: rgba(27, 27, 29, .45); }
.hero-rail__words { color: var(--color-text); font-size: clamp(.88rem, 1.3vw, 1.12rem); }
.hero-rail__words i { background: var(--color-accent); }
.hero-rail__signal b { background: var(--color-accent); }

.hero-carousel {
	min-height: min(58vw, 620px);
	border: 1px solid rgba(27, 27, 29, .13);
	border-radius: 24px;
	background: #ebe7df;
	box-shadow: 0 1.5rem 4rem rgba(27, 27, 29, .08);
	overflow: hidden;
}
.hero-carousel::before {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(76%, 520px);
	aspect-ratio: 1;
	border: 1px solid rgba(91, 89, 214, .24);
	border-radius: 50%;
	box-shadow: 0 0 0 28px rgba(91, 89, 214, .045), 0 0 0 56px rgba(233, 121, 88, .035);
	content: '';
	pointer-events: none;
	transform: translate(-50%, -49%) rotate(-14deg);
}
.hero-carousel::after {
	position: absolute;
	top: 21%;
	right: 15%;
	width: .55rem;
	height: .55rem;
	border: 2px solid var(--color-accent);
	border-radius: 50%;
	content: '';
	box-shadow: 0 0 0 7px rgba(233, 121, 88, .12);
}
.hero-carousel__topline, .hero-carousel__legend { z-index: 4; color: rgba(27, 27, 29, .42); }
.hero-carousel__stage { z-index: 2; inset: 12% 10% 19%; display: grid; place-items: center; }
.hero-carousel__slide { width: 100%; height: 100%; align-items: center; justify-content: center; }
.hero-carousel__slide .project-art {
	width: min(100%, 350px);
	height: auto;
	flex: 0 1 auto;
	aspect-ratio: 1;
	border: 8px solid rgba(247, 245, 240, .78);
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1.25rem 2.75rem rgba(27, 27, 29, .14), 0 0 0 1px rgba(27, 27, 29, .12);
	transform: none;
}
.hero-carousel__slide .project-art::after { opacity: .1; }
.hero-carousel__caption { width: min(100%, 350px); padding-top: .8rem; text-align: center; }
.hero-carousel__caption > div > span { color: rgba(27, 27, 29, .5); }
.hero-carousel__caption h2 { margin: .22rem 0 .2rem; color: var(--color-text); font-size: clamp(1.15rem, 1.8vw, 1.7rem); }
.hero-carousel__caption p { max-width: 270px; margin-inline: auto; color: rgba(27, 27, 29, .6); font-size: .75rem; }
.hero-carousel__counter { color: var(--color-cobalt); }
.hero-carousel__controls { z-index: 5; }
.hero-carousel__arrow { border-color: rgba(27, 27, 29, .22); background: rgba(247, 245, 240, .8); color: var(--color-text); }
.hero-carousel__arrow:hover, .hero-carousel__arrow:focus-visible { border-color: var(--color-cobalt); background: var(--color-cobalt); color: #fff; }
.hero-carousel__dot { border-color: rgba(27, 27, 29, .3); }
.hero-carousel__dot.is-active { border-color: var(--color-cobalt); background: var(--color-cobalt); }
.hero-carousel__legend a { color: var(--color-cobalt); }

/* Shared type scale: confident, never oversized. */
.manifesto__content h2, .section-heading h2 { font-size: clamp(2.25rem, 3.65vw, 4rem); line-height: 1.02; }
.manifesto__content > p { font-size: 1.02rem; }
.section-heading { margin-bottom: clamp(2.8rem, 5vw, 4.5rem); }
.section-heading__note { font-size: .86rem; }
.process-item h3 { font-size: clamp(1.4rem, 2.2vw, 2.2rem); }
.statement h2 { margin-block: 3.5rem 5rem; font-size: clamp(2.65rem, 4.8vw, 5rem); }
.final-cta h2 { margin-block: 3.5rem 5rem; font-size: clamp(2.9rem, 5.4vw, 5.7rem); }
.page-shell h1, .inner-page h1 { font-size: clamp(2.75rem, 5.2vw, 5.5rem); }
.case-hero h1 { font-size: clamp(3rem, 6.2vw, 6.4rem); }
.services-page__hero h1, .studio-hero__copy h1 { font-size: clamp(2.9rem, 5.4vw, 5.6rem); line-height: .96; }
.services-proof__intro h2, .studio-intro__copy h2, .studio-film__intro h2 { font-size: clamp(2.55rem, 4.2vw, 4.5rem); }
.services-page__cta h2 { margin-block: 3.5rem 5rem; font-size: clamp(2.9rem, 5.3vw, 5.6rem); }
.project-card__meta h3 { font-size: clamp(1.5rem, 2.3vw, 2.55rem); }

/* Lighter study introduction and restrained colour blocks. */
.studio-hero.section-cobalt { background: var(--color-background); color: var(--color-text); }
.studio-hero .studio-hero__copy .lead { color: rgba(27, 27, 29, .68); }
.studio-hero__media figcaption { color: rgba(27, 27, 29, .48); }
.studio-values.section-cobalt { background: var(--color-cobalt); }
.site-footer { padding-top: 4rem; background: #171719; }
.brand--footer .brand__mark { background: var(--color-text-light); color: var(--color-text); }
.brand--footer .brand__wordmark { color: var(--color-text-light); }

@media (max-width: 800px) {
	.site-header__inner { min-height: 68px; }
	.primary-nav { inset: 68px 0 0; background: var(--color-background); color: var(--color-text); }
	.primary-nav a { font-size: 1.95rem; }
	.hero { padding-top: 68px; }
	.hero__grid { min-height: auto; grid-template-columns: 1fr; gap: 0; padding-top: 1rem; }
	.hero__copy { padding-block: 4rem 2.5rem; }
	.hero h1 { font-size: clamp(2.65rem, 9.5vw, 4.35rem); }
	.hero-carousel { min-height: 116vw; border-radius: 18px; }
	.hero-carousel::before { width: 92%; }
	.hero-carousel::after { top: 20%; right: 11%; }
	.hero-carousel__topline, .hero-carousel__legend { right: 5%; left: 5%; font-size: .5rem; }
	.hero-carousel__stage { inset: 12% 7% 21%; }
	.hero-carousel__slide .project-art { width: min(76vw, 310px); border-width: 6px; }
	.hero-carousel__caption { width: min(76vw, 310px); }
	.hero-carousel__caption h2 { font-size: 1.2rem; }
	.hero-carousel__caption p { font-size: .7rem; }
	.manifesto__content h2, .section-heading h2 { font-size: clamp(2.25rem, 9.5vw, 4.2rem); }
	.services-page__hero h1, .studio-hero__copy h1, .page-shell h1, .inner-page h1 { font-size: clamp(2.7rem, 10.5vw, 5.1rem); }
}

/* Final colour direction: one warm orange family, with a typographic gradient. */
:root {
	--color-accent: #f07a49;
	--color-cobalt: #d85a36;
}

h1 em, h2 em, h3 em,
.section-dark h1 em, .section-ink h1 em, .section-dark h2 em, .section-ink h2 em, .section-cobalt h1 em, .section-cobalt h2 em {
	background: linear-gradient(100deg, #c94c2f 0%, #f07a49 52%, #ffad70 100%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
.hero h1 em, .accent-dot { background: linear-gradient(100deg, #c94c2f, #f07a49, #ffad70); background-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.section-cobalt, .studio-values.section-cobalt { background: linear-gradient(125deg, #c94c2f 0%, #e96942 52%, #f18a55 100%); }
.section-cobalt .eyebrow, .section-dark .eyebrow, .section-ink .eyebrow { color: var(--color-accent); }
.arrow-link__arrow, .hero .text-link--light span, .hero-carousel__legend a, .hero-carousel__counter { color: var(--color-cobalt); }
.hero-carousel::before { border-color: rgba(216, 90, 54, .24); box-shadow: 0 0 0 28px rgba(216, 90, 54, .045), 0 0 0 56px rgba(240, 122, 73, .035); }
.hero-carousel::after { border-color: var(--color-accent); box-shadow: 0 0 0 7px rgba(240, 122, 73, .12); }
.hero-carousel__dots .hero-carousel__dot.is-active { border-color: var(--color-cobalt); background: var(--color-cobalt); }
.hero-carousel__arrow:hover, .hero-carousel__arrow:focus-visible { border-color: var(--color-cobalt); background: var(--color-cobalt); }
.hero .button--light:hover, .header-cta:hover { border-color: var(--color-cobalt); background: var(--color-cobalt); }
.process-item__number { background: var(--color-cobalt); }
.capability-cloud span:nth-child(3n) { border-color: var(--color-cobalt); color: var(--color-cobalt); }
.capability-cloud span:nth-child(4n) { background: var(--color-cobalt); border-color: var(--color-cobalt); }
.portfolio-filter__button.is-active { background: var(--color-text); color: var(--color-background); }
.portfolio-filter__button.is-active span { color: var(--color-accent); }
.services .service-row__number, .services .service-row__arrow, .final-cta__email { color: var(--color-accent); }
.services .service-row:hover { background: rgba(240, 122, 73, .08); }

/* Recolour the product visuals so no violet/blue accent remains inside the work samples. */
.product-screen--nova .ui-dashboard h4 strong,
.product-screen--nova .ui-chart__line,
.product-screen--nova .ui-chart__line--two,
.product-screen--move .phone h4 em,
.product-screen--move .phone--small,
.product-screen--kora .kora-balance span,
.product-screen--kora .kora-list em,
.product-screen--pulse .pulse-orb,
.product-screen--pulse .pulse-content h4 em,
.product-screen--field .field-number,
.product-screen--field .field-content h4 em,
.product-screen--field .field-foot,
.project-art--nova .project-art__shape--one,
.project-art--nova .project-art__shape--two,
.project-art--move .project-art__shape--one,
.project-art--move .project-art__shape--two,
.project-art--north .project-art__shape--two { border-color: var(--color-cobalt); color: var(--color-cobalt); }
.product-screen--nova .ui-chart__line,
.product-screen--nova .ui-chart__line--two { border-top-color: var(--color-cobalt); }
.product-screen--move .phone--small { background: var(--color-cobalt); color: var(--color-background); box-shadow: 1rem 1rem 0 rgba(216, 90, 54, .18); }
.product-screen--move .phone__progress i,
.product-screen--move .phone__card,
.product-screen--move .phone__orb { background-color: var(--color-accent); border-color: var(--color-accent); }
.product-screen--move .phone__orb { background-color: transparent; box-shadow: inset 0 0 0 9px var(--color-cobalt); }
.product-screen--kora .kora-chart i,
.product-screen--kora .kora-chart i:nth-of-type(4) { background: var(--color-accent); }
.product-screen--pulse .pulse-orb { box-shadow: inset 0 0 0 16px rgba(216, 90, 54, .1); }
.product-screen--pulse .pulse-wave i { background: var(--color-accent); }
.product-screen--field .field-stamp { border-color: var(--color-accent); color: var(--color-accent); }
.project-art--nova .project-art__shape--one { background: var(--color-cobalt); }
.project-art--alma .project-art__shape--two { border-color: var(--color-cobalt); }
.project-art--move .project-art__shape--one { background: var(--color-cobalt); }
.project-art--north .project-art__shape--one { background: var(--color-accent); }
.product-screen--pulse { background: #f1dfd4; }
.legal-warning { background: rgba(240, 122, 73, .14); }

/* Interactive balance hero */
.hero-balance {
	position: relative;
	min-height: min(58vw, 620px);
	overflow: hidden;
	border: 1px solid rgba(27, 27, 29, .13);
	border-radius: 24px;
	background: radial-gradient(circle at var(--balance-glow-x, 50%) var(--balance-glow-y, 50%), rgba(240, 122, 73, .13), transparent 34%), #ebe7df;
	perspective: 1100px;
}
.hero-balance__topline, .hero-balance__legend {
	position: absolute;
	z-index: 4;
	right: 5%;
	left: 5%;
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	color: rgba(27, 27, 29, .42);
	font-family: monospace;
	font-size: .58rem;
	letter-spacing: .1em;
	text-transform: uppercase;
}
.hero-balance__topline { top: 4%; }
.hero-balance__legend { bottom: 3%; }
.balance-dashboard {
	position: absolute;
	z-index: 2;
	inset: 11% 6% 11%;
	overflow: hidden;
	border: 1px solid rgba(27, 27, 29, .14);
	border-radius: 15px;
	background: #fff;
	box-shadow: 0 1.5rem 3rem rgba(27, 27, 29, .13);
	transform: rotateX(var(--balance-rotate-x, 0deg)) rotateY(var(--balance-rotate-y, 0deg));
	transform-style: preserve-3d;
	transition: transform .22s ease-out;
	will-change: transform;
}
.balance-dashboard__topbar {
	display: flex;
	height: 34px;
	align-items: center;
	justify-content: space-between;
	gap: 1rem;
	padding: 0 .85rem;
	border-bottom: 1px solid rgba(27, 27, 29, .1);
	color: rgba(27, 27, 29, .46);
	font-family: monospace;
	font-size: .54rem;
	letter-spacing: .08em;
}
.balance-dashboard__dots { display: flex; gap: .25rem; }
.balance-dashboard__dots i { width: .34rem; height: .34rem; border-radius: 50%; background: rgba(27, 27, 29, .2); }
.balance-dashboard__status { display: flex; align-items: center; gap: .35rem; }
.balance-dashboard__status b { width: .36rem; height: .36rem; border-radius: 50%; background: var(--color-accent); }
.balance-dashboard__body { display: grid; height: calc(100% - 34px); grid-template-columns: 23% 77%; }
.balance-sidebar {
	display: flex;
	flex-direction: column;
	padding: 1.15rem 1rem;
	border-right: 1px solid rgba(27, 27, 29, .1);
	background: #f3f1ed;
}
.balance-sidebar > strong { color: var(--color-text); font-family: var(--font-display); font-size: 1.35rem; letter-spacing: -.09em; }
.balance-sidebar__label { margin-top: .35rem; color: rgba(27, 27, 29, .47); font-size: .62rem; line-height: 1.3; }
.balance-sidebar nav { display: grid; gap: .35rem; margin-top: 2.5rem; }
.balance-sidebar nav button { padding: .55rem .6rem; border: 0; border-left: 2px solid transparent; background: transparent; color: rgba(27, 27, 29, .48); cursor: pointer; font-family: var(--font-primary); font-size: .68rem; text-align: left; transition: background .2s ease, color .2s ease, border-color .2s ease; }
.balance-sidebar nav button:hover, .balance-sidebar nav button:focus-visible { color: var(--color-text); }
.balance-sidebar nav button.is-active { border-color: var(--color-cobalt); background: rgba(216, 90, 54, .09); color: var(--color-cobalt); font-weight: 700; }
.balance-sidebar__company { margin-top: auto; color: rgba(27, 27, 29, .44); font-family: monospace; font-size: .5rem; line-height: 1.5; }
.balance-sidebar__company b { color: rgba(27, 27, 29, .65); font-weight: 500; }
.balance-main { min-width: 0; padding: clamp(1rem, 2.2vw, 1.8rem); }
.balance-main__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.balance-kicker { display: block; color: rgba(27, 27, 29, .45); font-family: monospace; font-size: .56rem; letter-spacing: .08em; text-transform: uppercase; }
.balance-total { display: block; margin-top: .45rem; color: var(--color-text); font-family: var(--font-display); font-size: clamp(1.8rem, 3.3vw, 3.55rem); font-weight: 500; letter-spacing: -.09em; line-height: .95; }
.balance-delta { display: inline-flex; align-items: center; gap: .35rem; margin-top: .5rem; color: var(--color-cobalt); font-family: monospace; font-size: .58rem; }
.balance-delta small { color: rgba(27, 27, 29, .4); font-size: .52rem; }
.balance-mark { display: inline-grid; width: 2.3rem; height: 2.3rem; place-items: center; border: 1px solid rgba(216, 90, 54, .4); border-radius: 50%; color: var(--color-cobalt); font-family: var(--font-display); font-size: 1rem; }
.balance-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: .6rem; margin-top: 1.5rem; }
.balance-metrics article { padding-top: .55rem; border-top: 1px solid rgba(27, 27, 29, .13); }
.balance-metrics span { display: block; color: rgba(27, 27, 29, .43); font-family: monospace; font-size: .5rem; letter-spacing: .06em; text-transform: uppercase; }
.balance-metrics strong { display: block; margin-top: .35rem; color: var(--color-text); font-family: var(--font-display); font-size: clamp(.8rem, 1.25vw, 1.15rem); font-weight: 500; letter-spacing: -.05em; }
.balance-chart-wrap { margin-top: 1.3rem; }
.balance-chart__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: rgba(27, 27, 29, .45); font-family: monospace; font-size: .53rem; letter-spacing: .06em; text-transform: uppercase; }
.balance-chart__header strong { color: var(--color-cobalt); font-weight: 500; }
.balance-chart { position: relative; display: flex; height: clamp(120px, 14vw, 165px); align-items: flex-end; gap: .42rem; margin-top: .65rem; padding: .75rem .4rem 0; border-bottom: 1px solid rgba(27, 27, 29, .16); cursor: crosshair; }
.balance-chart__guide { position: absolute; right: 0; left: 0; height: 1px; border-top: 1px dashed rgba(27, 27, 29, .1); pointer-events: none; }
.balance-chart__guide--one { top: 33%; }.balance-chart__guide--two { top: 66%; }
.balance-chart i { position: relative; z-index: 1; display: block; min-width: 4px; height: var(--chart-height); flex: 1; border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, #f28a58, #d85a36); opacity: .72; transform-origin: bottom; transition: height .45s var(--ease), opacity .2s ease, transform .2s ease; }
.balance-chart i:hover, .balance-chart i.is-hovered { opacity: 1; transform: scaleX(1.18); }
.balance-chart__marker { position: absolute; z-index: 2; bottom: 0; left: 70%; width: 1px; height: 100%; background: rgba(216, 90, 54, .42); opacity: 0; pointer-events: none; transition: left .16s ease, opacity .18s ease; }
.balance-chart__marker::before { position: absolute; top: 0; left: 50%; width: .4rem; height: .4rem; border: 2px solid var(--color-cobalt); border-radius: 50%; background: #fff; content: ''; transform: translate(-50%, -50%); }
.balance-chart__marker.is-visible { opacity: 1; }
.balance-chart__tooltip { position: absolute; z-index: 3; top: .25rem; left: 70%; display: block; padding: .4rem .5rem; border: 1px solid rgba(27, 27, 29, .14); border-radius: 4px; background: rgba(255, 255, 255, .94); color: rgba(27, 27, 29, .55); font-family: monospace; font-size: .49rem; line-height: 1.35; pointer-events: none; transform: translateX(-50%); transition: left .16s ease; }
.balance-chart__tooltip strong { color: var(--color-cobalt); font-weight: 600; }
.balance-chart__axis { display: flex; justify-content: space-between; padding: .45rem .4rem 0; color: rgba(27, 27, 29, .35); font-family: monospace; font-size: .44rem; }
.balance-note { display: flex; align-items: center; gap: .5rem; margin-top: 1.25rem; padding-top: .65rem; border-top: 1px solid rgba(27, 27, 29, .1); color: rgba(27, 27, 29, .42); font-family: monospace; font-size: .5rem; }
.balance-note strong { color: var(--color-text); font-weight: 600; }
.balance-note > span:last-child { margin-left: auto; color: var(--color-cobalt); font-size: .9rem; }

@media (prefers-reduced-motion: reduce) {
	.balance-dashboard { transform: none !important; transition: none; }
}
@media (max-width: 800px) {
	.hero-balance { min-height: 116vw; border-radius: 18px; }
	.hero-balance__topline, .hero-balance__legend { right: 5%; left: 5%; font-size: .5rem; }
	.balance-dashboard { inset: 11% 5% 10%; }
	.balance-dashboard__body { grid-template-columns: 1fr; }
	.balance-sidebar { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .35rem .65rem; padding: .7rem .75rem; border-right: 0; border-bottom: 1px solid rgba(27, 27, 29, .1); }
	.balance-sidebar__label { margin: 0; }
	.balance-sidebar nav { display: flex; gap: .3rem; grid-column: 1 / -1; margin-top: .35rem; }
	.balance-sidebar nav button { flex: 1; padding: .38rem; text-align: center; }
	.balance-sidebar__company { display: none; }
	.balance-main { padding: .85rem; }
	.balance-total { font-size: clamp(1.65rem, 8vw, 2.8rem); }
	.balance-metrics { margin-top: 1rem; }
	.balance-metrics strong { font-size: .75rem; }
	.balance-chart { height: 116px; gap: .25rem; }
	.balance-note { margin-top: .8rem; }
}

/* Final contrast pass: petroleum blue replaces the low-contrast orange. */
:root {
	--color-accent: #49aaa4;
	--color-cobalt: #12616a;
}

h1 em, h2 em, h3 em,
.hero h1 em, .accent-dot {
	background: linear-gradient(100deg, #0a4d58 0%, #12616a 55%, #3a9d99 100%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
.section-dark h1 em, .section-ink h1 em, .section-dark h2 em, .section-ink h2 em, .section-cobalt h1 em, .section-cobalt h2 em {
	background: linear-gradient(100deg, #b7eee2 0%, #71cbc1 55%, #49aaa4 100%);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}
.section-cobalt, .studio-values.section-cobalt { background: linear-gradient(125deg, #0b414b 0%, #12616a 56%, #1d7a7c 100%); }
.section-dark .eyebrow, .section-ink .eyebrow, .section-cobalt .eyebrow { color: var(--color-accent); }
.hero .button--light:hover, .header-cta:hover { border-color: var(--color-cobalt); background: var(--color-cobalt); }
.process-item__number { background: var(--color-cobalt); }
.capability-cloud span:nth-child(3n) { border-color: var(--color-cobalt); color: var(--color-cobalt); }
.capability-cloud span:nth-child(4n) { background: var(--color-cobalt); border-color: var(--color-cobalt); }
.services .service-row:hover { background: rgba(73, 170, 164, .1); }
.legal-warning { border-left-color: var(--color-accent); background: rgba(73, 170, 164, .14); }

/* The interactive balance uses the same petroleum family. */
.hero-balance { background: radial-gradient(circle at var(--balance-glow-x, 50%) var(--balance-glow-y, 50%), rgba(73, 170, 164, .16), transparent 34%), #e7efeb; }
.balance-sidebar nav button.is-active { border-color: var(--color-cobalt); background: rgba(18, 97, 106, .09); color: var(--color-cobalt); }
.balance-mark { border-color: rgba(18, 97, 106, .4); color: var(--color-cobalt); }
.balance-delta, .balance-chart__header strong, .balance-note > span:last-child { color: var(--color-cobalt); }
.balance-chart i { background: linear-gradient(180deg, #5abeb5, #12616a); }
.balance-chart__marker { background: rgba(18, 97, 106, .42); }
.balance-chart__marker::before { border-color: var(--color-cobalt); }
.balance-chart__tooltip strong { color: var(--color-cobalt); }

/* Portfolio mockups keep a single coherent accent as well. */
.product-screen--alma .store-hero em,
.product-screen--alma .store-product__shape,
.project-art--alma .project-art__shape--one { background: var(--color-accent); }
.product-screen--alma .store-hero em { color: var(--color-cobalt); }
.project-art--move .project-art__shape--two { border-color: var(--color-accent); }
.product-screen--pulse { background: #e8efeb; }

/* Heading edge fix: keep the final glyphs of highlighted words fully visible. */
h1, h2, h3 {
	letter-spacing: -.045em;
	overflow: visible;
}

h1 em, h2 em, h3 em {
	display: inline-block;
	max-width: none;
	padding-inline-end: .08em;
	margin-inline-end: -.08em;
	overflow: visible;
	letter-spacing: -.045em;
}

@media (max-width: 800px) {
	h1, h2, h3 { letter-spacing: -.04em; }
	h1 em, h2 em, h3 em {
		padding-inline-end: .1em;
		margin-inline-end: -.1em;
		letter-spacing: -.04em;
	}
}

/* New hero: a product canvas with a tactile, restrained depth effect. */
.hero-product {
	position: relative;
	min-height: min(58vw, 620px);
	overflow: hidden;
	border: 1px solid rgba(18, 97, 106, .18);
	border-radius: 24px;
	background: radial-gradient(circle at var(--product-glow-x, 50%) var(--product-glow-y, 50%), rgba(73, 170, 164, .22), transparent 36%), linear-gradient(145deg, #eef5f1 0%, #dceae5 100%);
	color: #173f44;
	perspective: 1200px;
	isolation: isolate;
}
.hero-product::before { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(18, 97, 106, .045) 1px, transparent 1px), linear-gradient(90deg, rgba(18, 97, 106, .045) 1px, transparent 1px); background-size: 44px 44px; content: ''; mask-image: linear-gradient(to bottom, rgba(0,0,0,.7), transparent 78%); }
.hero-product::after { position: absolute; right: -14%; bottom: -34%; z-index: -1; width: 70%; height: 70%; border: 1px solid rgba(18, 97, 106, .14); border-radius: 50%; content: ''; transform: rotate(-18deg); }
.hero-product__topline, .hero-product__legend { position: absolute; z-index: 5; right: 5%; left: 5%; display: flex; justify-content: space-between; gap: 1rem; color: rgba(23, 63, 68, .55); font-family: monospace; font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; }
.hero-product__topline { top: 4%; }
.hero-product__legend { bottom: 3%; }
.hero-product__stage { position: absolute; inset: 12% 7% 11%; }
.hero-product__ring { position: absolute; display: block; border: 1px solid rgba(18, 97, 106, .22); border-radius: 50%; pointer-events: none; }
.hero-product__ring--one { top: 3%; right: 1%; width: 92%; height: 76%; transform: rotate(-17deg); }
.hero-product__ring--two { top: 10%; right: 8%; width: 78%; height: 62%; border-color: rgba(73, 170, 164, .38); transform: rotate(22deg); }
.hero-product__screen { position: absolute; z-index: 2; top: 10%; left: 7%; display: flex; width: 78%; height: 76%; flex-direction: column; overflow: hidden; border: 1px solid rgba(18, 97, 106, .2); border-radius: 14px; background: #fbfcf8; box-shadow: 1.4rem 1.6rem 0 rgba(18, 97, 106, .1), 0 1.8rem 4rem rgba(18, 63, 68, .14); transform: rotateX(var(--product-rotate-x, 0deg)) rotateY(var(--product-rotate-y, 0deg)); transform-style: preserve-3d; transition: transform .25s ease-out; will-change: transform; }
.hero-product__bar { display: flex; min-height: 34px; align-items: center; justify-content: space-between; gap: 1rem; padding: 0 .75rem; border-bottom: 1px solid rgba(18, 97, 106, .13); color: rgba(23, 63, 68, .54); font-family: monospace; font-size: .49rem; letter-spacing: .08em; }
.hero-product__dots { display: flex; gap: .22rem; }
.hero-product__dots i { width: .32rem; height: .32rem; border-radius: 50%; background: rgba(18, 97, 106, .24); }
.hero-product__bar b { color: var(--color-cobalt); font-size: .45rem; font-weight: 500; }
.hero-product__screen-body { display: grid; min-height: 0; flex: 1; grid-template-columns: 23% 77%; }
.hero-product__screen-body aside { display: flex; min-width: 0; flex-direction: column; gap: .68rem; padding: 1rem .75rem; background: #173f44; color: rgba(247, 250, 246, .58); font-size: .5rem; }
.hero-product__screen-body aside strong { margin-bottom: .55rem; color: #f7faf6; font-family: var(--font-display); font-size: 1rem; font-weight: 600; letter-spacing: -.07em; }
.hero-product__screen-body aside .is-active { color: #90dcd0; }
.hero-product__screen-body aside small { margin-top: auto; color: rgba(247, 250, 246, .38); font-family: monospace; font-size: .43rem; line-height: 1.45; }
.hero-product__content { min-width: 0; padding: clamp(1rem, 2vw, 1.8rem); }
.hero-product__content-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.hero-product__content-head > div > span { color: rgba(23, 63, 68, .46); font-family: monospace; font-size: .48rem; letter-spacing: .08em; }
.hero-product__content h2 { margin: .7rem 0 0; color: #173f44; font-size: clamp(1.55rem, 3.1vw, 3.25rem); line-height: .9; }
.hero-product__content h2 em { background: linear-gradient(100deg, #12616a, #49aaa4); background-clip: text; -webkit-background-clip: text; color: transparent; font-style: normal; -webkit-text-fill-color: transparent; }
.hero-product__avatar { display: grid; width: 2.2rem; height: 2.2rem; place-items: center; border: 1px solid rgba(18, 97, 106, .24); border-radius: 50%; color: var(--color-cobalt); font-family: var(--font-display); font-size: .75rem; }
.hero-product__chart { position: relative; display: flex; height: 37%; align-items: flex-end; gap: 4%; margin-top: 1.2rem; padding: 1.1rem .4rem .35rem; border-bottom: 1px solid rgba(18, 97, 106, .18); background: repeating-linear-gradient(0deg, transparent 0 25px, rgba(18, 97, 106, .07) 26px); }
.hero-product__chart::before { position: absolute; top: 15%; right: 0; left: 0; height: 1px; background: rgba(73, 170, 164, .5); content: ''; transform: rotate(-8deg); transform-origin: left; }
.hero-product__chart i { display: block; flex: 1; min-width: 4px; border-radius: 4px 4px 1px 1px; background: linear-gradient(180deg, #64c6bb, #12616a); opacity: .82; }
.hero-product__chart i:nth-child(1) { height: 35%; }.hero-product__chart i:nth-child(2) { height: 47%; }.hero-product__chart i:nth-child(3) { height: 40%; }.hero-product__chart i:nth-child(4) { height: 62%; }.hero-product__chart i:nth-child(5) { height: 72%; }.hero-product__chart i:nth-child(6) { height: 88%; }
.hero-product__chart > span { position: absolute; top: 12%; right: 14%; width: .48rem; height: .48rem; border: 2px solid #fbfcf8; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 0 5px rgba(73, 170, 164, .15); }
.hero-product__stats { display: flex; justify-content: space-between; gap: 1rem; margin-top: 1rem; color: rgba(23, 63, 68, .47); font-size: .52rem; }
.hero-product__stats b { display: block; margin-bottom: .25rem; color: #173f44; font-family: var(--font-display); font-size: 1rem; font-weight: 500; letter-spacing: -.05em; }
.hero-product__note { position: absolute; z-index: 4; display: flex; align-items: flex-start; gap: .6rem; padding: .75rem .85rem; border: 1px solid rgba(18, 97, 106, .18); border-radius: 8px; background: rgba(250, 252, 248, .86); box-shadow: .55rem .65rem 0 rgba(18, 97, 106, .08); backdrop-filter: blur(8px); }
.hero-product__note--top { top: 3%; right: 0; flex-direction: column; gap: .15rem; min-width: 132px; }
.hero-product__note--top > span { color: var(--color-cobalt); font-family: monospace; font-size: .5rem; }
.hero-product__note strong, .hero-product__note small { display: block; }
.hero-product__note strong { color: #173f44; font-family: var(--font-display); font-size: .68rem; font-weight: 600; letter-spacing: -.03em; }
.hero-product__note small { color: rgba(23, 63, 68, .5); font-size: .5rem; }
.hero-product__note--bottom { right: 3%; bottom: 0; align-items: center; }
.hero-product__note--bottom > div { min-width: 120px; }
.hero-product__note--bottom > span:last-child { margin-left: .3rem; color: var(--color-cobalt); font-size: 1rem; }
.hero-product__pulse { width: .5rem; height: .5rem; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 0 5px rgba(73, 170, 164, .16); }
@media (max-width: 800px) {
	.hero-product { min-height: 116vw; border-radius: 18px; }
	.hero-product__topline, .hero-product__legend { right: 5%; left: 5%; font-size: .5rem; }
	.hero-product__stage { inset: 13% 5% 11%; }
	.hero-product__screen { top: 14%; left: 2%; width: 92%; height: 67%; }
	.hero-product__screen-body aside { gap: .45rem; padding: .75rem .55rem; }
	.hero-product__screen-body aside small { display: none; }
	.hero-product__content { padding: .85rem; }
	.hero-product__content h2 { font-size: clamp(1.45rem, 7vw, 2.6rem); }
	.hero-product__note--top { top: 0; right: 0; transform: scale(.88); transform-origin: top right; }
	.hero-product__note--bottom { right: 0; bottom: 1%; transform: scale(.88); transform-origin: bottom right; }
	.hero-product__ring--one { width: 112%; right: -8%; }
	.hero-product__ring--two { width: 96%; right: -1%; }
}
@media (prefers-reduced-motion: reduce) { .hero-product__screen { transform: none; transition: none; } }

/* Hero direction: an interactive constellation of digital products. */
.hero-constellation {
	position: relative;
	min-height: min(58vw, 620px);
	overflow: hidden;
	border: 1px solid rgba(18, 97, 106, .2);
	border-radius: 24px;
	background: radial-gradient(circle at var(--constellation-glow-x, 55%) var(--constellation-glow-y, 45%), rgba(91, 195, 183, .28), transparent 32%), linear-gradient(145deg, #eaf3ee 0%, #d6e7e1 100%);
	color: #173f44;
	perspective: 1200px;
	isolation: isolate;
}
.hero-constellation::before { position: absolute; inset: 0; z-index: -1; background-image: linear-gradient(rgba(18, 97, 106, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(18, 97, 106, .06) 1px, transparent 1px); background-size: 42px 42px; content: ''; mask-image: radial-gradient(circle at 55% 48%, #000 0%, rgba(0,0,0,.7) 38%, transparent 76%); }
.hero-constellation::after { position: absolute; right: -13%; bottom: -34%; z-index: -1; width: 65%; height: 62%; border: 1px solid rgba(18, 97, 106, .18); border-radius: 50%; content: ''; transform: rotate(-22deg); }
.hero-constellation__topline, .hero-constellation__legend { position: absolute; z-index: 7; right: 5%; left: 5%; display: flex; justify-content: space-between; gap: 1rem; color: rgba(23, 63, 68, .56); font-family: monospace; font-size: .58rem; letter-spacing: .1em; text-transform: uppercase; pointer-events: none; }
.hero-constellation__topline { top: 4%; }
.hero-constellation__legend { bottom: 3%; }
.hero-constellation__stage { position: absolute; inset: 12% 6% 11%; transform: rotateX(var(--constellation-rotate-x, 0deg)) rotateY(var(--constellation-rotate-y, 0deg)); transform-style: preserve-3d; transition: transform .3s ease-out; will-change: transform; }
.hero-constellation__stage::before, .hero-constellation__stage::after { position: absolute; z-index: 0; background: rgba(18, 97, 106, .2); content: ''; pointer-events: none; }
.hero-constellation__stage::before { top: 17%; right: 12%; width: 21%; height: 1px; transform: rotate(26deg); transform-origin: right; }
.hero-constellation__stage::after { right: 34%; bottom: 17%; width: 1px; height: 20%; transform: rotate(30deg); transform-origin: bottom; }
.hero-constellation__halo { position: absolute; z-index: 0; display: block; border: 1px solid rgba(18, 97, 106, .22); border-radius: 50%; pointer-events: none; }
.hero-constellation__halo--one { top: 9%; right: 2%; width: 87%; height: 78%; transform: rotate(-16deg); }
.hero-constellation__halo--two { top: 17%; right: 12%; width: 70%; height: 59%; border-color: rgba(73, 170, 164, .45); transform: rotate(23deg); }
.hero-constellation__cross { position: absolute; z-index: 1; color: var(--color-cobalt); font-family: monospace; font-size: 1rem; font-weight: 400; }
.hero-constellation__cross--one { top: 5%; right: 9%; }
.hero-constellation__cross--two { right: 5%; bottom: 12%; }
.hero-constellation__core { position: absolute; z-index: 3; top: 12%; left: 22%; display: flex; width: 55%; height: 74%; flex-direction: column; overflow: hidden; padding: clamp(1rem, 2vw, 1.55rem); border: 1px solid rgba(183, 238, 228, .22); border-radius: 14px; background: linear-gradient(145deg, #173f44 0%, #12616a 100%); box-shadow: 1.25rem 1.35rem 0 rgba(18, 97, 106, .13), 0 1.8rem 3.5rem rgba(18, 63, 68, .19); color: #f7faf6; }
.hero-constellation__core::before { position: absolute; right: -20%; bottom: -28%; width: 70%; height: 60%; border: 1px solid rgba(183, 238, 228, .18); border-radius: 50%; content: ''; transform: rotate(-24deg); }
.hero-constellation__core-top, .hero-constellation__core-bottom { position: relative; z-index: 1; display: flex; justify-content: space-between; gap: 1rem; color: rgba(247, 250, 246, .54); font-family: monospace; font-size: .48rem; letter-spacing: .08em; }
.hero-constellation__live { color: #a5e5d9; }
.hero-constellation__live i { display: inline-block; width: .34rem; height: .34rem; margin-right: .25rem; border-radius: 50%; background: #a5e5d9; box-shadow: 0 0 .45rem rgba(165, 229, 217, .8); vertical-align: -.02em; }
.hero-constellation__core-mark { position: relative; z-index: 1; display: grid; width: clamp(3.2rem, 6vw, 5.5rem); height: clamp(3.2rem, 6vw, 5.5rem); margin: auto 0 1rem; place-items: center; border: 1px solid rgba(183, 238, 228, .45); border-radius: 50%; color: #a5e5d9; font-family: var(--font-display); font-size: clamp(1.7rem, 3vw, 2.8rem); font-weight: 500; line-height: 1; }
.hero-constellation__core-mark::after { position: absolute; inset: .38rem; border: 1px solid rgba(183, 238, 228, .2); border-radius: 50%; content: ''; }
.hero-constellation__core-copy { position: relative; z-index: 1; }
.hero-constellation__core-copy > span { color: #a5e5d9; font-family: monospace; font-size: .5rem; letter-spacing: .1em; }
.hero-constellation__core-copy h2 { max-width: 8ch; margin: .55rem 0 .7rem; color: #f7faf6; font-size: clamp(1.7rem, 3.3vw, 3.6rem); line-height: .9; }
.hero-constellation__core-copy h2 em { background: linear-gradient(100deg, #a5e5d9 0%, #64c6bb 100%); background-clip: text; -webkit-background-clip: text; color: transparent; font-style: normal; -webkit-text-fill-color: transparent; }
.hero-constellation__core-copy p { max-width: 250px; margin: 0; color: rgba(247, 250, 246, .64); font-size: .62rem; line-height: 1.5; }
.hero-constellation__core-bottom { margin-top: auto; color: rgba(247, 250, 246, .45); }
.hero-constellation__core-bottom > span:last-child { color: #a5e5d9; font-family: var(--font-display); font-size: .8rem; letter-spacing: -.04em; }
.hero-constellation__module { position: absolute; z-index: 4; display: flex; min-height: 106px; flex-direction: column; align-items: flex-start; padding: .8rem .85rem; border: 1px solid rgba(18, 97, 106, .2); border-radius: 9px; background: rgba(250, 252, 248, .9); box-shadow: .6rem .7rem 0 rgba(18, 97, 106, .08); color: #173f44; cursor: pointer; text-align: left; transition: border-color .25s ease, background .25s ease, box-shadow .25s ease, color .25s ease, transform .25s ease; }
.hero-constellation__module:hover, .hero-constellation__module:focus-visible { border-color: var(--color-cobalt); box-shadow: .35rem .4rem 0 rgba(18, 97, 106, .12); transform: translateY(-4px); }
.hero-constellation__module.is-active { border-color: #12616a; background: #12616a; color: #f7faf6; box-shadow: .45rem .55rem 0 rgba(18, 97, 106, .18); }
.hero-constellation__module > span { color: var(--color-cobalt); font-family: monospace; font-size: .48rem; }
.hero-constellation__module.is-active > span, .hero-constellation__module.is-active > b { color: #a5e5d9; }
.hero-constellation__module strong { margin-top: .45rem; font-family: var(--font-display); font-size: .72rem; font-weight: 600; letter-spacing: -.04em; }
.hero-constellation__module small { max-width: 120px; margin-top: .18rem; color: rgba(23, 63, 68, .55); font-size: .5rem; line-height: 1.25; }
.hero-constellation__module.is-active small { color: rgba(247, 250, 246, .6); }
.hero-constellation__module b { position: absolute; right: .75rem; bottom: .7rem; color: var(--color-cobalt); font-size: .8rem; font-weight: 400; }
.hero-constellation__module--web { top: 8%; left: 0; width: 28%; }
.hero-constellation__module--app { top: 4%; right: 0; width: 28%; }
.hero-constellation__module--platform { right: 1%; bottom: 2%; width: 38%; }
@media (max-width: 800px) {
	.hero-constellation { min-height: 116vw; border-radius: 18px; }
	.hero-constellation__topline, .hero-constellation__legend { right: 5%; left: 5%; font-size: .5rem; }
	.hero-constellation__stage { inset: 13% 5% 10%; }
	.hero-constellation__core { top: 15%; left: 12%; width: 70%; height: 62%; padding: .85rem; }
	.hero-constellation__core-mark { margin-top: .9rem; margin-bottom: .7rem; }
	.hero-constellation__core-copy h2 { font-size: clamp(1.45rem, 7vw, 2.6rem); }
	.hero-constellation__core-copy p { max-width: 190px; font-size: .56rem; }
	.hero-constellation__module { min-height: 82px; padding: .55rem .6rem; }
	.hero-constellation__module strong { margin-top: .3rem; font-size: .6rem; }
	.hero-constellation__module small { max-width: 90px; font-size: .43rem; }
	.hero-constellation__module b { right: .55rem; bottom: .5rem; font-size: .65rem; }
	.hero-constellation__module--web { top: 5%; left: 0; width: 32%; }
	.hero-constellation__module--app { top: 1%; right: 0; width: 32%; }
	.hero-constellation__module--platform { right: 0; bottom: 2%; width: 45%; }
}
@media (prefers-reduced-motion: reduce) { .hero-constellation__stage { transform: none; transition: none; } }

/* Refined interaction: every product type changes the hero's visual state. */
.hero-constellation__core-bottom { display: block; }
.hero-constellation__core-bottom > div { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.hero-constellation__core-bottom > i { position: relative; display: block; height: 2px; margin-top: .65rem; overflow: hidden; background: rgba(247, 250, 246, .16); }
.hero-constellation__core-bottom > i::after { display: block; width: var(--constellation-meter, 72%); height: 100%; background: linear-gradient(90deg, #64c6bb, #a5e5d9); content: ''; transition: width .5s var(--ease); }
.hero-constellation__core.is-changing .hero-constellation__core-copy { animation: constellation-copy-in .42s var(--ease); }
.hero-constellation__core.is-changing .hero-constellation__core-mark { animation: constellation-mark-in .42s var(--ease); }
.hero-constellation[data-constellation-theme="app"] { background: radial-gradient(circle at var(--constellation-glow-x, 55%) var(--constellation-glow-y, 45%), rgba(91, 183, 195, .3), transparent 34%), linear-gradient(145deg, #e8f2f2 0%, #d5e4e6 100%); }
.hero-constellation[data-constellation-theme="app"] .hero-constellation__core { background: linear-gradient(145deg, #163b49 0%, #285f6d 100%); }
.hero-constellation[data-constellation-theme="platform"] { background: radial-gradient(circle at var(--constellation-glow-x, 55%) var(--constellation-glow-y, 45%), rgba(97, 187, 159, .3), transparent 34%), linear-gradient(145deg, #edf3ec 0%, #d8e6dc 100%); }
.hero-constellation[data-constellation-theme="platform"] .hero-constellation__core { background: linear-gradient(145deg, #173f44 0%, #2e716f 100%); }
.hero-constellation[data-constellation-theme="app"] .hero-constellation__module.is-active { background: #285f6d; border-color: #285f6d; }
.hero-constellation[data-constellation-theme="platform"] .hero-constellation__module.is-active { background: #2e716f; border-color: #2e716f; }
@keyframes constellation-copy-in { from { opacity: .28; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes constellation-mark-in { from { transform: scale(.86) rotate(-8deg); } to { transform: scale(1) rotate(0); } }
@media (prefers-reduced-motion: reduce) {
	.hero-constellation__core.is-changing .hero-constellation__core-copy,
	.hero-constellation__core.is-changing .hero-constellation__core-mark { animation: none; }
}

/* Unified hero background: one calm surface across the full first screen. */
.hero, .hero.section-light,
.hero-constellation,
.hero-constellation[data-constellation-theme="app"],
.hero-constellation[data-constellation-theme="platform"] {
	background: #e5efea;
}
.hero-constellation::before { display: none; }

/* Keep the central words intact and give the platform module its own space. */
.hero-constellation__core-copy h2 { max-width: 100%; overflow: visible; }
.hero-constellation__core-copy h2 em { white-space: nowrap; }
.hero-constellation__module--platform { bottom: -10%; }
@media (max-width: 800px) {
	.hero-constellation__module--platform { bottom: -10%; }
}

/* Fine positioning of the three interactive modules. */
.hero-constellation__module--web { left: -1.5%; }
.hero-constellation__module--app { right: -1.5%; }
.hero-constellation__module--platform { right: 7%; bottom: -6%; }
@media (max-width: 800px) {
	.hero-constellation__module--web { left: -2%; }
	.hero-constellation__module--app { right: -2%; }
	.hero-constellation__module--platform { right: 6%; bottom: -6%; }
}

/* Mobile balance: lift the platform card while keeping clear separation from the core. */
@media (max-width: 800px) {
	.hero-constellation__core { height: 56%; }
	.hero-constellation__module--platform { right: 6%; bottom: 2%; }
}

/* Subtle ambient motion inside the hero. */
.hero-constellation__halo--two { animation: hero-halo-breathe 6s ease-in-out infinite; }
.hero-constellation__live i { animation: hero-live-pulse 2.2s ease-in-out infinite; }
.hero-constellation__core-mark::before { position: absolute; inset: -.7rem; border: 1px solid rgba(165, 229, 217, .18); border-radius: 50%; content: ''; animation: hero-core-pulse 3.2s ease-in-out infinite; }
.hero-constellation__core-bottom > i::after { background-size: 220% 100%; animation: hero-progress-glint 4s linear infinite; }
@keyframes hero-halo-breathe {
	0%, 100% { opacity: .48; transform: rotate(23deg) scale(1); }
	50% { opacity: .85; transform: rotate(23deg) scale(1.035); }
}
@keyframes hero-live-pulse {
	0%, 100% { opacity: .65; transform: scale(.9); }
	50% { opacity: 1; transform: scale(1.15); }
}
@keyframes hero-core-pulse {
	0%, 100% { opacity: .25; transform: scale(.94); }
	50% { opacity: .7; transform: scale(1.04); }
}
@keyframes hero-progress-glint { from { background-position: 100% 0; } to { background-position: -100% 0; } }
@media (prefers-reduced-motion: reduce) {
	.hero-constellation__halo--two,
	.hero-constellation__live i,
	.hero-constellation__core-mark::before,
	.hero-constellation__core-bottom > i::after { animation: none; }
}

/* Final word-fit pass for the central interactive message. */
.hero-constellation__core { overflow: visible; }
.hero-constellation__core-copy { min-width: 0; overflow: visible; }
.hero-constellation__core-copy h2 {
	max-width: none;
	font-size: clamp(1.5rem, 2.9vw, 3.1rem);
	white-space: normal;
}
.hero-constellation__core-copy h2 em {
	display: inline-block;
	padding-inline-end: .14em;
	margin-inline-end: -.14em;
	white-space: nowrap;
}
@media (max-width: 800px) {
	.hero-constellation__core-copy h2 { font-size: clamp(1.35rem, 6.2vw, 2.35rem); }
}

/* Readability pass: larger brand, navigation and supporting copy without changing header height. */
.site-header__inner { min-height: 72px; }
.brand__wordmark { font-size: 1.52em; letter-spacing: -.105em; }
.brand--footer .brand__wordmark { font-size: 1.4em; }

.primary-nav { font-size: .92rem; }
.header-cta { font-size: .84rem; }
.eyebrow { font-size: .78rem; }
.section-heading__note { font-size: .96rem; }
.section-end__label { font-size: .7rem; }
.hero__signature { font-size: .66rem; }
.hero-rail__label, .hero-rail__signal { font-size: .68rem; }
.project-card__description { font-size: .98rem; }
.service-row p, .process-item p { font-size: 1rem; }
.form-field label { font-size: .84rem; }
.form-disclaimer { font-size: .8rem; }
.testimonial-card footer { font-size: .72rem; }
.content-note { font-size: .84rem; }
.timeline-card > span { font-size: .72rem; }
.timeline-card p { font-size: .96rem; }
.footer-tagline { font-size: 1rem; }
.footer-nav, .footer-social { font-size: .9rem; }
.footer-email { font-size: .92rem; }
.footer-copy { font-size: .78rem; }
.footer-legal { font-size: .78rem; }
.case-client { font-size: .98rem; }
.studio-principles span { font-size: .82rem; }
.hero-constellation__topline, .hero-constellation__legend { font-size: .62rem; }
.hero-constellation__core-top, .hero-constellation__core-bottom { font-size: .52rem; }
.hero-constellation__core-copy > span { font-size: .54rem; }
.hero-constellation__core-copy p { font-size: .68rem; }
.hero-constellation__module > span { font-size: .52rem; }
.hero-constellation__module small { font-size: .56rem; }
@media (max-width: 800px) {
	.primary-nav { font-size: 2rem; }
	.hero-constellation__topline, .hero-constellation__legend { font-size: .54rem; }
	.hero-constellation__core-copy p { font-size: .61rem; }
	.hero-constellation__module small { font-size: .48rem; }
}

/* Use the supplied CREAIWE artwork as the shared header/footer wordmark. */
.brand__logo {
	display: block;
	width: 11.5rem;
	height: auto;
}
.brand--footer .brand__logo {
	width: 16rem;
	filter: brightness(0) invert(1);
}
@media (max-width: 800px) {
	.brand__logo { width: 9.4rem; }
	.brand--footer .brand__logo { width: 13.5rem; }
}

/* Hero product system: a more expressive Web / App / Plataforma panel. */
.hero-constellation {
	border-color: rgba(49, 88, 232, .18);
	background:
		radial-gradient(circle at 78% 18%, rgba(25, 216, 255, .2), transparent 28%),
		radial-gradient(circle at 18% 82%, rgba(155, 69, 244, .15), transparent 34%),
		linear-gradient(135deg, #f9fcff 0%, #edf4ff 56%, #f6efff 100%);
	box-shadow: 0 2rem 5rem rgba(49, 88, 232, .12), inset 0 1px 0 rgba(255, 255, 255, .9);
	color: #14265d;
}
.hero-constellation::before {
	background-image: linear-gradient(rgba(49, 88, 232, .055) 1px, transparent 1px), linear-gradient(90deg, rgba(49, 88, 232, .055) 1px, transparent 1px);
	background-size: 44px 44px;
}
.hero-constellation::after { border-color: rgba(155, 69, 244, .23); }
.hero-constellation__topline, .hero-constellation__legend { color: rgba(49, 88, 232, .62); }
.hero-constellation__stage::before, .hero-constellation__stage::after { background: rgba(49, 88, 232, .2); }
.hero-constellation__halo { border-color: rgba(49, 88, 232, .2); }
.hero-constellation__halo--two { border-color: rgba(25, 166, 255, .5); }
.hero-constellation__cross { color: #3158e8; }

.hero-constellation__core {
	border-color: rgba(155, 190, 255, .45);
	background: radial-gradient(circle at 78% 18%, rgba(25, 216, 255, .28), transparent 31%), linear-gradient(145deg, #101c49 0%, #244bd4 56%, #6338c6 100%);
	box-shadow: 1.2rem 1.35rem 0 rgba(49, 88, 232, .1), 0 1.8rem 3.5rem rgba(49, 88, 232, .22);
}
.hero-constellation__core::before { border-color: rgba(155, 208, 255, .25); }
.hero-constellation__core-mark {
	border: 0;
	background: var(--brand-gradient);
	background-size: 200% 200%;
	box-shadow: 0 .8rem 1.7rem rgba(25, 125, 255, .28);
	color: #fff;
	animation: hero-brand-shift 6s ease-in-out infinite;
}
.hero-constellation__core-mark::after { border-color: rgba(255, 255, 255, .42); }
.hero-constellation__core-mark::before { border-color: rgba(133, 229, 255, .28); }
.hero-constellation__core-copy > span, .hero-constellation__live { color: #9beeff; }
.hero-constellation__live i { background: #9beeff; box-shadow: 0 0 .45rem rgba(25, 216, 255, .9); }
.hero-constellation__core-copy h2 em { background: var(--brand-gradient-light); background-clip: text; -webkit-background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }
.hero-constellation__core-bottom > i::after { background: var(--brand-gradient); }
.hero-constellation__core-bottom > span:last-child { color: #9beeff; }

.hero-constellation__module {
	border-color: rgba(49, 88, 232, .16);
	background: rgba(255, 255, 255, .84);
	box-shadow: .7rem .8rem 0 rgba(49, 88, 232, .08), 0 .8rem 2rem rgba(49, 88, 232, .08);
	backdrop-filter: blur(12px);
	color: #14265d;
}
.hero-constellation__module:hover, .hero-constellation__module:focus-visible {
	border-color: #3158e8;
	box-shadow: .35rem .45rem 0 rgba(49, 88, 232, .12), 0 1rem 2rem rgba(49, 88, 232, .12);
}
.hero-constellation__module.is-active {
	border-color: transparent;
	background: linear-gradient(135deg, #1a55dc 0%, #5339c9 100%);
	box-shadow: .45rem .55rem 0 rgba(49, 88, 232, .18), 0 1rem 2rem rgba(49, 88, 232, .18);
	color: #fff;
}
.hero-constellation__module > span, .hero-constellation__module b { color: #3158e8; }
.hero-constellation__module.is-active > span, .hero-constellation__module.is-active > b { color: #9beeff; }
.hero-constellation__module small { color: rgba(20, 38, 93, .58); }
.hero-constellation__module.is-active small { color: rgba(255, 255, 255, .7); }

@keyframes hero-brand-shift {
	0%, 100% { background-position: 0% 50%; }
	50% { background-position: 100% 50%; }
}

@media (max-width: 800px) {
	.hero-constellation { border-radius: 20px; box-shadow: 0 1.2rem 3rem rgba(49, 88, 232, .12); }
	.hero-constellation__core { top: 14%; left: 10%; width: 74%; height: 58%; }
	.hero-constellation__module--web { left: -1%; width: 34%; }
	.hero-constellation__module--app { right: -1%; width: 34%; }
	.hero-constellation__module--platform { right: 4%; bottom: 2%; width: 48%; }
}

@media (prefers-reduced-motion: reduce) {
	.hero-constellation__core-mark { animation: none; }
}

/* Ambient motion: the product cards float like a living system. */
.hero-constellation__module {
	animation: hero-module-float 6s ease-in-out infinite;
}
.hero-constellation__module--app { animation-delay: -1.7s; }
.hero-constellation__module--platform { animation-delay: -3.2s; }
.hero-constellation__module:hover,
.hero-constellation__module:focus-visible {
	animation: none;
	transform: translateY(-7px);
}
.hero-constellation__core::after {
	position: absolute;
	top: 18%;
	right: 12%;
	width: .42rem;
	height: .42rem;
	border-radius: 50%;
	background: #9beeff;
	box-shadow: 0 0 .4rem rgba(25, 216, 255, .95), 0 0 1.1rem rgba(25, 125, 255, .65);
	content: '';
	pointer-events: none;
	animation: hero-signal-orbit 8s ease-in-out infinite;
}
@keyframes hero-module-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-6px); }
}
@keyframes hero-signal-orbit {
	0%, 100% { top: 18%; right: 12%; opacity: .55; }
	25% { top: 18%; right: 72%; opacity: 1; }
	50% { top: 72%; right: 72%; opacity: .7; }
	75% { top: 72%; right: 12%; opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
	.hero-constellation__module,
	.hero-constellation__core::after { animation: none; }
}

/* Stable cards and brand-color states for App and Plataforma. */
.hero-constellation__module,
.hero-constellation__module--app,
.hero-constellation__module--platform {
	animation: none !important;
}
.hero-constellation[data-constellation-theme="app"] {
	background: radial-gradient(circle at var(--constellation-glow-x, 55%) var(--constellation-glow-y, 45%), rgba(25, 216, 255, .2), transparent 34%), linear-gradient(145deg, #eefaff 0%, #e7efff 54%, #f3edff 100%);
}
.hero-constellation[data-constellation-theme="platform"] {
	background: radial-gradient(circle at var(--constellation-glow-x, 55%) var(--constellation-glow-y, 45%), rgba(155, 69, 244, .18), transparent 34%), linear-gradient(145deg, #f0f4ff 0%, #e8edff 54%, #f8edff 100%);
}
.hero-constellation[data-constellation-theme="app"] .hero-constellation__core {
	background: radial-gradient(circle at 78% 18%, rgba(25, 216, 255, .34), transparent 31%), linear-gradient(145deg, #10245d 0%, #176fd5 56%, #2c7cff 100%);
}
.hero-constellation[data-constellation-theme="platform"] .hero-constellation__core {
	background: radial-gradient(circle at 78% 18%, rgba(155, 69, 244, .32), transparent 31%), linear-gradient(145deg, #151c59 0%, #3158e8 52%, #8a42dc 100%);
}
.hero-constellation[data-constellation-theme="app"] .hero-constellation__module.is-active {
	border-color: transparent;
	background: linear-gradient(135deg, #12d8f4 0%, #266eff 100%);
}
.hero-constellation[data-constellation-theme="platform"] .hero-constellation__module.is-active {
	border-color: transparent;
	background: linear-gradient(135deg, #3158e8 0%, #9b45f4 100%);
}

/* Brand gradient: typography accents now echo the blue spectrum of the logo. */
:root {
	--color-accent: #4d8cff;
	--color-cobalt: #3158e8;
	--brand-gradient: linear-gradient(105deg, #19d8ff 0%, #2c7cff 48%, #9b45f4 100%);
	--brand-gradient-light: linear-gradient(105deg, #9beeff 0%, #79aaff 48%, #d5a0ff 100%);
}

h1 em, h2 em, h3 em,
.hero h1 em, .accent-dot {
	background: var(--brand-gradient);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.section-dark h1 em, .section-ink h1 em,
.section-dark h2 em, .section-ink h2 em,
.section-cobalt h1 em, .section-cobalt h2 em {
	background: var(--brand-gradient-light);
	background-clip: text;
	-webkit-background-clip: text;
	color: transparent;
	-webkit-text-fill-color: transparent;
}

.section-cobalt,
.studio-values.section-cobalt {
	background: linear-gradient(125deg, #142e82 0%, #3158e8 56%, #6941c9 100%);
}

.section-dark .eyebrow, .section-ink .eyebrow,
.section-cobalt .eyebrow { color: #77dfff; }
.hero .button--light:hover, .header-cta:hover {
	border-color: #3158e8;
	background: #3158e8;
}
.process-item__number { background: #3158e8; }
.capability-cloud span:nth-child(3n) { border-color: #3158e8; color: #3158e8; }
.capability-cloud span:nth-child(4n) { background: #3158e8; border-color: #3158e8; }
.services .service-row:hover { background: rgba(49, 88, 232, .1); }

/* Hero concept: de idea a producto. */
.hero { background: var(--color-background); }
.hero::after { display: none; }
.hero__grid > .hero-constellation { display: none; }
.hero-product-orbit {
	position: relative;
	grid-column: 2;
	grid-row: 1;
	min-height: min(65vw, 700px);
	overflow: visible;
	isolation: isolate;
}
.hero-product-orbit::before { display: none; }
.hero-product-orbit::after {
	position: absolute;
	inset: 7% -5% 8% -4%;
	z-index: -2;
	border-radius: 50%;
	background: radial-gradient(circle at var(--orbit-glow-x, 52%) var(--orbit-glow-y, 46%), rgba(53, 205, 255, .2), transparent 21%), radial-gradient(circle at 76% 74%, rgba(255, 102, 183, .12), transparent 28%), radial-gradient(circle at 28% 20%, rgba(255, 163, 62, .11), transparent 24%);
	content: '';
	filter: blur(3px);
	transition: background .5s ease;
}
.hero-product-orbit__backdrop { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.hero-product-orbit__backdrop::before { position: absolute; inset: 10% 2% 13%; background-image: linear-gradient(rgba(38, 68, 94, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(38, 68, 94, .06) 1px, transparent 1px); background-size: 32px 32px; content: ''; mask-image: radial-gradient(circle at 55% 50%, #000 0%, rgba(0,0,0,.65) 36%, transparent 72%); }
.hero-product-orbit__backdrop > span { position: absolute; top: 13%; right: -9%; color: rgba(16, 41, 61, .045); font-family: var(--font-display); font-size: clamp(3.8rem, 8vw, 8rem); font-weight: 600; letter-spacing: -.1em; line-height: .78; text-align: right; transform: rotate(-8deg); }
.hero-product-orbit__backdrop > i { position: absolute; right: 8%; bottom: 17%; width: 6rem; height: 6rem; border: 1px solid rgba(24, 97, 116, .16); border-radius: 50%; }
.hero-product-orbit__stage { position: absolute; inset: 6% 3% 12%; perspective: 1000px; transform: perspective(1000px) rotateX(var(--orbit-rotate-x, 0deg)) rotateY(var(--orbit-rotate-y, 0deg)); transform-style: preserve-3d; transition: transform .35s var(--ease); will-change: transform; }
.hero-product-orbit__ring { position: absolute; z-index: 0; display: block; border: 1px solid rgba(42, 117, 151, .23); border-radius: 50%; pointer-events: none; }
.hero-product-orbit__ring--one { top: 20%; left: 16%; width: 68%; height: 45%; transform: rotate(-17deg); }
.hero-product-orbit__ring--two { top: 9%; left: 29%; width: 42%; height: 80%; border-color: rgba(194, 60, 153, .22); transform: rotate(28deg); }
.hero-product-orbit__ring--one::after, .hero-product-orbit__ring--two::after { position: absolute; width: .45rem; height: .45rem; border-radius: 50%; background: #2cc9ee; box-shadow: 0 0 .8rem rgba(44, 201, 238, .7); content: ''; }
.hero-product-orbit__ring--one::after { top: 11%; right: 9%; }
.hero-product-orbit__ring--two::after { right: 12%; bottom: 13%; background: #eb5cba; box-shadow: 0 0 .8rem rgba(235, 92, 186, .65); }
.hero-product-orbit__spark { position: absolute; z-index: 1; color: #2a92e8; font-family: monospace; font-size: 1rem; }
.hero-product-orbit__spark--one { top: 10%; right: 8%; }
.hero-product-orbit__spark--two { bottom: 16%; left: 8%; color: #ec6a9f; }
.hero-product-orbit__core { position: absolute; top: 43%; left: 50%; z-index: 4; display: flex; width: clamp(11rem, 17vw, 16rem); aspect-ratio: 1; flex-direction: column; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; background: radial-gradient(circle at 31% 22%, #45e4f2 0%, #297de9 34%, #4b39d7 65%, #a536bd 100%); box-shadow: 0 1.4rem 3rem rgba(43, 79, 190, .2), inset .75rem .7rem 1.7rem rgba(255,255,255,.25), inset -.8rem -1.2rem 1.8rem rgba(55, 12, 140, .35); color: #fff; transform: translate(-50%, -50%); transition: background .5s ease, box-shadow .5s ease; }
.hero-product-orbit__core::before { position: absolute; inset: -.85rem; border: 1px solid rgba(62, 150, 240, .45); border-radius: 50%; content: ''; }
.hero-product-orbit__core::after { position: absolute; top: 13%; left: 20%; width: 26%; height: 13%; border-radius: 50%; background: rgba(255,255,255,.3); content: ''; filter: blur(7px); transform: rotate(-28deg); }
.hero-product-orbit__core-index { position: absolute; top: 18%; color: rgba(255,255,255,.66); font-family: monospace; font-size: .62rem; letter-spacing: .12em; }
.hero-product-orbit__core-glow { position: absolute; inset: 28%; border: 1px solid rgba(255,255,255,.42); border-radius: 50%; box-shadow: 0 0 2rem rgba(255,255,255,.16); }
.hero-product-orbit__core > strong { position: relative; z-index: 1; font-family: var(--font-display); font-size: clamp(1.25rem, 2.5vw, 2.25rem); font-weight: 600; letter-spacing: -.08em; }
.hero-product-orbit__core-logo { position: relative; z-index: 1; display: block; width: clamp(6.8rem, 10vw, 9.8rem); height: auto; filter: brightness(0) invert(1); }
.hero-product-orbit__core-caption { position: relative; z-index: 1; margin-top: .3rem; color: rgba(255,255,255,.72); font-family: monospace; font-size: .62rem; letter-spacing: .12em; }
.hero-product-orbit__core > b { position: absolute; right: 24%; bottom: 19%; color: rgba(255,255,255,.84); font-size: 1rem; font-weight: 400; }
.hero-product-orbit__core.is-changing { animation: product-orbit-core-in .42s var(--ease); }
@keyframes product-orbit-core-in { 0% { opacity: .7; transform: translate(-50%, -50%) scale(.94); } 100% { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
.hero-product-orbit[data-orbit-mode="app"] .hero-product-orbit__core { background: radial-gradient(circle at 30% 22%, #53e8ff 0%, #2b82ec 30%, #5036d4 62%, #bd43bc 100%); }
.hero-product-orbit[data-orbit-mode="web"] .hero-product-orbit__core { background: radial-gradient(circle at 28% 20%, #b9fbff 0%, #28d6ed 25%, #227eea 59%, #3453c8 100%); box-shadow: 0 1.4rem 3rem rgba(33, 128, 211, .24), inset .75rem .7rem 1.7rem rgba(255,255,255,.3), inset -.8rem -1.2rem 1.8rem rgba(17, 58, 153, .34); }
.hero-product-orbit[data-orbit-mode="app"] .hero-product-orbit__core { background: radial-gradient(circle at 28% 20%, #ffc0f3 0%, #e85bd6 27%, #8b3edc 59%, #4f2eae 100%); box-shadow: 0 1.4rem 3rem rgba(137, 61, 193, .25), inset .75rem .7rem 1.7rem rgba(255,255,255,.28), inset -.8rem -1.2rem 1.8rem rgba(57, 17, 128, .4); }
.hero-product-orbit[data-orbit-mode="ecommerce"] .hero-product-orbit__core { background: radial-gradient(circle at 30% 22%, #ffcb5f 0%, #ff8651 32%, #eb4f93 64%, #8c39c7 100%); }
.hero-product-orbit[data-orbit-mode="platform"] .hero-product-orbit__core { background: radial-gradient(circle at 30% 22%, #b8f55f 0%, #29c99c 32%, #1597ce 62%, #3949bd 100%); }
.hero-product-orbit__surface { position: absolute; z-index: 5; display: block; min-height: 138px; padding: .78rem .85rem; overflow: hidden; border: 1px solid rgba(34, 78, 100, .18); border-radius: 15px; background: rgba(250, 252, 250, .8); box-shadow: .6rem .8rem 0 rgba(26, 79, 102, .07), 0 1rem 2rem rgba(25, 51, 74, .06); color: #173445; cursor: pointer; text-align: left; transform: translate3d(var(--orbit-card-x, 0px), var(--orbit-card-y, 0px), 0) rotate(var(--orbit-card-rotate, 0deg)); transform-style: preserve-3d; transition: border-color .35s var(--ease), background .35s var(--ease), box-shadow .35s var(--ease), transform .35s var(--ease); }
.hero-product-orbit__surface:hover, .hero-product-orbit__surface:focus-visible, .hero-product-orbit__surface.is-active { border-color: var(--surface-accent, #329be3); background: rgba(255,255,255,.94); box-shadow: .35rem .45rem 0 rgba(26, 79, 102, .1), 0 1.2rem 2.4rem rgba(25, 51, 74, .1); transform: translate3d(var(--orbit-card-x, 0px), calc(var(--orbit-card-y, 0px) - 5px), 0) rotate(var(--orbit-card-rotate, 0deg)); }
.hero-product-orbit__surface-meta { display: block; color: rgba(23, 52, 69, .55); font-family: monospace; font-size: .62rem; letter-spacing: .1em; }
.hero-product-orbit__surface > strong { display: block; margin-top: .24rem; font-family: var(--font-display); font-size: .92rem; font-weight: 600; letter-spacing: -.06em; }
.hero-product-orbit__surface--web { --surface-accent: #23a8e9; --orbit-card-rotate: -7deg; top: 7%; left: 0; width: 32%; }
.hero-product-orbit__surface--app { --surface-accent: #9a52db; --orbit-card-rotate: 7deg; top: 1%; right: 0; width: 28%; }
.hero-product-orbit__surface--ecommerce { --surface-accent: #ed6e78; --orbit-card-rotate: 5deg; bottom: 5%; left: 5%; width: 30%; }
.hero-product-orbit__surface--platform { --surface-accent: #20ae9f; --orbit-card-rotate: -6deg; right: 1%; bottom: 0; width: 35%; }
.hero-product-orbit__browser { position: relative; display: block; height: 75px; margin-top: .6rem; overflow: hidden; border: 1px solid rgba(34, 78, 100, .13); border-radius: 7px; background: linear-gradient(135deg, #eefcff, #d9e4ff); }
.hero-product-orbit__browser > i { display: inline-block; width: .3rem; height: .3rem; margin: .45rem .08rem 0 .36rem; border-radius: 50%; background: #72a7d3; }
.hero-product-orbit__browser > em { position: absolute; top: .4rem; left: 25%; color: rgba(23, 52, 69, .45); font: .46rem monospace; font-style: normal; }
.hero-product-orbit__browser > b { position: absolute; right: 9%; bottom: 14%; width: 52%; height: 42%; border-radius: 50% 44% 8% 48%; background: linear-gradient(135deg, #25d6ec, #5566de 62%, #af53c7); transform: rotate(-18deg); }
.hero-product-orbit__phone { position: relative; display: block; width: 64px; height: 86px; margin: .55rem auto -.3rem; padding: .5rem .42rem; overflow: hidden; border: 2px solid #24455f; border-radius: 11px; background: #f7fbff; box-shadow: .3rem .35rem 0 rgba(81, 59, 193, .2); color: #173445; }
.hero-product-orbit__phone > i { position: absolute; top: .22rem; left: 50%; width: 28%; height: .18rem; border-radius: 99px; background: #24455f; transform: translateX(-50%); }
.hero-product-orbit__phone > b { display: block; padding-top: .2rem; font: .42rem monospace; }
.hero-product-orbit__phone > em { display: block; margin-top: .75rem; font-size: .48rem; font-style: normal; line-height: 1.05; }
.hero-product-orbit__phone > em strong { color: #6640d5; font-size: .55rem; }
.hero-product-orbit__phone > small { display: flex; align-items: center; gap: .25rem; margin-top: .6rem; }
.hero-product-orbit__phone > small i { display: block; width: .65rem; height: .65rem; border-radius: 50%; background: linear-gradient(135deg, #f36db2, #5d5be0); }
.hero-product-orbit__phone > small span { display: block; width: 55%; height: .22rem; border-radius: 99px; background: #dbe7f1; }
.hero-product-orbit__shop { position: relative; display: block; height: 76px; margin-top: .55rem; padding: .5rem; background: #fff0e3; color: #2c2630; }
.hero-product-orbit__shop > i { position: absolute; right: .55rem; top: .5rem; width: 38px; height: 46px; border-radius: 48% 52% 34% 66%; background: linear-gradient(135deg, #ffb33f, #ed5f8b); transform: rotate(17deg); }
.hero-product-orbit__shop > b { color: rgba(44, 38, 48, .45); font: .42rem monospace; }
.hero-product-orbit__shop > em { display: block; margin-top: .4rem; font-family: var(--font-display); font-size: .65rem; font-style: normal; letter-spacing: -.06em; line-height: .9; }
.hero-product-orbit__shop > small { position: absolute; bottom: .35rem; left: .5rem; color: #ea5c79; font: .42rem monospace; }
.hero-product-orbit__shop > small b { font-size: .65rem; font-weight: 400; }
.hero-product-orbit__dashboard { position: relative; display: block; height: 76px; margin-top: .55rem; padding: .45rem .5rem; border: 1px solid rgba(32, 174, 159, .2); background: linear-gradient(135deg, #f0fbf7, #dcecf9); }
.hero-product-orbit__dashboard > i { display: block; width: 32%; height: 3px; margin-bottom: .35rem; background: #6ccfc0; }
.hero-product-orbit__dashboard > b { position: absolute; right: .5rem; top: .45rem; color: #159b8b; font: .5rem monospace; }
.hero-product-orbit__dashboard > em { display: block; color: #173445; font-size: .62rem; font-style: normal; line-height: .9; }
.hero-product-orbit__dashboard > small { position: absolute; right: .5rem; bottom: .5rem; left: .5rem; display: flex; height: 28px; align-items: flex-end; gap: 3px; border-bottom: 1px solid rgba(23, 52, 69, .15); }
.hero-product-orbit__dashboard > small span { flex: 1; height: 35%; background: linear-gradient(180deg, #4ed1be, #447ddc); }
.hero-product-orbit__dashboard > small span:nth-child(2) { height: 68%; }.hero-product-orbit__dashboard > small span:nth-child(3) { height: 46%; }.hero-product-orbit__dashboard > small span:nth-child(4) { height: 82%; }.hero-product-orbit__dashboard > small span:nth-child(5) { height: 59%; }.hero-product-orbit__dashboard > small span:nth-child(6) { height: 91%; }
.hero-product-orbit__modes { position: absolute; right: 0; bottom: 4.6%; left: 0; z-index: 8; display: flex; justify-content: center; gap: .35rem; }
.hero-product-orbit__modes button { padding: .48rem .7rem; border: 1px solid rgba(38, 88, 111, .18); border-radius: 99px; background: rgba(255,255,255,.5); color: rgba(23, 52, 69, .62); cursor: pointer; font-family: monospace; font-size: .62rem; letter-spacing: .08em; transition: color .25s ease, border-color .25s ease, background .25s ease; }
.hero-product-orbit__modes button:hover, .hero-product-orbit__modes button:focus-visible, .hero-product-orbit__modes button.is-active { border-color: #347fbd; background: #173f68; color: #fff; }
.hero-product-orbit__flow { position: absolute; right: 2%; bottom: 0; left: 2%; display: flex; align-items: center; justify-content: space-between; color: rgba(23, 52, 69, .42); font-family: monospace; font-size: .6rem; letter-spacing: .12em; }
.hero-product-orbit__flow i { display: block; width: 1.2rem; height: 1px; background: rgba(23, 52, 69, .22); }
.hero__signature { color: rgba(23, 52, 69, .46); }
.hero__signature i { background: rgba(23, 52, 69, .22); }

@media (max-width: 800px) {
	.hero-product-orbit { grid-column: 1; grid-row: auto; min-height: 116vw; margin-top: 1rem; }
	.hero-product-orbit__stage { inset: 6% 0 13%; }
	.hero-product-orbit__core { top: 45%; width: clamp(10rem, 35vw, 13rem); }
	.hero-product-orbit__core-logo { width: clamp(6rem, 25vw, 8rem); }
	.hero-product-orbit__surface { min-height: 108px; padding: .6rem; border-radius: 11px; }
	.hero-product-orbit__surface-meta { font-size: .5rem; }
	.hero-product-orbit__surface > strong { font-size: .72rem; }
	.hero-product-orbit__browser, .hero-product-orbit__shop, .hero-product-orbit__dashboard { height: 58px; margin-top: .4rem; }
	.hero-product-orbit__phone { width: 48px; height: 64px; margin-top: .35rem; padding: .3rem; border-radius: 8px; }
	.hero-product-orbit__phone > b { font-size: .32rem; }.hero-product-orbit__phone > em { margin-top: .5rem; font-size: .36rem; }.hero-product-orbit__phone > em strong { font-size: .4rem; }.hero-product-orbit__phone > small { margin-top: .3rem; }
	.hero-product-orbit__shop > i { width: 28px; height: 34px; }.hero-product-orbit__shop > em { font-size: .5rem; }.hero-product-orbit__dashboard > em { font-size: .5rem; }.hero-product-orbit__dashboard > small { height: 20px; }
	.hero-product-orbit__modes { bottom: 5.3%; gap: .18rem; flex-wrap: wrap; padding-inline: 1rem; }
	.hero-product-orbit__modes button { padding: .38rem .45rem; font-size: .5rem; }
	.hero-product-orbit__flow { font-size: .48rem; }.hero-product-orbit__flow i { width: .55rem; }
	.hero-product-orbit__backdrop > span { top: 16%; right: -17%; font-size: clamp(3.3rem, 15vw, 5rem); }
}

@media (prefers-reduced-motion: reduce) {
	.hero-product-orbit__stage { transform: none; }
	.hero-product-orbit__core.is-changing { animation: none; }
}

/* Contraste cromático entre los conceptos Web y App. */
.hero-product-orbit__surface--web,
.hero-product-orbit__surface--web:hover,
.hero-product-orbit__surface--web:focus-visible,
.hero-product-orbit__surface--web.is-active {
	--surface-accent: #168bd2;
	border-top: 3px solid #19bde9;
	background: rgba(231, 249, 255, .94);
}
.hero-product-orbit__surface--web .hero-product-orbit__browser {
	background: linear-gradient(135deg, #e5fcff 0%, #c6e9ff 58%, #d7dfff 100%);
}
.hero-product-orbit__surface--web .hero-product-orbit__browser > b {
	background: linear-gradient(135deg, #23d8ed, #2879e5);
}
.hero-product-orbit__surface--app,
.hero-product-orbit__surface--app:hover,
.hero-product-orbit__surface--app:focus-visible,
.hero-product-orbit__surface--app.is-active {
	--surface-accent: #873fd0;
	border-top: 3px solid #ad4bdf;
	background: rgba(247, 237, 255, .96);
}
.hero-product-orbit__surface--app .hero-product-orbit__phone {
	border-color: #6642bd;
	background: linear-gradient(160deg, #fffaff, #f0e7ff 72%, #e7ddff);
	box-shadow: .3rem .35rem 0 rgba(168, 70, 211, .25);
}
.hero-product-orbit__surface--app .hero-product-orbit__phone > em strong { color: #9142cb; }
.hero-product-orbit__surface--app .hero-product-orbit__phone > small i { background: linear-gradient(135deg, #e959c1, #743ee0); }

/* Página Qué ofrecemos: suscripción web clara, premium y sin pago inicial. */
.offer-page { overflow: hidden; }
.offer-hero { padding-top: clamp(9rem, 15vw, 13rem); padding-bottom: 2rem; }
.offer-hero__grid { display: grid; min-height: 56vh; align-items: end; grid-template-columns: 1.2fr .8fr; gap: 7vw; }
.offer-hero h1 { max-width: 900px; margin: 1.5rem 0 0; font-size: clamp(3.8rem, 7vw, 7.6rem); line-height: .9; }
.offer-hero__aside { max-width: 430px; padding-bottom: .6rem; }
.offer-hero__aside .lead { margin-bottom: 2rem; color: rgba(241,240,236,.76); font-size: 1.16rem; line-height: 1.5; }
.offer-hero__foot { display: flex; justify-content: space-between; gap: 2rem; padding-top: 1.2rem; border-top: 1px solid var(--color-border-light); color: rgba(241,240,236,.48); font-family: monospace; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.offer-plans { padding-top: clamp(5rem, 9vw, 8rem); }
.offer-plans__intro { max-width: 780px; margin: 0 0 2rem; color: rgba(17,19,19,.68); font-size: 1.05rem; line-height: 1.5; }
.offer-plans__intro p { margin: 0; }
.offer-plans__intro strong { display: block; margin-bottom: .35rem; color: #111313; font-size: clamp(1.3rem, 2vw, 1.65rem); font-weight: 700; }
.offer-plans__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.offer-plan { display: flex; min-height: 540px; flex-direction: column; padding: clamp(1.45rem, 2.6vw, 2.25rem); border: 1px solid rgba(17,19,19,.16); background: rgba(255,255,255,.35); transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease); }
.offer-plan:hover { border-color: rgba(17,19,19,.48); box-shadow: .6rem .7rem 0 rgba(17,19,19,.08); transform: translateY(-7px); }
.offer-plan--professional { border-color: #3158e8; background: linear-gradient(145deg, rgba(232,239,255,.9), rgba(255,255,255,.52)); box-shadow: .45rem .55rem 0 rgba(49,88,232,.12); }
.offer-plan--commerce { background: linear-gradient(145deg, rgba(255,244,228,.94), rgba(255,255,255,.5)); }
.offer-plan__label { margin-bottom: 4rem; color: #3158e8; font-family: monospace; font-size: .66rem; letter-spacing: .1em; text-transform: uppercase; }
.offer-plan--commerce .offer-plan__label { color: #dd6d39; }
.offer-plan h2 { margin: 0 0 1.3rem; font-size: clamp(2rem, 3vw, 3.2rem); line-height: .95; }
.offer-plan__price { display: flex; align-items: baseline; gap: .35rem; margin-bottom: 1.5rem; }
.offer-plan__price strong { font-family: var(--font-display); font-size: clamp(2.2rem, 3.6vw, 3.6rem); font-weight: 500; letter-spacing: -.08em; line-height: 1; }
.offer-plan__price span { color: rgba(17,19,19,.58); font-size: .82rem; }
.offer-plan__description { min-height: 5.1rem; margin-bottom: 1.4rem; color: rgba(17,19,19,.68); font-size: 1rem; line-height: 1.5; }
.offer-plan__list { display: grid; gap: .72rem; margin: 0; padding: 1.4rem 0 1.5rem; border-top: 1px solid rgba(17,19,19,.15); list-style: none; }
.offer-plan__list li { display: flex; align-items: flex-start; gap: .55rem; font-size: .95rem; line-height: 1.35; }
.offer-plan__list li span { color: #3158e8; font-size: .8rem; }
.offer-plan--commerce .offer-plan__list li span { color: #dd6d39; }
.offer-plan__fineprint { margin: -.6rem 0 1rem; color: rgba(17,19,19,.58); font-size: .76rem; line-height: 1.45; }
.offer-plan__commitment { margin: auto 0 0; padding-top: 1.2rem; border-top: 1px solid rgba(17,19,19,.15); color: rgba(17,19,19,.56); font-family: monospace; font-size: .68rem; letter-spacing: .05em; text-transform: uppercase; }
.offer-plan__annual { margin: .7rem 0 0; color: #3158e8; font-size: .92rem; font-weight: 700; }
.offer-plan--commerce .offer-plan__annual { color: #dd6d39; }
.offer-combo { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, .9fr) minmax(240px, .78fr); align-items: center; gap: clamp(1.5rem, 3vw, 3.5rem); overflow: hidden; margin-top: 1rem; padding: clamp(1.5rem, 3.3vw, 2.8rem); border: 1px solid rgba(49,88,232,.42); background: radial-gradient(circle at 92% 5%, rgba(58,194,255,.2), transparent 30%), linear-gradient(112deg, #101d3e 0%, #182c67 58%, #20517c 100%); color: #fff; }
.offer-combo__eyebrow { margin: 0 0 1.1rem; color: #77dfff; font-family: monospace; font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.offer-combo__intro h3 { margin: 0 0 1rem; color: #fff; font-size: clamp(1.75rem, 2.7vw, 2.7rem); letter-spacing: -.055em; line-height: 1.02; }
.offer-combo__intro h3 em { color: #8be3ff; font-style: normal; }
.offer-combo__intro > p:last-child { max-width: 430px; margin: 0; color: rgba(241,240,236,.72); font-size: .96rem; line-height: 1.5; }
.offer-combo__features { display: grid; gap: .85rem; margin: 0; padding: 0; list-style: none; }
.offer-combo__features li { position: relative; padding-left: 1.15rem; color: rgba(255,255,255,.86); font-size: .91rem; line-height: 1.4; }
.offer-combo__features li::before { position: absolute; top: .48em; left: 0; width: .42rem; height: .42rem; border-radius: 50%; background: #77dfff; box-shadow: 0 0 .6rem rgba(119,223,255,.6); content: ''; }
.offer-combo__pricing { padding-left: clamp(1.2rem, 2.5vw, 2.5rem); border-left: 1px solid rgba(255,255,255,.22); }
.offer-combo__entry > span { color: rgba(241,240,236,.68); font-size: .78rem; }
.offer-combo__entry p { display: flex; align-items: baseline; gap: .4rem; margin: .1rem 0 .85rem; }
.offer-combo__entry strong { color: #fff; font-family: var(--font-display); font-size: clamp(2.2rem, 3.2vw, 3.2rem); font-weight: 500; letter-spacing: -.08em; line-height: 1; }
.offer-combo__entry small { color: rgba(241,240,236,.68); font-size: .78rem; }
.offer-combo__monthly { display: flex; align-items: baseline; gap: .45rem; }
.offer-combo__monthly strong { color: #8be3ff; font-family: var(--font-display); font-size: 1.55rem; font-weight: 500; letter-spacing: -.05em; }
.offer-combo__monthly span { color: rgba(241,240,236,.72); font-size: .78rem; }
.offer-combo__total { margin: .55rem 0 1rem; color: rgba(241,240,236,.65); font-family: monospace; font-size: .66rem; letter-spacing: .025em; }
.offer-combo__button { width: 100%; min-height: 46px; background: #fff; border-color: #fff; color: #101d3e; }
.offer-combo__button:hover { background: #8be3ff; border-color: #8be3ff; }
.offer-plans__note { max-width: 690px; margin: 2rem 0 0; color: rgba(17,19,19,.56); font-size: .92rem; }
.offer-included__grid, .offer-terms__grid { display: grid; grid-template-columns: 1fr 1.45fr; gap: 7vw; }
.offer-included h2, .offer-terms h2 { margin: 0; font-size: clamp(3rem, 5vw, 5.5rem); line-height: .93; }
.offer-included__lead { max-width: 620px; margin: 0 0 3.5rem; color: rgba(241,240,236,.72); font-size: 1.16rem; line-height: 1.55; }
.offer-included__details { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem 3rem; }
.offer-detail { padding-top: 1rem; border-top: 1px solid var(--color-border-light); }
.offer-detail > span, .offer-step > span { color: #77dfff; font-family: monospace; font-size: .68rem; letter-spacing: .1em; }
.offer-detail h3, .offer-step h3 { margin: 1.2rem 0 .55rem; font-size: 1.45rem; letter-spacing: -.045em; }
.offer-detail p { margin: 0; color: rgba(241,240,236,.64); font-size: .98rem; line-height: 1.5; }
.offer-process { padding-bottom: clamp(5rem, 10vw, 9rem); }
.offer-process__steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.offer-step { min-height: 220px; padding: 1.35rem; border-top: 1px solid rgba(17,19,19,.36); }
.offer-step > span { color: #3158e8; }
.offer-step h3 { margin-top: 2.2rem; }
.offer-step p { margin: 0; color: rgba(17,19,19,.64); font-size: 1rem; line-height: 1.5; }
.offer-terms { padding-block: 0 clamp(5rem, 10vw, 9rem); }
.offer-terms__content { max-width: 650px; }
.offer-terms__content > p { margin: 0 0 2rem; font-size: 1.18rem; line-height: 1.55; }
.offer-terms__content ul { display: grid; gap: 1rem; margin: 0; padding: 1.4rem 0 0; border-top: 1px solid rgba(17,19,19,.2); list-style: none; }
.offer-terms__content li { position: relative; padding-left: 1.35rem; color: rgba(17,19,19,.67); font-size: 1rem; line-height: 1.5; }
.offer-terms__content li strong { color: var(--color-text); }
.offer-terms__content li::before { position: absolute; top: .6em; left: 0; width: .42rem; height: .42rem; border-radius: 50%; background: #3158e8; content: ''; }
.offer-cta { padding-block: clamp(6rem, 12vw, 11rem); }
.offer-cta h2 { max-width: 950px; margin: 5rem 0 6rem; font-size: clamp(3.5rem, 6.8vw, 7rem); line-height: .9; }
.offer-cta__bottom { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; }
.offer-cta__bottom p { max-width: 460px; margin: 0; color: rgba(241,240,236,.8); font-size: 1.08rem; line-height: 1.55; }
.offer-plans, .offer-custom-card { scroll-margin-top: 100px; }
.offer-service-menu { position: relative; z-index: 2; width: min(100%, 420px); margin-bottom: 4rem; }
.offer-service-menu summary { display: flex; align-items: center; justify-content: space-between; padding: .9rem 1rem; border: 1px solid rgba(17,19,19,.25); background: rgba(255,255,255,.48); cursor: pointer; font-family: var(--font-display); font-size: 1rem; font-weight: 600; list-style: none; }
.offer-service-menu summary::-webkit-details-marker { display: none; }
.offer-service-menu summary span { color: #3158e8; font-size: 1.3rem; font-weight: 400; transition: transform .25s var(--ease); }
.offer-service-menu[open] summary span { transform: rotate(45deg); }
.offer-service-menu nav { display: grid; border: 1px solid rgba(17,19,19,.25); border-top: 0; background: rgba(255,255,255,.82); }
.offer-service-menu nav a { display: flex; align-items: center; justify-content: space-between; padding: .78rem 1rem; border-bottom: 1px solid rgba(17,19,19,.12); font-size: .98rem; transition: padding .25s var(--ease), color .25s var(--ease), background .25s var(--ease); }
.offer-service-menu nav a:last-child { border-bottom: 0; }
.offer-service-menu nav a:hover { padding-left: 1.3rem; background: rgba(49,88,232,.08); color: #3158e8; }
.offer-custom-services { background: linear-gradient(135deg, #101d3e 0%, #182c67 58%, #273b83 100%); }
.offer-custom-services__grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; }
.offer-custom-card { min-height: 290px; padding: clamp(1.35rem, 3vw, 2.2rem); border: 1px solid rgba(241,240,236,.24); background: rgba(255,255,255,.05); transition: background .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease); }
.offer-custom-card--app, .offer-custom-card--plan { background: rgba(7, 19, 49, .62); border-color: rgba(49, 88, 232, .44); }
.offer-custom-card:hover { border-color: rgba(119,223,255,.8); background: rgba(255,255,255,.1); transform: translateY(-5px); }
.offer-custom-card > span { color: #77dfff; font-family: monospace; font-size: .68rem; letter-spacing: .1em; }
.offer-custom-card h3 { margin: 2.2rem 0 .7rem; color: #fff; font-size: clamp(1.8rem, 3vw, 3rem); }
.offer-custom-card p { max-width: 520px; margin: 0 0 1.8rem; color: rgba(241,240,236,.72); font-size: 1rem; line-height: 1.55; }
.offer-custom-card a { display: inline-flex; align-items: center; gap: 1.3rem; color: #77dfff; font-size: .86rem; font-weight: 700; }
.offer-custom-card a span { font-size: 1.1rem; transition: transform .25s var(--ease); }
.offer-custom-card a:hover span { transform: translate(4px, -4px); }
.offer-custom-card__price { display: flex; align-items: baseline; gap: .35rem; margin: 1.4rem 0 1rem; }
.offer-custom-card__price strong { color: #fff; font-family: var(--font-display); font-size: clamp(2.4rem, 4vw, 4rem); font-weight: 500; letter-spacing: -.08em; line-height: 1; }
.offer-custom-card__price span { color: rgba(241,240,236,.68); font-size: .85rem; }
.offer-custom-card__monthly { display: flex; align-items: baseline; gap: .35rem; margin: -.45rem 0 1.2rem !important; color: rgba(241,240,236,.68) !important; }
.offer-custom-card__monthly strong { color: #fff; font-family: var(--font-display); font-size: 1.2rem; font-weight: 500; letter-spacing: -.04em; }
.offer-custom-card__monthly span { font-size: .78rem; }
.offer-custom-card--app p, .offer-custom-card--plan p { margin-bottom: 1.25rem; color: rgba(241,240,236,.68); font-size: .9rem; }
.offer-custom-card--app ul, .offer-custom-card--plan ul { display: grid; gap: .45rem; margin: 0 0 1.25rem; padding: 1rem 0 0; border-top: 1px solid rgba(241,240,236,.18); list-style: none; }
.offer-custom-card--app li, .offer-custom-card--plan li { position: relative; padding-left: 1rem; color: rgba(241,240,236,.74); font-size: .9rem; line-height: 1.4; }
.offer-custom-card--app li::before, .offer-custom-card--plan li::before { position: absolute; top: .55em; left: 0; width: .32rem; height: .32rem; border-radius: 50%; background: #4d8cff; box-shadow: 0 0 .45rem rgba(77,140,255,.55); content: ''; }
.offer-custom-card__commitment { color: #77dfff !important; font-family: monospace; font-size: .7rem !important; letter-spacing: .04em; text-transform: uppercase; }
.service-row__link { display: inline-flex; align-items: center; gap: .7rem; margin-top: 1.1rem; color: #77dfff; font-size: .82rem; font-weight: 700; }
.service-row__link span { font-size: 1rem; transition: transform .25s var(--ease); }
.service-row__link:hover span { transform: translate(4px, -4px); }

/* Menú desplegable de Qué ofrecemos. */
.primary-nav__dropdown { position: relative; }
.primary-nav__dropdown summary { display: inline-flex; align-items: center; gap: .35rem; color: inherit; cursor: pointer; font: inherit; list-style: none; opacity: .72; transition: opacity .25s var(--ease); }
.primary-nav__dropdown summary::-webkit-details-marker { display: none; }
.primary-nav__dropdown summary:hover, .primary-nav__dropdown[open] summary { opacity: 1; }
.primary-nav__dropdown summary > span { color: #77dfff; font-size: 1rem; font-weight: 400; transition: transform .25s var(--ease); }
.primary-nav__dropdown[open] summary > span { transform: rotate(45deg); }
.primary-nav__dropdown-panel { position: absolute; top: calc(100% + 1.35rem); right: -1rem; display: grid; width: 230px; padding: .4rem; border: 1px solid var(--color-border-light); background: rgba(12,13,13,.97); box-shadow: 0 .8rem 2rem rgba(0,0,0,.2); }
.primary-nav__dropdown-panel a { display: flex; align-items: center; justify-content: space-between; padding: .72rem .75rem; border-bottom: 1px solid rgba(241,240,236,.12); color: var(--color-text-light); font-size: .8rem; opacity: .78; transition: background .25s var(--ease), color .25s var(--ease), opacity .25s var(--ease); }
.primary-nav__dropdown-panel a:last-child { border-bottom: 0; }
.primary-nav__dropdown-panel a span { color: #77dfff; font-size: 1rem; }
.primary-nav__dropdown-panel a:hover, .primary-nav__dropdown-panel a:focus-visible { background: rgba(49,88,232,.3); color: #fff; opacity: 1; }

@media (max-width: 900px) {
	.offer-hero__grid, .offer-included__grid, .offer-terms__grid { grid-template-columns: 1fr; gap: 3rem; }
	.offer-hero__grid { min-height: auto; }
	.offer-hero h1 { font-size: clamp(3.3rem, 11vw, 5.8rem); }
	.offer-hero__aside { max-width: 520px; }
	.offer-plans__grid { grid-template-columns: 1fr; }
	.offer-combo { grid-template-columns: 1fr 1fr; gap: 2rem; }
	.offer-combo__pricing { grid-column: 1 / -1; padding: 1.5rem 0 0; border-top: 1px solid rgba(255,255,255,.22); border-left: 0; }
	.offer-combo__button { width: auto; min-width: 220px; }
	.offer-custom-services__grid { grid-template-columns: 1fr; }
	.offer-plan { min-height: auto; }
	.offer-plan__label { margin-bottom: 2.5rem; }
	.offer-plan__description { min-height: 0; }
	.offer-process__steps { grid-template-columns: repeat(2, 1fr); }
	.offer-cta h2 { margin-block: 4rem; font-size: clamp(3rem, 10vw, 5.5rem); }
}

@media (max-width: 600px) {
	.offer-hero { padding-top: 8.5rem; }
	.offer-hero__foot { align-items: flex-start; flex-direction: column; gap: .5rem; }
	.offer-included__details, .offer-process__steps { grid-template-columns: 1fr; gap: 1rem; }
	.offer-combo { grid-template-columns: 1fr; gap: 1.5rem; }
	.offer-combo__pricing { grid-column: auto; }
	.offer-combo__button { width: 100%; }
	.offer-detail { padding-top: 1.2rem; }
	.offer-step { min-height: auto; padding: 1.2rem 0; }
	.offer-step h3 { margin-top: 1rem; }
	.offer-cta__bottom { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 800px) {
	.primary-nav__dropdown { width: 100%; }
	.primary-nav__dropdown summary { width: 100%; justify-content: space-between; font-family: var(--font-display); font-size: 1.95rem; letter-spacing: -.06em; opacity: 1; }
	.primary-nav__dropdown summary > span { font-family: var(--font-primary); font-size: 1.4rem; }
	.primary-nav__dropdown-panel { position: static; width: 100%; margin-top: .8rem; padding: 0 0 0 1rem; border: 0; background: transparent; box-shadow: none; }
	.primary-nav__dropdown-panel a { padding: .48rem 0; border-bottom: 0; color: currentColor; font-size: 1rem; opacity: .72; }
	.primary-nav__dropdown-panel a:hover, .primary-nav__dropdown-panel a:focus-visible { padding-left: .35rem; background: transparent; color: #3158e8; }
}

/* Cabecera de Servicios más compacta, sin perder presencia editorial. */
.services-page__hero { padding-top: clamp(6.5rem, 8vw, 8rem); }
.services-page__hero-grid { min-height: 39vh; }

@media (max-width: 800px) {
	.services-page__hero { padding-top: 6.5rem; }
	.services-page__hero-grid { min-height: auto; }
}

/* Estudio: entrada ligeramente más alta y compacta. */
.studio-hero { padding-top: clamp(8rem, 11vw, 11rem); }
.studio-hero__grid { min-height: 62vh; }

@media (max-width: 800px) {
	.studio-hero { padding-top: 7rem; }
	.studio-hero__grid { min-height: auto; }
}