/* Zephyra / identity v2. Additive layer preserving the original motion. */
/* Product showcase: edit the cards in index.html to add future products. */
.product-card-linked { position:relative; }
.product-card-linked .product-link::after { content:''; position:absolute; inset:0; z-index:3; }
.product-card-linked:focus-within { outline:2px solid var(--blue); outline-offset:4px; }
.software { padding:112px clamp(24px,9vw,148px); border-bottom:1px solid #252525; }
.software-heading { display:grid; grid-template-columns:1.4fr .6fr; gap:48px; align-items:end; margin-bottom:56px; }
.software h2 { font-size:clamp(38px,4.7vw,74px); letter-spacing:-.065em; line-height:1.03; margin:0; }
.software-heading>p { color:#a5a5a5; font-size:15px; line-height:1.7; margin:0; }
.software-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.product-card { min-width:0; background:#101010; border:1px solid #2a2a2a; display:flex; flex-direction:column; }
.product-art { position:relative; height:240px; overflow:hidden; border-bottom:1px solid #2a2a2a; display:grid; place-items:center; }
.product-art .fragment-field { mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000); -webkit-mask-image:linear-gradient(90deg,#000,transparent 35%,transparent 65%,#000); }
.product-symbol { width:144px; height:120px; color:#d5d5d2; animation:product-hover 9s ease-in-out infinite; }
.product-art-genesis .product-symbol { animation-delay:-4s; }
.product-code,.product-sector { position:absolute; left:24px; font:10px 'DM Mono',monospace; letter-spacing:.08em; color:#a5a5a5; }
.product-code { top:24px; }.product-sector { bottom:20px; }
.product-content { padding:28px; display:flex; flex-direction:column; flex:1; }
.product-status { font:10px 'DM Mono',monospace; color:#a5a5a5; letter-spacing:.03em; }
.product-status::before { content:''; display:inline-block; width:6px; height:6px; background:var(--blue); margin-right:8px; clip-path:polygon(0 0,100% 0,50% 100%); }
.product-content h3 { margin:17px 0 14px; font-size:28px; letter-spacing:-.04em; }
.product-content p { color:#a5a5a5; font-size:15px; line-height:1.7; margin-bottom:28px; }
.product-link { margin-top:auto; padding-top:20px; border-top:1px solid #303030; color:var(--white); text-decoration:none; font-size:13px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
.product-link span { color:var(--blue); font-size:20px; transition:transform .3s ease; }
.product-link:hover span { transform:translate(3px,-3px); }
.product-card:hover { border-color:#505050; }
.product-card:focus-within { border-color:var(--blue); }
.contact-channels { position:relative; z-index:1; width:fit-content; max-width:100%; }
.contact-phone { margin:24px 0 0; font:13px 'DM Mono',monospace; color:var(--white); }
.contact-phone span { display:inline-block; margin-left:14px; color:#a5a5a5; font-size:10px; }
@keyframes product-hover { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-7px); } }
@media(max-width:1000px) { .software-heading { grid-template-columns:1fr; gap:24px; }.contact-note { position:static; margin:40px 0 0; } }
@media(max-width:760px) { .software { padding-block:80px; }.software-grid { grid-template-columns:1fr; }.product-content { padding:24px; }.product-art { height:215px; }.product-sector { font-size:9px; } }
@media(prefers-reduced-motion:reduce) { .product-symbol { animation:none; } }
:root { --white:#f3f3f0; --ease:cubic-bezier(.16,1,.3,1); }
section { scroll-margin-top:24px; }
::selection { background:#36a8ff; color:#080808; }
a:focus-visible { outline:2px solid var(--blue); outline-offset:7px; }
.hero { isolation:isolate; }
.hero-copy { align-self:center; }
.hero-text,.statement-grid>p { font-size:16px; line-height:1.7; }
.hero-actions { flex-wrap:wrap; }
.button-primary .button-label { font-size:13px; }
.hero-art { animation:none; }
.logo-portrait { z-index:2; }
.orbit { z-index:1; }
.art-caption,.art-index { z-index:3; }
.fragment-field { position:absolute; inset:0; pointer-events:none; background:url('assets/fragmentos-tile.svg') repeat; background-size:128px 128px; animation:fragment-breathe 16s ease-in-out infinite; }
.hero-art>.fragment-field { inset:-45px -80px; opacity:.65; mask-image:radial-gradient(ellipse at 50% 47%,transparent 31%,#000 64%,transparent 85%); -webkit-mask-image:radial-gradient(ellipse at 50% 47%,transparent 31%,#000 64%,transparent 85%); }
.hero-art>.fragment-field::after,.process-fragments::after,.contact-fragments::after { content:''; position:absolute; width:26px; height:22px; background:var(--blue); clip-path:polygon(0 0,100% 0,50% 100%); left:74%; top:21%; animation:fragment-float 12s ease-in-out infinite; }
.signal { width:3px; height:3px; box-shadow:0 0 10px #36a8ff66; }
.principles { display:grid; grid-template-columns:1.4fr repeat(3,1fr); padding:32px clamp(24px,9vw,148px); gap:24px; border-block:1px solid #252525; background:#0d0d0d; align-items:center; }
.principles-label { font-size:13px; color:#a5a5a5; margin:0; }
.principles>div { font-size:14px; letter-spacing:-.025em; display:flex; align-items:center; gap:16px; }
.principles>div span { font:9px 'DM Mono',monospace; color:#777; }
.principles>div::after { content:''; width:7px; height:6px; clip-path:polygon(0 0,100% 0,50% 100%); background:#777; transition:transform .5s var(--ease),background .25s; }
.principles>div:hover::after { transform:translateY(-4px) rotate(180deg); background:var(--blue); }
.statement { overflow:hidden; }
.statement::after { display:none; }
.services article { padding-bottom:32px; }
.services article::after { content:''; display:block; width:52px; height:47px; margin-top:32px; background:url('assets/fragmentos-tile.svg') left top/128px 128px; opacity:.45; transition:transform .6s var(--ease),opacity .3s; }
.services article:hover::after { transform:translate(6px,-3px); opacity:.85; }
.services p { font-size:14px; max-width:245px; }
.services article.motion-reveal.is-visible:hover { transform:translateY(-4px); }
.process { gap:64px; }
.process li p { color:#a5a5a5; font-size:14px; }
.process li { position:relative; }
.process li::before { content:''; position:absolute; left:0; right:0; bottom:-1px; height:1px; background:linear-gradient(90deg,var(--blue),transparent); transform:scaleX(0); transform-origin:left; transition:transform .7s var(--ease); }
.process li:hover::before { transform:scaleX(1); }
.process-fragments { position:relative; height:215px; margin-top:48px; overflow:hidden; border-left:1px solid #292929; }
.process-fragments .fragment-field { inset:0 -20px 35px 24px; mask-image:linear-gradient(90deg,#000,transparent); -webkit-mask-image:linear-gradient(90deg,#000,transparent); }
.process-fragments::after { left:88px; top:64px; width:20px; height:17px; }
.fragment-caption { position:absolute; bottom:0; left:24px; font:9px 'DM Mono',monospace; letter-spacing:.07em; color:#777; }
.contact { isolation:isolate; }
.contact-fragments { position:absolute; right:-40px; top:40px; width:42%; height:65%; z-index:-1; overflow:hidden; mask-image:linear-gradient(90deg,transparent,#000); -webkit-mask-image:linear-gradient(90deg,transparent,#000); }
.contact-fragments::after { top:35%; left:66%; width:22px; height:19px; }
.contact-fragments .fragment-field { opacity:.65; }
.contact-note { color:#a5a5a5; }
.contact .eyebrow { position:relative; z-index:1; }
@keyframes fragment-breathe { 0%,100% { transform:translateY(0); opacity:.45; } 50% { transform:translateY(-9px); opacity:.8; } }
@keyframes fragment-float { 0%,100% { transform:translateY(0); opacity:.65; } 50% { transform:translateY(-8px); opacity:1; } }
@media(max-width:1050px) and (min-width:761px) { .hero { padding-inline:5vw; } h1 { font-size:64px; } .hero-art { min-width:0; } .statement-grid { grid-template-columns:1.2fr 1fr; } .process { gap:32px; } .contact-note { position:static; margin:40px 0 0; } }
@media(max-width:760px) { h1 { font-size:clamp(42px,11vw,64px); } .hero { padding-top:64px; } .hero-art { margin-top:60px; height:350px; } .hero-art>.fragment-field { inset:-20px; } .logo-portrait { width:350px; max-width:100%; } .principles { grid-template-columns:repeat(3,1fr); padding-block:28px; gap:22px 10px; } .principles-label { grid-column:1/-1; } .principles>div { font-size:12px; gap:6px; } .principles>div::after { display:none; } .process-fragments { height:155px; margin-top:32px; } .contact-fragments { width:70%; top:80px; right:-100px; opacity:.4; } .services article+article { padding-bottom:28px; } .contact-email { font-size:clamp(20px,6vw,30px); } }
@media(prefers-reduced-motion:reduce) { .hero-art { transform:none!important; } .fragment-field,.hero-art>.fragment-field::after,.process-fragments::after,.contact-fragments::after { animation:none!important; } }