:root { color-scheme: dark light; --ink:#111316; --ink-2:#1b1e22; --paper:#16191d; --surface:#1c2025; --surface-2:#292e35; --text:#f1f4f7; --muted:#aeb6c0; --line:rgba(241,244,247,.18); --blue:#3f72e5; --blue-light:#7f9ef0; --on-blue:#040910; --max:1260px; --header:72px; }
* { box-sizing:border-box; } html { scroll-behavior:smooth; } body { margin:0; background:var(--paper); color:var(--text); font-family:"Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; } body.menu-open { overflow:hidden; } a { color:inherit; text-decoration:none; } button,input,textarea { font:inherit; } img { display:block; width:100%; height:auto; } address { font-style:normal; } .shell { width:min(calc(100% - 48px),var(--max)); margin-inline:auto; }
.skip-link { position:fixed; z-index:100; top:-80px; left:16px; padding:12px 16px; background:var(--blue); color:var(--on-blue); font-weight:800; } .skip-link:focus { top:12px; }
.site-header { position:fixed; z-index:40; inset:0 0 auto; border-bottom:1px solid rgba(241,244,247,.16); background:rgba(17,19,22,.84); backdrop-filter:blur(14px); } .nav-wrap { min-height:var(--header); display:flex; align-items:center; justify-content:space-between; gap:28px; } .wordmark { display:inline-flex; align-items:center; gap:12px; font-size:13px; font-weight:850; text-transform:uppercase; letter-spacing:.85px; } .mark { width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--blue-light); color:var(--blue-light); font-size:19px; font-weight:750; text-transform:none; } .nav-links { display:flex; align-items:center; gap:30px; font-size:13px; font-weight:700; white-space:nowrap; } .nav-links > a:not(.button) { color:rgba(241,244,247,.72); } .nav-links > a:not(.button):hover { color:var(--text); }
.menu-button { display:none; width:44px; height:44px; padding:0; border:1px solid rgba(241,244,247,.35); background:transparent; color:var(--text); cursor:pointer; } .menu-button span { display:block; width:18px; height:1px; margin:6px auto; background:currentColor; transition:transform .2s ease; } .menu-button[aria-expanded="true"] span:first-child { transform:translateY(3.5px) rotate(45deg); } .menu-button[aria-expanded="true"] span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
.button { min-height:52px; padding:0 22px; display:inline-flex; justify-content:center; align-items:center; gap:14px; border:1px solid var(--blue); background:var(--blue); color:var(--on-blue); font-size:13px; font-weight:850; white-space:nowrap; cursor:pointer; transition:transform .2s ease,background .2s ease; } .button:hover { transform:translateY(-2px); background:#5684eb; } .button:active { transform:translateY(1px) scale(.99); } .button-small { min-height:42px; padding-inline:18px; } .text-link { display:inline-flex; align-items:center; gap:12px; width:fit-content; padding:9px 0; border-bottom:1px solid currentColor; font-size:13px; font-weight:800; } .text-link span,.button span { transition:transform .2s ease; } .text-link:hover span,.button:hover span { transform:translate(2px,-2px); } .ink-link { color:var(--ink); } a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid var(--blue-light); outline-offset:3px; }
.hero { position:relative; min-height:min(850px,100dvh); display:grid; align-items:end; overflow:hidden; background:var(--ink); } .hero-media { position:absolute; inset:0; background:url("hero-objetos.jpg") center/cover no-repeat; transform:scale(1.03); animation:hero-scale 1.5s cubic-bezier(.16,1,.3,1) forwards; } .hero::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(10,12,15,.82) 0%,rgba(10,12,15,.5) 39%,rgba(10,12,15,.04) 70%); } .hero-content { position:relative; z-index:1; padding-top:calc(var(--header) + 44px); padding-bottom:clamp(58px,8vh,88px); } .eyebrow { margin:0 0 20px; color:var(--blue-light); font-size:11px; font-weight:850; letter-spacing:1.65px; text-transform:uppercase; } .hero h1 { max-width:800px; margin:0; font-size:clamp(48px,5.7vw,78px); line-height:.98; font-weight:760; } .hero-summary { max-width:510px; margin:26px 0 0; color:rgba(241,244,247,.77); font-size:clamp(17px,1.7vw,21px); line-height:1.55; } .hero-actions { display:flex; align-items:center; gap:24px; margin-top:34px; } .hero-enter { opacity:0; transform:translateY(22px); animation:enter .72s cubic-bezier(.16,1,.3,1) forwards; } .hero h1 { animation-delay:.08s; } .hero-summary { animation-delay:.16s; } .hero-actions { animation-delay:.24s; } @keyframes enter { to { opacity:1; transform:none; } } @keyframes hero-scale { to { transform:scale(1); } }
.ticker { overflow:hidden; background:var(--blue); color:var(--on-blue); border-block:1px solid var(--ink); } .ticker-track { width:max-content; display:flex; animation:ticker 28s linear infinite; } .ticker-group { display:flex; } .ticker span { display:inline-flex; align-items:center; padding:17px 24px; font-size:11px; font-weight:850; text-transform:uppercase; letter-spacing:.9px; white-space:nowrap; } .ticker span::after { content:"+"; margin-left:48px; font-size:15px; font-weight:500; } @keyframes ticker { to { transform:translateX(-50%); } }
section { scroll-margin-top:var(--header); } .lines,.selection,.contact { padding:clamp(82px,10vw,132px) 0; } .section-intro { max-width:760px; margin-bottom:60px; } .section-intro h2,.selection-copy h2,.editorial-copy h2,.contact-copy h2 { margin:0; font-size:clamp(40px,5.3vw,72px); line-height:.99; font-weight:760; } .section-intro p,.selection-copy p,.editorial-copy>p,.contact-copy>p { max-width:610px; margin:24px 0 0; color:var(--muted); font-size:18px; line-height:1.65; }
.lines { background:var(--paper); } .collection-grid { display:grid; grid-template-columns:repeat(12,1fr); border:1px solid var(--line); } .collection-lead { grid-column:span 7; min-height:520px; padding:clamp(34px,5vw,64px); display:flex; flex-direction:column; justify-content:flex-end; background:var(--blue); color:var(--on-blue); } .collection-label { margin:0 auto auto 0; font-size:11px; font-weight:850; letter-spacing:1.3px; text-transform:uppercase; } .collection-lead h3 { max-width:650px; margin:0 0 20px; font-size:clamp(40px,5vw,68px); line-height:.98; } .collection-lead>p:not(.collection-label) { max-width:510px; margin:0 0 28px; color:rgba(9,19,41,.72); font-size:17px; line-height:1.6; } .collection-card { grid-column:span 5; min-height:260px; padding:34px; display:flex; flex-direction:column; justify-content:flex-end; background:var(--surface); border-left:1px solid var(--line); border-bottom:1px solid var(--line); transition:background .22s ease; } .collection-card:nth-child(4) { grid-column:span 5; } .collection-card h3 { margin:0 0 12px; font-size:clamp(25px,2.6vw,34px); line-height:1.04; } .collection-card p { margin:0; max-width:410px; color:var(--muted); line-height:1.55; } .card-blue { background:#283860; } .card-blue p { color:rgba(241,244,247,.68); } .card-graphic { background:var(--surface-2); } .collection-card:hover { background:#293a69; }
.selection { background:var(--ink-2); } .selection-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(48px,8vw,110px); } .selection-copy { position:sticky; top:108px; align-self:start; } .selection-notes { border-top:1px solid var(--line); } .note { min-height:175px; display:grid; grid-template-columns:60px 1fr 1fr; gap:22px; align-items:center; padding:28px 0; border-bottom:1px solid var(--line); } .note span { color:var(--blue-light); font-size:11px; font-weight:850; } .note h3 { margin:0; font-size:clamp(22px,2.5vw,32px); line-height:1.05; } .note p { margin:0; color:var(--muted); line-height:1.55; }
.editorial { padding:0; display:grid; grid-template-columns:.92fr 1.08fr; background:var(--surface-2); } .editorial-copy { padding:clamp(60px,8vw,112px); align-self:center; } .editorial-links { display:flex; flex-direction:column; align-items:flex-start; gap:10px; margin-top:40px; } .editorial-links a { display:inline-flex; gap:12px; padding:11px 0; border-bottom:1px solid var(--line); font-size:14px; font-weight:800; } .editorial-image { min-height:720px; overflow:hidden; } .editorial-image img { width:100%; height:100%; object-fit:cover; }
.facts { padding:0; background:var(--blue); color:var(--on-blue); border-block:1px solid var(--ink); } .facts-grid { display:grid; grid-template-columns:repeat(4,1fr); } .fact { min-height:205px; padding:28px; display:flex; flex-direction:column; justify-content:space-between; border-right:1px solid rgba(9,19,41,.38); } .fact:first-child { border-left:1px solid rgba(9,19,41,.38); } .fact span { font-size:10px; font-weight:850; letter-spacing:1.25px; text-transform:uppercase; } .fact strong { font-size:clamp(28px,3vw,44px); line-height:1; overflow-wrap:anywhere; }
.contact { background:var(--paper); } .contact-grid { display:grid; grid-template-columns:.82fr 1.18fr; gap:clamp(50px,8vw,108px); align-items:start; } .contact-copy { position:sticky; top:108px; } .contact-lines { margin-top:42px; } .contact-lines>div { padding:18px 0; border-top:1px solid var(--line); } .contact-lines>div:last-child { border-bottom:1px solid var(--line); } .contact-lines span { display:block; margin-bottom:8px; color:var(--muted); font-size:10px; font-weight:850; letter-spacing:1.1px; text-transform:uppercase; } .contact-lines a,.contact-lines address { display:block; width:fit-content; margin-bottom:5px; font-size:15px; line-height:1.55; overflow-wrap:anywhere; } .contact-form { padding:clamp(28px,4vw,48px); border:1px solid var(--line); background:var(--surface); } .form-head { margin-bottom:34px; } .form-head h3 { margin:0; font-size:clamp(28px,3vw,38px); } .form-head p { margin:10px 0 0; color:var(--muted); line-height:1.5; } .form-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; } .field-full { grid-column:1/-1; } .field label { display:block; margin-bottom:8px; font-size:12px; font-weight:800; } .field input,.field textarea { width:100%; border:1px solid #77808c; background:var(--ink-2); color:var(--text); outline:0; } .field input { height:54px; padding:0 14px; } .field textarea { min-height:142px; padding:14px; resize:vertical; } .field input:focus,.field textarea:focus { border-color:var(--blue-light); box-shadow:0 0 0 3px rgba(127,158,240,.23); } .field input.invalid,.field textarea.invalid { border-color:#ff8b98; } .field-error { display:block; min-height:17px; margin-top:7px; color:#ff9fa9; font-size:12px; font-weight:750; } .form-button { margin-top:26px; } .form-status { min-height:22px; margin:14px 0 0; color:var(--blue-light); font-size:13px; font-weight:800; }
.site-footer { padding:74px 0 28px; background:var(--ink); } .footer-main { display:grid; grid-template-columns:1.45fr .55fr .9fr; gap:70px; padding-bottom:64px; } .footer-brand .wordmark { margin-bottom:22px; } .footer-brand p { max-width:440px; margin:0; color:var(--muted); line-height:1.65; } .footer-column h3 { margin:0 0 22px; color:var(--blue-light); font-size:10px; font-weight:850; letter-spacing:1.3px; text-transform:uppercase; } .footer-column a { display:block; width:fit-content; margin:0 0 14px; color:rgba(241,244,247,.7); font-size:14px; overflow-wrap:anywhere; } .footer-legal { padding:24px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:var(--muted); font-size:12px; line-height:1.6; } .footer-legal p { margin:0; } .footer-bottom { display:flex; justify-content:space-between; gap:24px; padding-top:24px; color:rgba(241,244,247,.47); font-size:12px; } .footer-bottom p { margin:0; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .72s cubic-bezier(.16,1,.3,1),transform .72s cubic-bezier(.16,1,.3,1); } .reveal.is-visible { opacity:1; transform:none; }
.legal-page { min-height:100dvh; background:var(--paper); } .legal-header { position:sticky; top:0; z-index:10; border-bottom:1px solid var(--line); background:rgba(17,19,22,.95); backdrop-filter:blur(14px); } .legal-nav { min-height:72px; display:flex; align-items:center; justify-content:space-between; gap:24px; } .legal-back { color:var(--muted); font-size:13px; font-weight:750; } .legal-main { padding:90px 0 120px; } .legal-hero { max-width:880px; margin-bottom:70px; } .legal-hero p { margin:0 0 18px; color:var(--blue-light); font-size:11px; font-weight:850; letter-spacing:1.5px; text-transform:uppercase; } .legal-hero h1 { margin:0; font-size:clamp(45px,7vw,86px); line-height:.98; } .legal-hero time { display:block; margin-top:24px; color:var(--muted); font-size:14px; } .legal-content { display:grid; grid-template-columns:260px minmax(0,760px); gap:clamp(48px,9vw,120px); } .legal-index { position:sticky; top:112px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:13px; line-height:1.6; } .legal-index strong { display:block; margin-bottom:10px; color:var(--text); } .legal-article section { padding:34px 0; border-top:1px solid var(--line); } .legal-article section:first-child { padding-top:18px; } .legal-article h2 { margin:0 0 16px; font-size:clamp(25px,3vw,36px); line-height:1.15; } .legal-article p,.legal-article li { color:var(--muted); font-size:16px; line-height:1.75; } .legal-article a { color:var(--blue-light); text-decoration:underline; text-underline-offset:3px; }
@media (prefers-color-scheme: light) { :root { --paper:#eef1f5; --surface:#f7f9fb; --surface-2:#dfe5ed; --text:#121820; --muted:#596470; --line:rgba(18,24,32,.18); --blue:#295dcc; --blue-light:#295dcc; --on-blue:#f4f7ff; } .site-header,.legal-header { background:rgba(17,19,22,.94); color:#f1f4f7; } .hero { color:#f7f9fc; } .hero-summary { color:rgba(247,249,252,.77); } .collection-lead { color:var(--on-blue); } .collection-lead>p:not(.collection-label) { color:rgba(244,247,255,.78); } .ink-link { color:var(--on-blue); } .card-blue { background:#b9c8f2; color:#121820; } .card-blue p { color:#4d5968; } .collection-card:hover { background:#cbd7f6; } .field input,.field textarea { background:#fff; color:#121820; } }
@media (max-width:960px) { .nav-links { position:fixed; inset:var(--header) 0 auto; padding:26px 24px 30px; display:none; align-items:stretch; flex-direction:column; gap:20px; background:var(--ink); border-bottom:1px solid var(--line); } .nav-links.open { display:flex; } .nav-links .button { width:100%; } .menu-button { display:block; } .collection-lead { grid-column:span 7; } .collection-card { grid-column:span 5; } .selection-grid { grid-template-columns:1fr; } .selection-copy { position:static; } .editorial { grid-template-columns:1fr; } .editorial-image { min-height:560px; } .facts-grid { grid-template-columns:repeat(2,1fr); } .fact:nth-child(3) { border-left:1px solid rgba(9,19,41,.38); } .contact-grid { grid-template-columns:1fr; } .contact-copy { position:static; } .footer-main { grid-template-columns:1fr 1fr; } .footer-brand { grid-column:1/-1; } .legal-content { grid-template-columns:1fr; } .legal-index { position:static; } }
@media (max-width:620px) { .shell { width:min(calc(100% - 32px),var(--max)); } .hero { min-height:760px; } .hero-media { background-position:64% center; } .hero::after { background:linear-gradient(90deg,rgba(10,12,15,.84),rgba(10,12,15,.27)); } .hero-content { padding-top:calc(var(--header) + 42px); padding-bottom:48px; } .hero h1 { max-width:340px; font-size:48px; line-height:1; } .hero-summary { max-width:335px; font-size:17px; } .hero-actions { max-width:320px; flex-direction:column; align-items:stretch; gap:10px; } .hero-actions .text-link { justify-content:space-between; } .lines,.selection,.contact { padding:80px 0; } .section-intro h2,.selection-copy h2,.editorial-copy h2,.contact-copy h2 { font-size:42px; } .section-intro p,.selection-copy p,.editorial-copy>p,.contact-copy>p { font-size:16px; } .collection-lead,.collection-card,.collection-card:nth-child(4) { grid-column:1/-1; } .collection-lead { min-height:400px; padding:28px 22px; } .collection-lead h3 { font-size:42px; } .collection-card { min-height:230px; padding:26px 22px; border-left:0; } .note { grid-template-columns:42px 1fr; gap:14px; min-height:0; } .note p { grid-column:2; } .editorial-copy { padding:72px 20px; } .editorial-image { min-height:420px; } .fact { min-height:160px; padding:20px 16px; } .fact strong { font-size:27px; } .contact-form { padding:28px 20px; } .form-grid { grid-template-columns:1fr; } .field-full { grid-column:auto; } .footer-main { grid-template-columns:1fr; gap:38px; } .footer-brand { grid-column:auto; } .footer-bottom { flex-direction:column; } .legal-main { padding:68px 0 88px; } .legal-hero { margin-bottom:54px; } .legal-hero h1 { font-size:48px; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; } .reveal,.hero-enter { opacity:1; transform:none; } .hero-media { transform:none; } }