@layer components{.id-hero{padding-top:8px}.id-hero .dark-panel{padding-block:clamp(56px,9vw,120px)}.id-hero__inner{grid-template-columns:minmax(0,1fr);align-items:center;gap:clamp(24px,4vw,48px);display:grid;position:relative}.id-hero__text>*+*{margin-top:var(--s-4)}.id-hero__title{color:var(--dark-ink);font-size:clamp(2.75rem,1.2rem + 6vw,6rem)}.id-hero__text .lead{max-width:30rem;color:var(--dark-ink-2)}.id-hero__glow{aspect-ratio:3/2;pointer-events:none;mix-blend-mode:screen;justify-self:center;width:min(100%,560px);position:relative}.id-hero__glow img{object-fit:contain;width:100%;height:100%}@media (width>=900px){.id-hero__inner{grid-template-columns:minmax(0,6fr) minmax(0,6fr)}.id-hero__glow{width:100%}}.id-section{padding-block:clamp(56px,8vw,112px)}.id-head{max-width:40rem;margin-bottom:clamp(28px,4vw,48px)}.id-head>*+*{margin-top:var(--s-3)}.id-head h2{font-size:clamp(1.75rem,1.1rem + 2.2vw,2.75rem)}.id-tiles{grid-template-columns:minmax(0,1fr);gap:16px;display:grid}@media (width>=640px){.id-tiles--2,.id-tiles--4{grid-template-columns:repeat(2,minmax(0,1fr))}.id-tiles--3{grid-template-columns:minmax(0,1fr)}}@media (width>=900px){.id-tiles--3{grid-template-columns:repeat(3,minmax(0,1fr))}.id-tiles--4{grid-template-columns:repeat(4,minmax(0,1fr))}}.id-tile{justify-content:center;align-items:center;gap:var(--s-5);border-radius:var(--r-lg);min-height:clamp(200px,26vw,300px);box-shadow:0 0 0 1px var(--line);flex-direction:column;padding:clamp(24px,4vw,48px);display:flex;position:relative;overflow:hidden}.id-tile .logo{width:min(100%,380px);height:auto}.id-tiles--3 .id-tile .logo{width:min(100%,300px)}.id-tile figcaption,.id-tile__label{letter-spacing:.02em;font-size:.8125rem;font-weight:500}.id-tile--light{background:var(--surface);color:var(--ink-3)}.id-tile--mineral{background:var(--mineral);color:var(--ink-3)}.id-tile--dark{background:var(--graphite);color:var(--dark-ink-3);box-shadow:none}.id-tile--blue{background:var(--blue);color:#fff;box-shadow:none}.id-tile--symbol{min-height:clamp(180px,22vw,240px)}.id-symbol{width:clamp(72px,9vw,104px);display:block}.id-symbol .simbolo{width:100%;height:auto}.id-symbol--blue{color:var(--blue)}.id-symbol--white{color:#fff}.id-appicon{filter:drop-shadow(0 10px 18px #2d5bff47);width:clamp(72px,9vw,104px);height:auto}.id-palette{grid-template-columns:minmax(0,1fr);gap:14px;display:grid}@media (width>=640px){.id-palette{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.id-palette{grid-template-columns:repeat(4,minmax(0,1fr))}}.swatch{border-radius:var(--r-lg);background:var(--sw);min-height:clamp(200px,24vw,280px);color:var(--on);flex-direction:column;justify-content:space-between;gap:clamp(56px,8vw,104px);padding:clamp(18px,2.4vw,26px);display:flex}.swatch--outlined{box-shadow:0 0 0 1px var(--line-strong)}.swatch__top{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.swatch__name{letter-spacing:-.01em;color:inherit;font-size:1.0625rem;font-weight:650}.swatch__hex{letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:inherit;font-size:clamp(1.5rem,1.1rem + 1vw,1.875rem);font-weight:650}.swatch__role{min-height:1.4em;color:inherit;margin-top:.35rem;font-size:.875rem;line-height:1.4}.swatch__copy{border-radius:var(--r-pill);background:var(--chip);min-height:40px;color:var(--on);transition:background-color var(--t-fast) var(--ease);align-items:center;gap:.4rem;padding:0 .8rem;font-size:.8125rem;font-weight:600;display:inline-flex}.swatch__copy:focus-visible{outline-color:var(--on)}@media (hover:hover){.swatch__copy:hover{background:var(--chip-hover)}}.id-apps{grid-template-columns:minmax(0,1fr);gap:clamp(20px,3vw,32px);display:grid}@media (width>=720px){.id-apps{grid-template-columns:repeat(2,minmax(0,1fr))}}.id-app picture,.id-app img{border-radius:var(--r-lg);background:var(--surface-soft);width:100%;height:auto;display:block}.id-app__label{color:var(--ink);margin-top:.75rem;font-size:.875rem;font-weight:600}.id-app__label span{color:var(--ink-3);font-weight:400}.id-back{margin-top:clamp(40px,6vw,72px)}.id-back__icon{transform:scaleX(-1)}@media (hover:hover){.id-back .link-arrow:hover svg{transform:scaleX(-1)translate(3px)}}}