/* Written by tiers/immersive/build.js from content/work.json and assets/manifest.json. Do not edit by hand.
   Per item: desktop column span and plate ratio (also as a number, --ar-d, for views sized by height), phone ratio
   (the art-directed phone crop), focal points, and the
   shared-element name that carries the image from the gallery to its project page (full motion tier only). */
/* Voice agents: Round object: whole speaker on desktop; the phone crop keeps the waveform and inner rings. */
.item[data-id="voice"] { --span: 7; --ratio-d: 4 / 3; --ar-d: 1.3333; --ratio-m: 4 / 5; }
.project[data-id="voice"] .project-media { --ratio-m: 4 / 5; }
[data-id="voice"] .plate img { --focal-d: 50% 50%; --focal-m: 50% 48%; }
html[data-motion="full"] .item[data-id="voice"] .item-media, html[data-motion="full"] .project[data-id="voice"] .project-media { view-transition-name: work-voice; }

/* A secure foundation: Tall object: sits in the portrait slot on desktop; the phone crop trims the empty floor and sky. */
.item[data-id="foundation"] { --span: 5; --ratio-d: 4 / 5; --ar-d: 0.8; --ratio-m: 4 / 5; }
.project[data-id="foundation"] .project-media { --ratio-m: 4 / 5; }
[data-id="foundation"] .plate img { --focal-d: 50% 45%; --focal-m: 50% 45%; }
html[data-motion="full"] .item[data-id="foundation"] .item-media, html[data-motion="full"] .project[data-id="foundation"] .project-media { view-transition-name: work-foundation; }

/* Websites: Design before build: the compass stands for the drawing stage of every site. */
.item[data-id="websites"] { --span: 5; --ratio-d: 4 / 5; --ar-d: 0.8; --ratio-m: 4 / 5; }
.project[data-id="websites"] .project-media { --ratio-m: 4 / 5; }
[data-id="websites"] .plate img { --focal-d: 48% 50%; --focal-m: 48% 50%; }
html[data-motion="full"] .item[data-id="websites"] .item-media, html[data-motion="full"] .project[data-id="websites"] .project-media { view-transition-name: work-websites; }

/* Business platform: Long diagonal object: wide slot on desktop; the phone gets a square crop on the middle slots and the node. */
.item[data-id="platform"] { --span: 7; --ratio-d: 16 / 10; --ar-d: 1.6; --ratio-m: 1 / 1; }
.project[data-id="platform"] .project-media { --ratio-m: 1 / 1; }
[data-id="platform"] .plate img { --focal-d: 50% 50%; --focal-m: 50% 55%; }
html[data-motion="full"] .item[data-id="platform"] .item-media, html[data-motion="full"] .project[data-id="platform"] .project-media { view-transition-name: work-platform; }

/* Routine work, automated: Busy object: whole machine on desktop; the phone crop keeps the feeder and the traced paths. */
.item[data-id="automation"] { --span: 5; --ratio-d: 1 / 1; --ar-d: 1; --ratio-m: 4 / 5; }
.project[data-id="automation"] .project-media { --ratio-m: 4 / 5; }
[data-id="automation"] .plate img { --focal-d: 50% 55%; --focal-m: 50% 50%; }
html[data-motion="full"] .item[data-id="automation"] .item-media, html[data-motion="full"] .project[data-id="automation"] .project-media { view-transition-name: work-automation; }

/* Client portals and custom systems: Horizontal object: wide slot on desktop; the phone gets a square crop on the fitted joint. */
.item[data-id="portals"] { --span: 6; --ratio-d: 16 / 10; --ar-d: 1.6; --ratio-m: 1 / 1; }
.project[data-id="portals"] .project-media { --ratio-m: 1 / 1; }
[data-id="portals"] .plate img { --focal-d: 55% 50%; --focal-m: 55% 50%; }
html[data-motion="full"] .item[data-id="portals"] .item-media, html[data-motion="full"] .project[data-id="portals"] .project-media { view-transition-name: work-portals; }

/* nexverto.com link rule: no link carries a resting underline. */
a { text-decoration: none !important; }