https://adrianotenore.com Adriano Tenore Mon, 15 Jun 2026 14:36:54 +0000 https://adrianotenore.com en https://adrianotenore.com/ROGER-VIVIER-VIVIER-EXPRESS-old Fri, 26 Apr 2024 16:12:57 +0000 Adriano Tenore https://adrianotenore.com/ROGER-VIVIER-VIVIER-EXPRESS-old Roger vivier vivier express3d landscape and foliage design for the first episode of roger vivier icons campaign vivier express starring laura dern https://adrianotenore.com/UC-Game-Selection Thu, 30 Oct 2025 11:52:23 +0000 Adriano Tenore https://adrianotenore.com/UC-Game-Selection /* ============ SETTINGS ============ */ /* global font for both links */ .footer-links small { font-size: 0.9rem; } /* STREAM (first line) */ .footer-links .link-stream { --move-x: -45px; /* main title X */ --move-y: 0px; /* main title Y */ /* subtext controls */ --sub-move-x: 0px; /* subtext X */ --sub-move-y: 0px; /* subtext Y (positive = under the title) */ --sub-size: 1.3rem; /* subtext font size */ --sub-align: center; /* left | center | right */ } .footer-links .link-stream small { font-size: 3rem; /* size only for "Stream" */ display: inline-block; transform: translate(var(--move-x), var(--move-y)); } .footer-links .link-stream .subtext-stream { display: block; font-size: var(--sub-size); transform: translate(var(--sub-move-x), var(--sub-move-y)); text-align: var(--sub-align); color: #fff; } /* DOWNLOAD (second line) */ .footer-links .link-download { --move-x: 45px; /* main title X */ --move-y: 0px; /* main title Y */ /* subtext controls */ --sub-move-x: 0px; /* subtext X */ --sub-move-y: 0px; /* subtext Y */ --sub-size: 1.3rem; /* subtext font size */ --sub-align: center; /* left | center | right */ } .footer-links .link-download small { font-size: 3rem; /* size only for "Download" */ display: inline-block; transform: translate(var(--move-x), var(--move-y)); } .footer-links .link-download .subtext-download { display: block; font-size: var(--sub-size); transform: translate(var(--sub-move-x), var(--sub-move-y)); text-align: var(--sub-align); color: #fff; } /* ================================== */ StreaM might experience some delays and lag due to the amount of players&nbsp;connected Download (WINDOWS ONLY) highly recommended for better performances. /* ================== FONT SETTINGS — CHANGE HERE ================== */ :root{ /* Set your preferred font stack for the LEFT text */ --ip-font-family: "Optician Sans", system-ui, -apple-system, "Segoe UI", Roboto, "Karla", Arial, sans-serif; /* Desktop position & size */ --text-left: 12vw; --text-left-tweak: 0vw; --text-left-effective: calc(var(--text-left) + var(--text-left-tweak)); --ip-top: 52vh; --text-size: 2.2rem; --text-line: 1.28; } /* ================================================================ */ html,body { overflow:hidden; height:100%; } #ip-scope{ position:relative; z-index:0; } .ip-item{ position:fixed; transform:translate(-50%,-50%); z-index:9000; } /* Desktop position */ .info-item{ left:var(--text-left-effective); top:var(--ip-top); transform:translate(0,-50%); } /* LEFT: flowing text (desktop), wraps toward screen center */ .ip-label{ display:block; max-width: calc(50vw - var(--text-left-effective) - 2vw); color:#fff; font-family: var(--ip-font-family); font-size: var(--text-size); line-height: var(--text-line); text-shadow: 0 2px 6px rgba(0,0,0,.35), 0 0 10px rgba(0,0,0,.22); overflow-wrap:anywhere; word-break:normal; text-align:left; margin:0; } /* ===== Mobile portrait overrides ===== */ @media (max-width:768px) and (orientation:portrait){ :root{ --text-left-mobile: 12vw; --text-left-mobile-tweak: 0vw; --text-left-mobile-effective: calc(var(--text-left-mobile) + var(--text-left-mobile-tweak)); /* How far the text can extend to the right (50vw = centered) */ --text-right-limit-mobile: 90vw; --text-right-gutter-mobile: 4vw; --text-size-mobile: 1.4rem; --text-line-mobile: 1.28; /* (Optional) use a different font only on mobile: --ip-font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; */ } .info-item{ left:var(--text-left-mobile-effective); top:56vh; transform:translate(0,-50%); } .ip-label{ max-width: calc(var(--text-right-limit-mobile) - var(--text-left-mobile-effective) - var(--text-right-gutter-mobile)); font-size: var(--text-size-mobile); line-height: var(--text-line-mobile); text-shadow: 0 1px 4px rgba(0,0,0,.4), 0 0 8px rgba(0,0,0,.25); } } https://adrianotenore.com/UMBRA-CHROMATICA-1 Fri, 05 Jun 2026 07:43:51 +0000 Adriano Tenore https://adrianotenore.com/UMBRA-CHROMATICA-1 /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ ProjectUmbra Chromatica2025 VIRTUAL PAVILION / UNREAL ENGINE 5 UMBRA CHROMATICA Year2025 FormatOpen world / UE5 MethodReal-time 3D ContextThe Wrong Biennale ‘25 Umbra Chromatica is an open world, network-streamed art pavilion developed in Unreal Engine 5 and presented as part of The Wrong Biennale ‘25. Conceived as a navigable desert world, the project exists at the intersection of contemporary art, game design and spatial cinema. Visitors explore the pavilion in real time, traversing an open landscape where monumental architectural forms emerge from the sand, each hosting a distinct artwork created by the selected international artists. The desert serves as a symbolic and structural device: an open, silent, and timeless field where each structure appears simultaneously ancient and synthetic, suggesting an archaeology of possible futures rather than a reconstruction of the past. The pavilion operates as a distributed organism. Artworks are not contained within a building, but embedded into the terrain, encountered through exploration, distance, and orientation. Scale, isolation, and traversal become part of the perceptual experience. I developed Umbra Chromatica as part of The Wrong Biennale 2025, an international digital art biennale dedicated to new media, virtual environments, and internet-based artistic practices. Within this context, the pavilion functions both as an artwork and as an exhibition platform hosting additional artworks. Umbra Chromatica proposes a shift from exhibition as container to exhibition as territory: a space that exists only through traversal, perception, and presence. &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; -PLAY- <img width="648" height="810" width_o="648" height_o="810" data-src="https://freight.cargo.site/t/original/i/7817ce109fdbbc27b20c9b201c8c14612b0f6e79f6236c0dd579330b1b4a4a98/Gif1.gif" data-mid="249140493" border="0" data-scale="19" src="https://freight.cargo.site/w/648/i/7817ce109fdbbc27b20c9b201c8c14612b0f6e79f6236c0dd579330b1b4a4a98/Gif1.gif" /> <img width="648" height="810" width_o="648" height_o="810" data-src="https://freight.cargo.site/t/original/i/022aedb4120682d7c13307268164c5c1521721bf02b7d82a422d9d503f3cc8bd/Gif2.gif" data-mid="249140494" border="0" data-scale="19" src="https://freight.cargo.site/w/648/i/022aedb4120682d7c13307268164c5c1521721bf02b7d82a422d9d503f3cc8bd/Gif2.gif" /> <img width="688" height="860" width_o="688" height_o="860" data-src="https://freight.cargo.site/t/original/i/8b98b33937771f2b82f0019f37ab14987eb24442b167fff9e0159b301dd7692d/Gif3.gif" data-mid="249140495" border="0" data-scale="19" src="https://freight.cargo.site/w/688/i/8b98b33937771f2b82f0019f37ab14987eb24442b167fff9e0159b301dd7692d/Gif3.gif" /> <img width="1579" height="661" width_o="1579" height_o="661" data-src="https://freight.cargo.site/t/original/i/559752a6499399cd64f02335f900501545eda9b06a0e86df285d007f49ee6ca4/HighresScreenshot00009.png" data-mid="249140456" border="0" src="https://freight.cargo.site/w/1000/i/559752a6499399cd64f02335f900501545eda9b06a0e86df285d007f49ee6ca4/HighresScreenshot00009.png" /> <img width="1502" height="628" width_o="1502" height_o="628" data-src="https://freight.cargo.site/t/original/i/aec74ed089325255721d47282c307246310a11c74ab83901d39d0d56c1926e6e/HighresScreenshot00068.png" data-mid="249140461" border="0" src="https://freight.cargo.site/w/1000/i/aec74ed089325255721d47282c307246310a11c74ab83901d39d0d56c1926e6e/HighresScreenshot00068.png" /> <img width="1502" height="628" width_o="1502" height_o="628" data-src="https://freight.cargo.site/t/original/i/2b871d8c5b47065f373e6c6681bebe109aff366abeda393c69dabf6918837213/HighresScreenshot00069.png" data-mid="249140462" border="0" src="https://freight.cargo.site/w/1000/i/2b871d8c5b47065f373e6c6681bebe109aff366abeda393c69dabf6918837213/HighresScreenshot00069.png" /> <img width="1102" height="461" width_o="1102" height_o="461" data-src="https://freight.cargo.site/t/original/i/43217aca70f6ef375bf66e594f92e6173db76e8761a728893ebe38430527225b/HighresScreenshot00051_SceneColor.png" data-mid="249140460" border="0" src="https://freight.cargo.site/w/1000/i/43217aca70f6ef375bf66e594f92e6173db76e8761a728893ebe38430527225b/HighresScreenshot00051_SceneColor.png" /> <img width="2095" height="877" width_o="2095" height_o="877" data-src="https://freight.cargo.site/t/original/i/67bf10a38b0bebe702dddcf63abbbe07ea87bafb48f6b1c91d39a4270991ee97/HighresScreenshot00039.png" data-mid="249140468" border="0" src="https://freight.cargo.site/w/1000/i/67bf10a38b0bebe702dddcf63abbbe07ea87bafb48f6b1c91d39a4270991ee97/HighresScreenshot00039.png" /> <img width="1495" height="626" width_o="1495" height_o="626" data-src="https://freight.cargo.site/t/original/i/b9ce90adcd3d5c958d5beab3d4ef4bde692765560ba898efdb46abf684663744/HighresScreenshot00033.png" data-mid="249140458" border="0" src="https://freight.cargo.site/w/1000/i/b9ce90adcd3d5c958d5beab3d4ef4bde692765560ba898efdb46abf684663744/HighresScreenshot00033.png" /> <img width="1466" height="614" width_o="1466" height_o="614" data-src="https://freight.cargo.site/t/original/i/83a83b68f50725d8dcb8a07fc8c0225d670c18457815713d11e09dd848ef67cf/HighresScreenshot00016.png" data-mid="249140457" border="0" src="https://freight.cargo.site/w/1000/i/83a83b68f50725d8dcb8a07fc8c0225d670c18457815713d11e09dd848ef67cf/HighresScreenshot00016.png" /> <img width="1579" height="661" width_o="1579" height_o="661" data-src="https://freight.cargo.site/t/original/i/4fe6ebcdab462730629c3eea66e8dcc23ed02200fe8cfdc676c5807325755fe2/HighresScreenshot00007.png" data-mid="249140454" border="0" src="https://freight.cargo.site/w/1000/i/4fe6ebcdab462730629c3eea66e8dcc23ed02200fe8cfdc676c5807325755fe2/HighresScreenshot00007.png" /> <img width="1579" height="661" width_o="1579" height_o="661" data-src="https://freight.cargo.site/t/original/i/5c044fe4ad9227b511790286b3ccd17a14f24a33040dc170838246bb72f4d03d/HighresScreenshot00008.png" data-mid="249140455" border="0" src="https://freight.cargo.site/w/1000/i/5c044fe4ad9227b511790286b3ccd17a14f24a33040dc170838246bb72f4d03d/HighresScreenshot00008.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/a77af3ee66cfd7daabcfeb25e1fa42c2be08cf46634830e63bf965b17209f390/HighresScreenshot00062.png" data-mid="249140477" border="0" src="https://freight.cargo.site/w/1000/i/a77af3ee66cfd7daabcfeb25e1fa42c2be08cf46634830e63bf965b17209f390/HighresScreenshot00062.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/e34b5b4bc36531efda6047e1f8323f762e774d82c2550bf8dec43a28c2a905cd/HighresScreenshot00061.png" data-mid="249140478" border="0" src="https://freight.cargo.site/w/1000/i/e34b5b4bc36531efda6047e1f8323f762e774d82c2550bf8dec43a28c2a905cd/HighresScreenshot00061.png" /> <img width="1545" height="646" width_o="1545" height_o="646" data-src="https://freight.cargo.site/t/original/i/38ada2fd891660f9d550d0fceffca4af91305789a51ee449acfa909bab007531/HighresScreenshot00006.png" data-mid="249140453" border="0" src="https://freight.cargo.site/w/1000/i/38ada2fd891660f9d550d0fceffca4af91305789a51ee449acfa909bab007531/HighresScreenshot00006.png" /> <img width="1925" height="805" width_o="1925" height_o="805" data-src="https://freight.cargo.site/t/original/i/93bf5162211739f64c1ebe01a1eadaf626ea9b93aa14d60171b7c3225e6bd614/HighresScreenshot00004.png" data-mid="249140485" border="0" src="https://freight.cargo.site/w/1000/i/93bf5162211739f64c1ebe01a1eadaf626ea9b93aa14d60171b7c3225e6bd614/HighresScreenshot00004.png" /> <img width="1494" height="625" width_o="1494" height_o="625" data-src="https://freight.cargo.site/t/original/i/34101d3a463abce886c55b4f4c709294e63597adcd8effe9a7f7af8b276e8621/HighresScreenshot00046.png" data-mid="249140459" border="0" src="https://freight.cargo.site/w/1000/i/34101d3a463abce886c55b4f4c709294e63597adcd8effe9a7f7af8b276e8621/HighresScreenshot00046.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/e0a5f015634487e364a20f21031f22b881a3fd289f029e867ffaf92968558e3b/HighresScreenshot00059.png" data-mid="249140480" border="0" src="https://freight.cargo.site/w/1000/i/e0a5f015634487e364a20f21031f22b881a3fd289f029e867ffaf92968558e3b/HighresScreenshot00059.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/79f21c32e8507c8e5dc50a2fff915794a9cd2b3ab4015d67cb9beaef13e5deea/HighresScreenshot00065.png" data-mid="249140475" border="0" src="https://freight.cargo.site/w/1000/i/79f21c32e8507c8e5dc50a2fff915794a9cd2b3ab4015d67cb9beaef13e5deea/HighresScreenshot00065.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/0b2d9b1b9e2fa4d6fe7d4cf960fa95472af979b8b9c280eba5131362dbcfc488/HighresScreenshot00058.png" data-mid="249140481" border="0" src="https://freight.cargo.site/w/1000/i/0b2d9b1b9e2fa4d6fe7d4cf960fa95472af979b8b9c280eba5131362dbcfc488/HighresScreenshot00058.png" /> <img width="1530" height="640" width_o="1530" height_o="640" data-src="https://freight.cargo.site/t/original/i/6150d76709ce12fd7c7559d2c36eb8b6509579d2f30a9c2f9d13a34d84a04cf6/HighresScreenshot_2025.09.25-11.13.50.png" data-mid="249140452" border="0" src="https://freight.cargo.site/w/1000/i/6150d76709ce12fd7c7559d2c36eb8b6509579d2f30a9c2f9d13a34d84a04cf6/HighresScreenshot_2025.09.25-11.13.50.png" /> <img width="1460" height="611" width_o="1460" height_o="611" data-src="https://freight.cargo.site/t/original/i/a1ba187ba94fe6775714d1107acaffc6e42adf324d65cd89842b2a5862766442/HighresScreenshot00084.png" data-mid="249140463" border="0" src="https://freight.cargo.site/w/1000/i/a1ba187ba94fe6775714d1107acaffc6e42adf324d65cd89842b2a5862766442/HighresScreenshot00084.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/125df408a90b6fb298053f31be21caa52ffa4f4e98f5da49d1b6b292b2406adb/HighresScreenshot00054.png" data-mid="249140484" border="0" src="https://freight.cargo.site/w/1000/i/125df408a90b6fb298053f31be21caa52ffa4f4e98f5da49d1b6b292b2406adb/HighresScreenshot00054.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/655fc921481d0475a5d2e90e523ab6ee8c4dac83b8ff9a30c7337e0508a11c30/HighresScreenshot00057.png" data-mid="249140482" border="0" src="https://freight.cargo.site/w/1000/i/655fc921481d0475a5d2e90e523ab6ee8c4dac83b8ff9a30c7337e0508a11c30/HighresScreenshot00057.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/77b7b08bd9b6ec19749a24816b71f741206b83bb9dc35a89dda54af67843ade0/HighresScreenshot00060.png" data-mid="249140479" border="0" src="https://freight.cargo.site/w/1000/i/77b7b08bd9b6ec19749a24816b71f741206b83bb9dc35a89dda54af67843ade0/HighresScreenshot00060.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/11a36900dca90ada38033374e6ad92b17ceddf1b180646cbcb4892cc2aa5df7c/HighresScreenshot00067.png" data-mid="249140474" border="0" src="https://freight.cargo.site/w/1000/i/11a36900dca90ada38033374e6ad92b17ceddf1b180646cbcb4892cc2aa5df7c/HighresScreenshot00067.png" /> <img width="1744" height="730" width_o="1744" height_o="730" data-src="https://freight.cargo.site/t/original/i/4fd813ee7b664e49c936a6854c99842541809df7b462056411e0935d1925b7c1/HighresScreenshot00029.png" data-mid="249140466" border="0" src="https://freight.cargo.site/w/1000/i/4fd813ee7b664e49c936a6854c99842541809df7b462056411e0935d1925b7c1/HighresScreenshot00029.png" /> <img width="2095" height="877" width_o="2095" height_o="877" data-src="https://freight.cargo.site/t/original/i/bfa2cd6f2b956e48d0b51d504afac11877a03d87d308eca4025efa88f4c48e8f/HighresScreenshot00038.png" data-mid="249140467" border="0" src="https://freight.cargo.site/w/1000/i/bfa2cd6f2b956e48d0b51d504afac11877a03d87d308eca4025efa88f4c48e8f/HighresScreenshot00038.png" /> <img width="2095" height="877" width_o="2095" height_o="877" data-src="https://freight.cargo.site/t/original/i/40310133d46c65fe2f44f3c34da02342a9bb21b651e1d37d5dd184f6bd365acb/HighresScreenshot00041.png" data-mid="249140469" border="0" src="https://freight.cargo.site/w/1000/i/40310133d46c65fe2f44f3c34da02342a9bb21b651e1d37d5dd184f6bd365acb/HighresScreenshot00041.png" /> <img width="1560" height="653" width_o="1560" height_o="653" data-src="https://freight.cargo.site/t/original/i/435531e1ff19c82517ec8fa55da62485e75089731648ff4c833570f4aed64bfa/HighresScreenshot00089.png" data-mid="249140465" border="0" src="https://freight.cargo.site/w/1000/i/435531e1ff19c82517ec8fa55da62485e75089731648ff4c833570f4aed64bfa/HighresScreenshot00089.png" /> <img width="3860" height="1615" width_o="3860" height_o="1615" data-src="https://freight.cargo.site/t/original/i/695cc149387adeb0bd3a97d57789d63c6e9fe205ad6002653a6697ecd34383ee/HighresScreenshot00087.png" data-mid="249140472" border="0" src="https://freight.cargo.site/w/1000/i/695cc149387adeb0bd3a97d57789d63c6e9fe205ad6002653a6697ecd34383ee/HighresScreenshot00087.png" /> <img width="3602" height="1507" width_o="3602" height_o="1507" data-src="https://freight.cargo.site/t/original/i/6ec51c3d395a3d92e73fed5df1b43335e9e1e817fc44182e67f7f54c2e748d84/HighresScreenshot00065.png" data-mid="249140486" border="0" src="https://freight.cargo.site/w/1000/i/6ec51c3d395a3d92e73fed5df1b43335e9e1e817fc44182e67f7f54c2e748d84/HighresScreenshot00065.png" /> <img width="3634" height="1730" width_o="3634" height_o="1730" data-src="https://freight.cargo.site/t/original/i/564080450447c52a38c5dd19b638ec3147afd068821a9c1842d768d8c3cf601d/HighresScreenshot00155.png" data-mid="249140471" border="0" src="https://freight.cargo.site/w/1000/i/564080450447c52a38c5dd19b638ec3147afd068821a9c1842d768d8c3cf601d/HighresScreenshot00155.png" /> <img width="1560" height="653" width_o="1560" height_o="653" data-src="https://freight.cargo.site/t/original/i/cef7dc776fb95382e4a0192e26e86b6a1abb7b301deb808f0ef4c0bccdd5035e/HighresScreenshot00088.png" data-mid="249140464" border="0" src="https://freight.cargo.site/w/1000/i/cef7dc776fb95382e4a0192e26e86b6a1abb7b301deb808f0ef4c0bccdd5035e/HighresScreenshot00088.png" /> <img width="1744" height="730" width_o="1744" height_o="730" data-src="https://freight.cargo.site/t/original/i/2eed7a76f2df06709936dc3abe8ca5dabb80c814ddd029be277323deeed6ec4a/HighresScreenshot00022.png" data-mid="249140487" border="0" src="https://freight.cargo.site/w/1000/i/2eed7a76f2df06709936dc3abe8ca5dabb80c814ddd029be277323deeed6ec4a/HighresScreenshot00022.png" /> <img width="853" height="480" width_o="853" height_o="480" data-src="https://freight.cargo.site/t/original/i/2cd91148e476e289104acaa1a98b1cf59ff6c8be4f564cd0cd6dfac45c289ba4/WIP_Character_1-1.gif" data-mid="249140491" border="0" data-scale="29" src="https://freight.cargo.site/w/853/i/2cd91148e476e289104acaa1a98b1cf59ff6c8be4f564cd0cd6dfac45c289ba4/WIP_Character_1-1.gif" /><img width="800" height="450" width_o="800" height_o="450" data-src="https://freight.cargo.site/t/original/i/fd5ae806deb506c526b6f153edae58ee23853f4489cc9068d6b1839b77bc2e7d/WIP-Landscape-Buildings-ezgif.com-video-to-gif-converter.gif" data-mid="249140490" border="0" data-scale="30" src="https://freight.cargo.site/w/800/i/fd5ae806deb506c526b6f153edae58ee23853f4489cc9068d6b1839b77bc2e7d/WIP-Landscape-Buildings-ezgif.com-video-to-gif-converter.gif" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;︎ https://adrianotenore.com/VILE-FLOWER-1 Mon, 01 Jun 2026 15:01:24 +0000 Adriano Tenore https://adrianotenore.com/VILE-FLOWER-1 /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ Project File Vile Flower2024 FILM / DIRECTION VILE FLOWER Runtime05:35 Year2024 FormatShort film / 4K MethodPhotography + AI A one-shot sequence blurs the boundaries between waking and dream, familiar fragments of daily existence take part in a spectral dance of rippling memories as seen by a quiet presence floating at the edge of time. This journey imagines the gaze of my father—after his passing—wandering through the scattered traces of my recent life, as if trying to understand who I’ve become in his absence. Starting from a selection of photographs taken over the past years, each still image is bridged to the next one with the help of AI, developing a journey that aims to express itself through a visual language rather than construct narrative. Vile Flower is shaped through a spontaneous reinterpretation of past memories, which following an emotional logic creates a dynamic sequence that unfolds as a stream of consciousness. Camera movements and timing carefully craft a rhythm that feels instinctive and intimate. The sound design, fully developed by the artist, weaves together the visual flow with a tactile, immersive presence https://adrianotenore.com/BESTIARIO-SINTETICO Fri, 05 Jun 2026 11:15:52 +0000 Adriano Tenore https://adrianotenore.com/BESTIARIO-SINTETICO /* ===== BESTIARIO SINTETICO — specimen grid layout ===== */ .proj{ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --col-gap:clamp(40px,6vw,90px); } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:26px;border-bottom:1px solid var(--line);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 18px;text-transform:uppercase;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);margin-right:10px;vertical-align:middle;} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.01em;margin:0;text-transform:uppercase;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta div{display:flex;flex-direction:column;gap:6px;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;} .proj-meta dd{margin:0;font-size:15px !important;font-weight:500;} /* intro */ .proj-intro{display:grid;grid-template-columns:1fr 1fr;gap:var(--col-gap);align-items:start;padding:clamp(34px,5vw,60px) 0 clamp(10px,2vw,20px);} .proj-lead{font-size:clamp(20px,2vw,26px) !important;line-height:1.28 !important;font-weight:500;margin:0;} .proj-lead .hl{color:var(--accent);} .proj-p{font-size:15px !important;line-height:1.55 !important;color:#cfcfcf;margin:0;} .proj-p a{color:var(--accent);text-decoration:none;border-bottom:1px solid rgba(212,255,0,.4);} .proj-p a:hover{border-color:var(--accent);} .proj-p .name{color:var(--accent);} /* section label */ .sec-label{display:flex;align-items:center;gap:14px;font-size:10px !important;letter-spacing:.3em !important;color:var(--muted);text-transform:uppercase;margin:clamp(40px,5vw,70px) 0 24px;} .sec-label::after{content:"";flex:1;height:1px;background:var(--line);} /* specimen grid: square creature videos */ .specimens{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(14px,2vw,26px);} .specimen{position:relative;} .specimen .sq{position:relative;width:100%;padding-top:100%;overflow:hidden;background:#0a0a0a;} .specimen .sq iframe{position:absolute;inset:0;width:100% !important;height:100% !important;border:0;} .specimen .tag{font-size:9px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:10px 0 0;} /* dialogue / credits block */ .proj-dialogue{display:grid;grid-template-columns:1fr 1fr;gap:var(--col-gap);align-items:start;padding:clamp(40px,5vw,70px) 0 clamp(20px,3vw,34px);border-top:1px solid var(--line);margin-top:clamp(40px,5vw,70px);} /* native image gallery */ .image-gallery{margin:clamp(20px,3vw,34px) 0;} /* closing note */ .proj-note{font-size:13px !important;line-height:1.55 !important;color:var(--muted);font-style:italic;padding:clamp(24px,3vw,40px) 0 0;border-top:1px solid var(--line);} @media(max-width:900px){ .specimens{grid-template-columns:repeat(2,1fr);} .proj-intro,.proj-dialogue{grid-template-columns:1fr;gap:22px;} } Project File Bestiario Sintetico2024 SPECULATIVE BIOLOGY / 3D Bestiario Sintetico Year2024 FormatOngoing serie MethodAi Recursive generation ContextForesta di Cristallo An ongoing surreal bestiary gathering a selection of submarine creatures, emerging from nature's struggle to process human pollution and environmental impact. Each specimen recombines organic and artificial matter into new forms of biological adaptation — a catalogue of lifeforms imagined at the threshold between ecology and machine. The Specimens — N.001 / N.008 N.001 N.002 N.003 N.004 N.005 N.006 N.007 N.008 Bestiario Sintetico started in dialogue with Collezione Agovino and Francesca Blandino. The intent: building a visual archive of speculative lifeforms reflecting the complex interplay between ecological disruption and adaptive mutation. Archive Stills <img width="900" height="1600" width_o="900" height_o="1600" data-src="https://freight.cargo.site/t/original/i/b380e34f2a37e8b9c1daa6f14872243968f0a463d69181c3f9c4e91a08a60302/9e3cffe0-5bdb-4c83-950a-8199b1de39d1.JPG" data-mid="249150768" border="0" src="https://freight.cargo.site/w/900/i/b380e34f2a37e8b9c1daa6f14872243968f0a463d69181c3f9c4e91a08a60302/9e3cffe0-5bdb-4c83-950a-8199b1de39d1.JPG" /> <img width="1080" height="1920" width_o="1080" height_o="1920" data-src="https://freight.cargo.site/t/original/i/c25d00b6af79ea430f662379578a9b0d66c2938852162af06620808253f38dd9/TDMovieOut.0.png" data-mid="249150769" border="0" src="https://freight.cargo.site/w/1000/i/c25d00b6af79ea430f662379578a9b0d66c2938852162af06620808253f38dd9/TDMovieOut.0.png" /> <img width="1080" height="1920" width_o="1080" height_o="1920" data-src="https://freight.cargo.site/t/original/i/65f6722646f123af8e536c4cc23250894f0c93916cd575905957ed85d9fe3e15/TDMovieOut.1.png" data-mid="249150770" border="0" src="https://freight.cargo.site/w/1000/i/65f6722646f123af8e536c4cc23250894f0c93916cd575905957ed85d9fe3e15/TDMovieOut.1.png" /> A small selection of creatures was exhibited at Villa Doria D'Angri, Naples, during the "Foresta di Cristallo" exhibition. https://adrianotenore.com/EXODUS Fri, 05 Jun 2026 10:20:14 +0000 Adriano Tenore https://adrianotenore.com/EXODUS /* ===== EXODUS — alternating text/media layout ===== */ .proj{ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:26px;border-bottom:1px solid var(--line);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 18px;text-transform:uppercase;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);margin-right:10px;vertical-align:middle;} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.01em;margin:0;text-transform:uppercase;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta div{display:flex;flex-direction:column;gap:6px;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;} .proj-meta dd{margin:0;font-size:15px !important;font-weight:500;} /* lead block: teaser video + intro */ .proj-lead-block{display:grid;grid-template-columns:0.85fr 1.15fr;gap:var(--col-gap);align-items:start;padding:clamp(34px,5vw,60px) 0;border-bottom:1px solid var(--line);} .proj-lead{font-size:clamp(20px,2vw,26px) !important;line-height:1.28 !important;font-weight:500;margin:0;} .proj-lead .hl{color:var(--accent);} .pv-video{position:relative;width:100%;padding-top:56.25%;overflow:hidden;} .pv-video iframe{position:absolute;inset:0;width:100% !important;height:100% !important;border:0;} /* alternating venue rows */ .venues{display:flex;flex-direction:column;gap:clamp(40px,5vw,72px);padding:clamp(40px,5vw,72px) 0;} .venue-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--col-gap);align-items:center;} .venue-row:nth-child(even) .venue-media{order:-1;} .venue-cap{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 12px;} .venue-row p.proj-p{font-size:15px !important;line-height:1.5 !important;color:#cfcfcf;margin:0 0 14px;} .venue-row p.proj-p:last-child{margin-bottom:0;} /* generic paragraph */ .proj-p{font-size:15px !important;line-height:1.5 !important;color:#cfcfcf;} .proj-p .hl{color:var(--accent);} /* links + footer */ .proj-links{display:flex;flex-wrap:wrap;gap:14px 22px;padding:clamp(30px,4vw,50px) 0 0;border-top:1px solid var(--line);} .proj-links a{display:inline-flex;align-items:center;gap:8px;font-size:11px !important;letter-spacing:.16em !important;text-transform:uppercase;color:#fff;text-decoration:none;border:1px solid var(--line);padding:11px 18px;transition:border-color .2s,color .2s;} .proj-links a:hover{border-color:var(--accent);color:var(--accent);} .proj-links a .arrow{color:var(--accent);} @media(max-width:800px){ .proj-lead-block{grid-template-columns:1fr;} .venue-row{grid-template-columns:1fr;gap:22px;} .venue-row:nth-child(even) .venue-media{order:0;} } Project Exodus2024 A.I. / INTERACTIVE INSTALLATION EXODUS Year2024 FormatInteractive installation MethodAI livestream ContextSite-specific EXODUS is an A.I.-mediated, interactive livestream installation developed in March '24, in which the audience moving through the space is reflected as a crowd of displaced people fleeing their land because of war, famine and extreme weather conditions. Fondazione Morra Greco — Napoli As the installation observes the surrounding space and everything moving in it the audience becomes an integral part and the engine of the performance itself. This stream of a.i. consciousness has the role of a sentient mirror outputting a fleetin reflection of our reality in which the audience is called to identify. ex Asilo Filangieri — Napoli The installation is in perpetual evolution and never equal to itself: it changes with the environment it is installed in, with light conditions, and with the movement happening in the space. There will never be two identical versions of EXODUS. exOPG — Napoli The dialogue between human and machine becomes an exchange — an oracular interrogation. As visitors move, the system reads their presence and answers, never the same way twice. Casa Internazionale delle Donne — Roma The sound design layers stretched recordings of bombings with muezzin calls to prayer which, also stretched, resemble alarm sirens — evoking a sense of urgency and disquiet. ZTA — NApoli The most recent iteration, continuing the work's ongoing life across spaces and audiences. ↗ Technical Sheet ↗ Articles https://adrianotenore.com/NEAL-VR Thu, 11 Jun 2026 13:27:38 +0000 Adriano Tenore https://adrianotenore.com/NEAL-VR /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ Project NEAL VR2024 REAL-TIME / VR / RESEARCH NEAL VR EngineUnreal Engine 5 Year2024 FormatVR / Real-time ClientArtis — University of Wien NEAL VR is a museum experience developed in Unreal Engine 5 for Artis, a research group conducting a study on the neurological impact of art on the human brain. Based in the University of Wien, Artis studies how art can enhance the well-being of individuals and societies through scientific, data-driven approaches. NEAL is an Exploratory Network Model and Latent Profile Analysis of affective/cognitive aspects underlying shared, supraordinate responses to museum visual art. After conducting two sessions — one in person, another via browser — a substantial difference in the gathered data was noticed. For this reason we developed a VR version of the experience to reintroduce a sense of reality and presence through the technology. The museum features six rooms, each hosting a painting from a world-famous painter of the past; its hexagonal architecture is designed not to suggest any specific order of exploration. Each played iteration outputs a log folder containing data. Following the OGAR method, we built a blueprint-based plugin inside Unreal to gather player position at every tick, time spent looking at each painting, time spent in each room, and a heatmap to easily visualize the position data. <img width="961" height="540" width_o="961" height_o="540" data-src="https://freight.cargo.site/t/original/i/542f34afc2b326359021a67ce43f6d5ad16582dde6de90fcb5b4c49500c9408a/Roam-wip3.gif" data-mid="249371953" border="0" data-scale="100" src="https://freight.cargo.site/w/961/i/542f34afc2b326359021a67ce43f6d5ad16582dde6de90fcb5b4c49500c9408a/Roam-wip3.gif" /> <img width="1894" height="1065" width_o="1894" height_o="1065" data-src="https://freight.cargo.site/t/original/i/865be229b21ddd48dc84fde3d272ed918f8aba64b448d856e4d16138e245573e/Animazione.gif" data-mid="249371949" border="0" data-scale="63" src="https://freight.cargo.site/w/1000/i/865be229b21ddd48dc84fde3d272ed918f8aba64b448d856e4d16138e245573e/Animazione.gif" /> <img width="1920" height="1080" width_o="1920" height_o="1080" data-src="https://freight.cargo.site/t/original/i/be3c2459703e32d14aead1d776d504a63a914f166b89e02b0f1a87720006b1fe/closeups-wip3.gif" data-mid="249371952" border="0" data-scale="63" src="https://freight.cargo.site/w/1000/i/be3c2459703e32d14aead1d776d504a63a914f166b89e02b0f1a87720006b1fe/closeups-wip3.gif" /> &nbsp; &nbsp;<img width="797" height="797" width_o="797" height_o="797" data-src="https://freight.cargo.site/t/original/i/e8f80d5ab27a41080017bfeb076c29103b0bde3dec16bdb52364bb8f91093a01/Animazione.gif" data-mid="249371950" border="0" data-scale="29" src="https://freight.cargo.site/w/797/i/e8f80d5ab27a41080017bfeb076c29103b0bde3dec16bdb52364bb8f91093a01/Animazione.gif" />&nbsp; &nbsp; &nbsp;&nbsp;<img width="1554" height="1554" width_o="1554" height_o="1554" data-src="https://freight.cargo.site/t/original/i/7d1b77604229533102490108ce1e0a9ec77f4d421305d4fad041d65316a9c55a/Animazione-maps.gif" data-mid="249371951" border="0" data-scale="29" src="https://freight.cargo.site/w/1000/i/7d1b77604229533102490108ce1e0a9ec77f4d421305d4fad041d65316a9c55a/Animazione-maps.gif" /> https://adrianotenore.com/Motorvalley-Netflix-1 Mon, 15 Jun 2026 14:34:02 +0000 Adriano Tenore https://adrianotenore.com/Motorvalley-Netflix-1 /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ Project Motorvalley2025 FILM / VFX MOTORVALLEY Runtime— Year2025 FormatTrailer / 4K MethodAI + 3D AI racecar engine interior shots for Motorvalley, Netflix serie. Via Dogmadept. https://adrianotenore.com/Winter-Olympics-26-VISA-San-Paolo-1 Mon, 15 Jun 2026 14:35:37 +0000 Adriano Tenore https://adrianotenore.com/Winter-Olympics-26-VISA-San-Paolo-1 /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ Project Winter Olympics ’262025 FILM / AI PRODUCTION WINTER OLYMPICS ’26 Runtime— Year2025 FormatCampaign / 4K Method3D + AI AI production for Milano Cortina Winter Olympics ’26 — VISA / Intesa Sanpaolo. Produced by BRW Filmland and DOGMA, directed by co-founder Federico Mazzarisi. This campaign marks one of the first large-scale AI-integrated productions in the world. Via Dogmadept. https://adrianotenore.com/SILENT-SHELLS Mon, 15 Jun 2026 14:36:54 +0000 Adriano Tenore https://adrianotenore.com/SILENT-SHELLS /* ===== PROJECT LAYOUT — modular. Edit KNOBS per project. ===== */ .proj{ /* KNOBS */ --accent:#d4ff00; --line:#1c1c1c; --muted:#6f6f6f; --text-w:0.72fr; --media-w:1.4fr; --col-gap:clamp(40px,6vw,90px); --media-gap:18px; --img-cols:2; /* fonts: native Optician Sans (title) + Neue Haas Grotesk (text) */ } .proj, .proj *{box-sizing:border-box;} .proj{color:#fff;} .proj *{text-align:left !important;} /* top index line (no name — it's the artist's own site) */ .proj-index{display:flex;justify-content:space-between;align-items:center;font-size:10px !important;letter-spacing:.34em !important;color:var(--muted);text-transform:uppercase;padding:0 0 clamp(5px,3vw,90px);font-weight:500;} .proj-index .dot{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;margin:0 12px;vertical-align:middle;} /* masthead */ .proj-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:30px 5vw;padding-bottom:30px;border-bottom:1px solid var(--line);margin-bottom:clamp(40px,5vw,70px);} .proj-eyebrow{font-size:11px !important;letter-spacing:.34em !important;color:var(--accent);font-weight:700;margin:0 0 22px;display:flex;align-items:center;gap:12px;} .proj-eyebrow .mark{display:inline-block;width:10px;height:10px;border:1px solid var(--accent);transform:rotate(45deg);} .proj-title{font-size:clamp(50px,9vw,128px) !important;font-weight:400;line-height:.9 !important;letter-spacing:-.02em !important;margin:0 !important;color:#fff;} .proj-meta{display:flex;flex-wrap:wrap;gap:20px 44px;padding-bottom:10px;margin:0;} .proj-meta dt{font-size:10px !important;letter-spacing:.24em !important;color:var(--muted);text-transform:uppercase;margin:0 0 7px;font-weight:500;} .proj-meta dd{font-size:14px !important;font-weight:500;color:#f2f2f2;margin:0;} /* body */ .proj-body{display:grid;grid-template-columns:var(--text-w) var(--media-w);gap:var(--col-gap);align-items:start;} .proj-text{position:sticky;top:30px;min-width:0;} /* refined hierarchy via Neue Haas Grotesk weights */ .proj-lead{font-size:clamp(20px,1.8vw,28px) !important;line-height:1.36 !important;font-weight:500;letter-spacing:-.015em !important;margin:0 0 1.25em;color:#fff;} .proj-p{font-size:clamp(15px,1.05vw,16px) !important;line-height:1.72 !important;color:#a9a9a9;font-weight:400;margin:0 0 1.15em;letter-spacing:.005em !important;} .proj-p:first-of-type{color:#cdcdcd;} .proj-p:last-child{margin-bottom:0;} .proj-p em{font-style:italic;color:#e8e8e8;} .proj-media{min-width:0;display:flex;flex-direction:column;gap:var(--media-gap);} .proj-media .pv-video{position:relative;padding-top:56.25%;width:100%;background:#0c0c0c;} .proj-media .pv-video iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:0;} /* image grid: only shows if it CONTAINS .m-img children; empty grid collapses */ .m-grid{display:grid;grid-template-columns:repeat(var(--img-cols),1fr);gap:var(--media-gap);} .m-grid:empty{display:none;} .m-img{width:100%;position:relative;background:linear-gradient(135deg,#161616,#070707);} @media(max-width:860px){.proj-head{flex-direction:column;align-items:flex-start;}.proj-body{grid-template-columns:1fr;gap:36px;}.proj-text{position:static;}} /* ===================== TYPOGRAPHY KNOBS — edit everything here ===================== */ .proj{ /* FONTS (change these two to swap typefaces site-wide) */ --font-display: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* main title */ --font-text: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* everything else */ /* MAIN TITLE */ --title-size: clamp(50px, 9vw, 128px); --title-weight: 800; /* BOLD title */ /* EYEBROW (the "FILM / DIRECTION" line above the title) */ --eyebrow-size: 11px; --eyebrow-weight: 700; /* INDEX LINE (the small "PROJECT FILE • VILE FLOWER ... 2024" at the very top) */ --index-size: 10px; --index-weight: 500; /* META LABELS (RUNTIME / YEAR / FORMAT / METHOD) */ --meta-label-size: 10px; --meta-label-weight: 500; /* META VALUES (04:12, 2024, ...) */ --meta-value-size: 14px; --meta-value-weight: 500; /* LEAD paragraph (the big intro sentence) */ --lead-size: clamp(20px, 1.8vw, 28px); --lead-weight: 500; /* BODY paragraphs */ --body-size: clamp(15px, 1.05vw, 16px); --body-weight: 400; } /* --- wiring (usually no need to touch below) --- */ .proj .proj-title{ font-family: var(--font-display) !important; } .proj .proj-index, .proj .proj-eyebrow, .proj .proj-meta, .proj .proj-lead, .proj .proj-p{ font-family: var(--font-text) !important; } .proj .proj-title{ font-size: var(--title-size) !important; font-weight: var(--title-weight) !important; } .proj .proj-eyebrow{ font-size: var(--eyebrow-size) !important; font-weight: var(--eyebrow-weight) !important; } .proj .proj-index{ font-size: var(--index-size) !important; font-weight: var(--index-weight) !important; } .proj .proj-meta dt{ font-size: var(--meta-label-size) !important; font-weight: var(--meta-label-weight) !important; } .proj .proj-meta dd{ font-size: var(--meta-value-size) !important; font-weight: var(--meta-value-weight) !important; } .proj .proj-lead{ font-size: var(--lead-size) !important; font-weight: var(--lead-weight) !important; } .proj .proj-p{ font-size: var(--body-size) !important; font-weight: var(--body-weight) !important; } /* =================================================================================== */ /* ============================================================ FULL CONTROL PANEL — EDIT EVERYTHING FOR THIS PROJECT HERE Each section below controls ONE piece of text on the page. Change the values after the colon. Units: px, em, fr, #hex. (Text WORDS are edited in the markup further down, each line is commented so you can find it.) ============================================================ */ .proj{ /* ---- FONTS (per section) ---- */ --index-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --eyebrow-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --title-font: "Optician Sans", "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-label-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --meta-value-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --lead-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; --body-font: "Neue Haas Grotesk", Helvetica, Arial, sans-serif; /* ---- TOP INDEX LINE ("Project File . Vile Flower / 2024") ---- */ --index-size: 10px; --index-weight: 500; --index-spacing: .34em; --index-line: 1.4; --index-color: #6f6f6f; --index-margin: 0 0 clamp(12px,1.5vw,20px); /* ---- EYEBROW ("FILM / DIRECTION") ---- */ --eyebrow-size: 11px; --eyebrow-weight: 700; --eyebrow-spacing: .34em; --eyebrow-line: 1.3; --eyebrow-color: var(--accent); --eyebrow-margin: 0 0 18px; /* ---- MAIN TITLE ("VILE FLOWER") — BOLD ---- */ --title-size: clamp(50px,9vw,128px); --title-weight: 800; --title-spacing: -.02em; --title-line: .9; --title-color: #ffffff; --title-margin: 0; /* ---- META LABELS (RUNTIME / YEAR / FORMAT / METHOD) ---- */ --meta-label-size: 10px; --meta-label-weight: 500; --meta-label-spacing: .24em; --meta-label-line: 1.3; --meta-label-color: #6f6f6f; /* ---- META VALUES (04:12 / 2024 / Short film / Photography) ---- */ --meta-value-size: 14px; --meta-value-weight: 500; --meta-value-spacing: 0; --meta-value-line: 1.4; --meta-value-color: #f2f2f2; --meta-gap-knob: 20px 44px; /* ---- LEAD paragraph (big intro sentence) ---- */ --lead-size: clamp(20px,1.8vw,28px); --lead-weight: 500; --lead-spacing: -.015em; --lead-line: 1.36; --lead-color: #ffffff; --lead-margin: 0 0 1.25em; /* ---- BODY paragraphs ---- */ --body-size: clamp(15px,1.05vw,16px); --body-weight: 400; --body-spacing: .005em; --body-line: 1.72; --body-color: #a9a9a9; --body-margin: 0 0 1.15em; } /* ---- WIRING (connects each section to its knobs; no need to edit) ---- */ .proj .proj-index{ font-family:var(--index-font) !important; font-size:var(--index-size) !important; font-weight:var(--index-weight) !important; letter-spacing:var(--index-spacing) !important; line-height:var(--index-line) !important; color:var(--index-color) !important; margin:var(--index-margin) !important; } .proj .proj-eyebrow{ font-family:var(--eyebrow-font) !important; font-size:var(--eyebrow-size) !important; font-weight:var(--eyebrow-weight) !important; letter-spacing:var(--eyebrow-spacing) !important; line-height:var(--eyebrow-line) !important; color:var(--eyebrow-color) !important; margin:var(--eyebrow-margin) !important; } .proj .proj-title{ font-family:var(--title-font) !important; font-size:var(--title-size) !important; font-weight:var(--title-weight) !important; letter-spacing:var(--title-spacing) !important; line-height:var(--title-line) !important; color:var(--title-color) !important; margin:var(--title-margin) !important; } .proj .proj-meta dt{ font-family:var(--meta-label-font) !important; font-size:var(--meta-label-size) !important; font-weight:var(--meta-label-weight) !important; letter-spacing:var(--meta-label-spacing) !important; line-height:var(--meta-label-line) !important; color:var(--meta-label-color) !important; } .proj .proj-meta dd{ font-family:var(--meta-value-font) !important; font-size:var(--meta-value-size) !important; font-weight:var(--meta-value-weight) !important; letter-spacing:var(--meta-value-spacing) !important; line-height:var(--meta-value-line) !important; color:var(--meta-value-color) !important; } .proj .proj-meta{ gap:var(--meta-gap-knob) !important; } .proj .proj-lead{ font-family:var(--lead-font) !important; font-size:var(--lead-size) !important; font-weight:var(--lead-weight) !important; letter-spacing:var(--lead-spacing) !important; line-height:var(--lead-line) !important; color:var(--lead-color) !important; margin:var(--lead-margin) !important; } .proj .proj-p{ font-family:var(--body-font) !important; font-size:var(--body-size) !important; font-weight:var(--body-weight) !important; letter-spacing:var(--body-spacing) !important; line-height:var(--body-line) !important; color:var(--body-color) !important; margin:var(--body-margin) !important; } /* ============================================================ */ ProjectSilent Shells2025 R&amp;D / POST-PRODUCTION SILENT SHELLS Runtime— Year2025 FormatR&amp;D Session MethodComfyUI / AnimateDiff /Ae R&amp;D ComfyUI / AnimateDiff + AE post-production. &nbsp;