{"id":6,"date":"2026-07-01T09:51:09","date_gmt":"2026-07-01T09:51:09","guid":{"rendered":"https:\/\/sgtiranni.com\/home\/"},"modified":"2026-08-27T14:42:04","modified_gmt":"2026-08-27T14:42:04","slug":"home","status":"publish","type":"page","link":"https:\/\/sgtiranni.com\/en\/","title":{"rendered":"Home"},"content":{"rendered":"<div data-elementor-type=\"wp-page\" data-elementor-id=\"6\" class=\"elementor elementor-6\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ba864a0 e-con-full e-flex e-con e-parent\" data-id=\"ba864a0\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t<div class=\"elementor-element elementor-element-08c00ce e-con-full e-flex e-con e-child\" data-id=\"08c00ce\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b067065 elementor-widget elementor-widget-html\" data-id=\"b067065\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<style>\r\n  \/* ==========================================================================\r\n     1. PARAMETRI DI MODIFICA MANUALE (Modifica qui i tuoi valori)\r\n     ========================================================================== *\/\r\n  :root {\r\n    \/* LARGHEZZA VIDEO *\/\r\n    --hero-split-width: 65%; \r\n\r\n    \/* DIMENSIONE E FONT DEL TITOLO *\/\r\n    --hero-font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n\r\n    \/* COLORI DEL TITOLO *\/\r\n    --hero-text-color-initial: #000000; \/* Nero (o bianco se preferisci) *\/\r\n    --hero-text-color-hover: #444444;   \/* Grigio scuro all'hover *\/\r\n\r\n    \/* DURATA ANIMAZIONE (Tempo per riempire il colore) *\/\r\n    --hero-anim-duration: 2s;\r\n  }\r\n\r\n  \/* ==========================================================================\r\n     2. STRUTTURA E POSIZIONAMENTO (Layout)\r\n     ========================================================================== *\/\r\n  .custom-hero-container {\r\n    position: relative;\r\n    width: 100%;\r\n    min-height: 85vh;\r\n    background-color: transparent;\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  \/* VIDEO (Sfondo a destra) *\/\r\n  .custom-hero-right-video {\r\n    position: absolute;\r\n    top: 0;\r\n    right: 0;\r\n    bottom: 0;\r\n    width: var(--hero-split-width);\r\n    height: 100%;\r\n    overflow: hidden;\r\n    z-index: 1; \/* Il video sta sotto *\/\r\n  }\r\n\r\n  .custom-hero-right-video video {\r\n    width: 100%;\r\n    height: 100%;\r\n    object-fit: cover;\r\n    object-position: center;\r\n    display: block;\r\n  }\r\n\r\n  \/* ==========================================================================\r\n     3. STILE DEL TITOLO (Puro testo HTML)\r\n     ========================================================================== *\/\r\n  \/* Contenitore centrato perfettamente al centro della sezione *\/\r\n  .custom-hero-text-wrapper {\r\n    position: absolute;\r\n    top: 0;\r\n    left: 50%;\r\n    transform: translate(-50%);\r\n    z-index: 10; \/* Sopra il video *\/\r\n    width: 100%;\r\n    text-align: center;\r\n    pointer-events: none; \/* Evita che un contenitore invisibile blocchi il video sotto *\/\r\n  }\r\n\r\n  .hero-title-text {\r\n    font-family: var(--hero-font-family);\r\n    \r\n    \/* MAGIA DELLE DIMENSIONI: clamp(minimo, preferito, massimo) \r\n       11vw significa che occupa l'11% della larghezza dello schermo. Sar\u00e0 ENORME su PC. *\/\r\n    font-size: clamp(30px, 6.5vw, 120px);\r\n    font-weight: 700;\r\n    line-height: 1.1;\r\n    pointer-events: auto; \/* Riattiva l'interazione sul testo *\/\r\n    cursor: pointer;\r\n\tdisplay: inline-block;\r\n\ttext-align: left;\r\n    \r\n    \/* Effetto \"Bordo Vettoriale\" su testo normale *\/\r\n    color: transparent;\r\n    -webkit-text-stroke: 2px var(--hero-text-color-initial);\r\n    \r\n    \/* Animazioni combinate *\/\r\n    transition: color 0.4s ease, transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);\r\n    animation: fillTextColor var(--hero-anim-duration) ease forwards 1s;\r\n  }\r\n\r\n  \/* Effetto hover Premium: colora e fa un leggero \"pop\" in avanti *\/\r\n  .hero-title-text:hover {\r\n\tcolor: transparent !important;\r\n    transform: scale(1.03); \r\n    -webkit-text-stroke: 2px var(--hero-text-color-initial);\r\n  }\r\n\r\n  \/* Animazione: Riempie il testo partendo da trasparente (solo bordi) a solido *\/\r\n  @keyframes fillTextColor {\r\n    0% {\r\n      color: transparent;\r\n    }\r\n    100% {\r\n      color: var(--hero-text-color-initial);\r\n    }\r\n  }\r\n\r\n  \/* RESPONSIVE PER DISPOSITIVI MOBILI *\/\r\n  @media (max-width: 900px) {\r\n    .custom-hero-right-video {\r\n      width: 100%;\r\n    }\r\n    .custom-hero-text-wrapper {\r\n      width: 90%; \/* Lascia un po' di margine ai lati sui telefoni *\/\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- ==========================================================================\r\n     STRUTTURA HTML\r\n     ========================================================================== -->\r\n<div class=\"custom-hero-container\">\r\n  \r\n  <!-- Titolo posizionato al centro -->\r\n  <div class=\"custom-hero-text-wrapper\">\r\n    <!-- Usiamo il tag <h1> e andiamo a capo con <br> -->\r\n    <h1 class=\"hero-title-text\">Radici profonde,<br>visione futura<\/h1>\r\n  <\/div>\r\n\r\n  <!-- Video posizionato sul lato destro -->\r\n  <div class=\"custom-hero-right-video\">\r\n    <video autoplay muted loop playsinline poster=\"\">\r\n      <source src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/Video-Project-6-1.mov\" type=\"video\/mp4\">\r\n      Il tuo browser non supporta la riproduzione video.\r\n    <\/video>\r\n  <\/div>\r\n\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c7b608b elementor-widget elementor-widget-html\" data-id=\"c7b608b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- === STRUTTURA HTML === -->\r\n<div class=\"media-section-wrapper\">\r\n  \r\n  <!-- Contenitore flessibile per allineare le due immagini affiancate -->\r\n  <div class=\"media-container\">\r\n\r\n    <!-- PRIMA IMMAGINE (Logo Radio) con effetto Tilt -->\r\n    <div class=\"tilt-box reveal-scroll\" id=\"tiltContainer1\">\r\n      <img decoding=\"async\" src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/Untitled-06-July-2026-at-10.46.37.png\" \r\n           alt=\"Radio Roma Capitale\" \r\n           class=\"tilt-image logo-radio\" \r\n           id=\"tiltImg1\">\r\n    <\/div>\r\n\r\n    <!-- SECONDA IMMAGINE (Intervista) con effetto Tilt -->\r\n    <div class=\"tilt-box reveal-scroll delay-1\" id=\"tiltContainer2\">\r\n      <img decoding=\"async\" src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/RRC9png-scaled.png\" \r\n           alt=\"Intervista Silvia Giachini Tiranni\" \r\n           class=\"tilt-image foto-intervista\" \r\n           id=\"tiltImg2\">\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- === STILI CSS === -->\r\n<style>\r\n\/* --- CONTENITORE PRINCIPALE (Allineamento a 2 colonne) --- *\/\r\n.media-section-wrapper {\r\n  width: 100%;\r\n  background-color: transparent;\r\n  padding: 80px 20px;\r\n  box-sizing: border-box;\r\n  overflow: hidden;\r\n}\r\n\r\n.media-container {\r\n  display: flex;\r\n  flex-direction: row;\r\n  justify-content: center;\r\n  align-items: center;\r\n  gap: 80px; \/* Spazio tra le due immagini *\/\r\n  max-width: 1200px;\r\n  margin: 0 auto;\r\n}\r\n\r\n\/* --- EFFETTO TILT 3D (Hover) --- *\/\r\n.tilt-box {\r\n  perspective: 1000px;\r\n  cursor: pointer;\r\n  display: flex;\r\n  justify-content: center;\r\n  align-items: center;\r\n  \/* Non assegnamo una width percentuale uguale a entrambi qui *\/\r\n}\r\n\r\n\/* Limita la larghezza del logo della radio *\/\r\n#tiltContainer1 {\r\n  width: 35%;\r\n  max-width: 350px;\r\n}\r\n\r\n\/* Allarga il contenitore dell'intervista *\/\r\n#tiltContainer2 {\r\n  width: 55%;\r\n  max-width: 650px;\r\n}\r\n\r\n.tilt-image {\r\n  width: 100%;\r\n  height: auto;\r\n  display: block;\r\n  transform-style: preserve-3d;\r\n  will-change: transform;\r\n  \r\n  \/* Curva elastica (effetto molla) quando il mouse esce *\/\r\n  transition: transform 0.7s cubic-bezier(0.25, 1.15, 0.35, 1.15); \r\n}\r\n\r\n\/* Forma specifica per l'immagine 2 (Bordi arrotondati come screenshot) *\/\r\n.foto-intervista {\r\n\tborder-radius: 20px 20px 0 0; \/* Arrotonda solo in alto, dritto sotto *\/\r\n\tbox-shadow: 0 15px 35px rgba(0,0,0,0.15); \/* Leggera ombra per dare profondit\u00e0 *\/\r\n}\r\n\r\n\/* Transizione pi\u00f9 veloce\/immediata MENTRE si muove il mouse sopra *\/\r\n.tilt-box:hover .tilt-image {\r\n  transition: transform 0.1s ease-out;\r\n}\r\n\r\n\r\n\/* =========================================\r\n   ANIMAZIONE DI SCROLL (Entrata)\r\n========================================= *\/\r\n.reveal-scroll {\r\n  opacity: 0;\r\n  transform: translateY(60px);\r\n  transition: opacity 1s ease-out, transform 1s ease-out;\r\n}\r\n\r\n\/* Ritardo per la seconda immagine (crea un effetto a cascata) *\/\r\n.delay-1 {\r\n  transition-delay: 0.2s;\r\n}\r\n\r\n\/* Classe aggiunta da Javascript quando visibile *\/\r\n.reveal-scroll.active {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n\r\n\/* --- RESPONSIVE (Dispositivi Mobili e Tablet) --- *\/\r\n@media (max-width: 900px) {\r\n  .media-container {\r\n    flex-direction: column; \/* Incolonna le immagini sui telefoni *\/\r\n    gap: 50px;\r\n  }\r\n  .tilt-box {\r\n    width: 90%;\r\n    max-width: 400px;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<!-- === SCRIPT JAVASCRIPT === -->\r\n<script>\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  \r\n  \/* --- 1. GESTIONE DELL'EFFETTO TILT (Per entrambe le immagini) --- *\/\r\n  const maxTiltAngle = 15; \/\/ Abbassato un po' per l'immagine rettangolare\r\n\r\n  function setupTilt(containerId, imageId) {\r\n    const container = document.getElementById(containerId);\r\n    const image = document.getElementById(imageId);\r\n\r\n    if(!container || !image) return;\r\n\r\n    container.addEventListener('mousemove', (e) => {\r\n      const rect = container.getBoundingClientRect();\r\n      const mouseX = e.clientX - rect.left;\r\n      const mouseY = e.clientY - rect.top;\r\n      \r\n      const centerX = rect.width \/ 2;\r\n      const centerY = rect.height \/ 2;\r\n      \r\n      const tiltX = (centerY - mouseY) \/ centerY;\r\n      const tiltY = (mouseX - centerX) \/ centerX;\r\n      \r\n      const rotateX = tiltX * maxTiltAngle;\r\n      const rotateY = tiltY * maxTiltAngle;\r\n      \r\n      \/\/ Rotazione + Leggero zoom in avanti\r\n      image.style.transform = `rotateX(${rotateX}deg) rotateY(${rotateY}deg) scale(1.03)`;\r\n    });\r\n\r\n    container.addEventListener('mouseleave', () => {\r\n      \/\/ Rilascia la molla\r\n      image.style.transform = 'rotateX(0deg) rotateY(0deg) scale(1)';\r\n    });\r\n  }\r\n\r\n  \/\/ Applica l'effetto ai due blocchi\r\n  setupTilt('tiltContainer1', 'tiltImg1');\r\n  setupTilt('tiltContainer2', 'tiltImg2');\r\n\r\n\r\n  \/* --- 2. GESTIONE DELL'ANIMAZIONE ALLO SCROLL --- *\/\r\n  const reveals = document.querySelectorAll(\".reveal-scroll\");\r\n\r\n  const observer = new IntersectionObserver((entries) => {\r\n    entries.forEach(entry => {\r\n      if (entry.isIntersecting) {\r\n        entry.target.classList.add(\"active\");\r\n        observer.unobserve(entry.target); \/\/ Ferma l'osservazione, si anima una volta sola\r\n      }\r\n    });\r\n  }, {\r\n    threshold: 0.2 \/\/ Si attiva quando il 20% del blocco entra nello schermo\r\n  });\r\n\r\n  reveals.forEach(reveal => {\r\n    observer.observe(reveal);\r\n  });\r\n\r\n});\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-49d662f elementor-widget elementor-widget-html\" data-id=\"49d662f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<!-- FOGLIO DI STILE UNIFICATO -->\r\n<style>\r\n  \/* Contenitore a Griglia: 2 colonne su Desktop *\/\r\n  .sg-portfolio-grid {\r\n    display: grid;\r\n    grid-template-columns: 1fr 1fr; \/* Divide lo spazio in due colonne uguali *\/\r\n    gap: 40px; \/* Spazio orizzontale tra le due colonne *\/\r\n    width: 100%;\r\n    font-family: 'Calibri', 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n    padding: 20px 0;\r\n  }\r\n\r\n  \/* Colonna singola (contiene Testo + Bottone) *\/\r\n  .sg-col {\r\n    display: flex;\r\n    flex-direction: column;\r\n    align-items: center;\r\n    width: 100%;\r\n  }\r\n\r\n  \/* --------------------------------------\r\n     ANIMAZIONE ALLO SCROLL\r\n  --------------------------------------- *\/\r\n  .sg-scroll-anim {\r\n    opacity: 0;\r\n    transform: translateY(35px);\r\n    transition: opacity 1s cubic-bezier(0.25, 1, 0.5, 1), transform 1s cubic-bezier(0.25, 1, 0.5, 1);\r\n  }\r\n\r\n  .sg-scroll-anim.sg-visible {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n\r\n  \/* --------------------------------------\r\n     STILE DEL BADGE (TESTO ESTESO)\r\n  --------------------------------------- *\/\r\n  .sg-interview-badge {\r\n    display: flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    padding: 18px 30px;\r\n    background-color: rgba(255, 255, 255, 0.9);\r\n    border: 1px solid #e0e0e0;\r\n    border-radius: 2px;\r\n    position: relative;\r\n    overflow: hidden;\r\n    cursor: pointer;\r\n    text-align: center;\r\n    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);\r\n    \r\n    \/* Modifiche per renderlo \"esteso\" *\/\r\n    width: 100%; \r\n    margin-bottom: 25px; \/* Spazio tra il testo e il suo bottone sottostante *\/\r\n    \r\n    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1), \r\n                border-color 0.4s ease, \r\n                box-shadow 0.4s ease;\r\n  }\r\n\r\n  .sg-interview-badge:hover {\r\n    transform: translateY(-4px);\r\n    border-color: #1a1a1a;\r\n    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.06);\r\n  }\r\n\r\n  .sg-badge-text {\r\n    font-size: 13px;\r\n    line-height: 1.6;\r\n    color: #555555;\r\n    letter-spacing: 0.8px;\r\n    margin: 0;\r\n  }\r\n\r\n  .sg-architect-name {\r\n    font-weight: 600;\r\n    color: #1a1a1a;\r\n    text-transform: uppercase;\r\n    letter-spacing: 1.5px;\r\n  }\r\n\r\n  .sg-badge-divider {\r\n    margin: 0 12px;\r\n    color: #cccccc;\r\n    font-weight: 300;\r\n  }\r\n  \r\n  .sg-event-details {\r\n    font-weight: 400;\r\n  }\r\n\r\n  .sg-interview-badge::after {\r\n    content: '';\r\n    position: absolute;\r\n    bottom: 0;\r\n    left: 50%;\r\n    width: 0;\r\n    height: 2px;\r\n    background-color: #1a1a1a;\r\n    transition: width 0.4s cubic-bezier(0.25, 1, 0.5, 1), left 0.4s cubic-bezier(0.25, 1, 0.5, 1);\r\n  }\r\n\r\n  .sg-interview-badge:hover::after {\r\n    width: 100%;\r\n    left: 0;\r\n  }\r\n\r\n  \/* --------------------------------------\r\n     STILE DEL BOTTONE\r\n  --------------------------------------- *\/\r\n  .sg-sea-button {\r\n    display: inline-flex;\r\n    align-items: center;\r\n    justify-content: center;\r\n    gap: 12px;\r\n    padding: 16px 38px;\r\n    background: linear-gradient(135deg, #5d7a62, #4a614e); \r\n    color: #ffffff !important;\r\n    text-decoration: none !important;\r\n    font-size: 13px;\r\n    font-weight: 500;\r\n    text-transform: uppercase;\r\n    letter-spacing: 1.5px;\r\n    border-radius: 6px;\r\n    border: 1px solid rgba(255, 255, 255, 0.08);\r\n    box-shadow: 0 4px 15px rgba(74, 97, 78, 0.2);\r\n    position: relative;\r\n    overflow: hidden;\r\n    \r\n    transition: all 0.4s cubic-bezier(0.25, 1, 0.5, 1);\r\n    will-change: transform, box-shadow;\r\n  }\r\n\r\n  .sg-sea-button:hover {\r\n    transform: translateY(-3px);\r\n    background: linear-gradient(135deg, #698a6f, #536d58);\r\n    box-shadow: 0 10px 25px rgba(74, 97, 78, 0.35);\r\n    letter-spacing: 2.2px;\r\n  }\r\n\r\n  .sg-sea-button:active {\r\n    transform: translateY(-1px);\r\n    box-shadow: 0 5px 15px rgba(74, 97, 78, 0.25);\r\n  }\r\n\r\n  .sg-btn-arrow {\r\n    width: 16px;\r\n    height: 16px;\r\n    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);\r\n  }\r\n\r\n  .sg-sea-button:hover .sg-btn-arrow {\r\n    transform: translateX(5px);\r\n  }\r\n  \r\n  .sg-sea-button::before {\r\n    content: '';\r\n    position: absolute;\r\n    top: 0;\r\n    left: -100%;\r\n    width: 60%;\r\n    height: 100%;\r\n    background: linear-gradient(\r\n      to right, \r\n      rgba(255, 255, 255, 0) 0%, \r\n      rgba(255, 255, 255, 0.2) 50%, \r\n      rgba(255, 255, 255, 0) 100%\r\n    );\r\n    transform: skewX(-30deg);\r\n    transition: none;\r\n  }\r\n\r\n  .sg-sea-button:hover::before {\r\n    left: 160%;\r\n    transition: left 0.7s ease-in-out;\r\n  }\r\n\r\n  \/* --------------------------------------\r\n     MEDIA QUERIES (Smartphone \/ Tablet)\r\n  --------------------------------------- *\/\r\n  @media (max-width: 992px) {\r\n    .sg-portfolio-grid {\r\n      grid-template-columns: 1fr; \/* Collassa tutto in 1 singola colonna verticale *\/\r\n      gap: 50px; \/* Aumenta lo spazio tra il primo gruppo (testo+bottone) e il secondo *\/\r\n    }\r\n    .sg-interview-badge {\r\n      padding: 15px 20px;\r\n    }\r\n    .sg-badge-text {\r\n      font-size: 12px;\r\n    }\r\n    .sg-badge-divider {\r\n      display: block;\r\n      margin: 5px 0;\r\n      opacity: 0;\r\n    }\r\n  }\r\n<\/style>\r\n\r\n<!-- STRUTTURA HTML -->\r\n<div class=\"sg-portfolio-grid\">\r\n  \r\n  <!-- COLONNA SINISTRA: 21 Marzo 2023 -->\r\n  <div class=\"sg-col sg-scroll-anim\">\r\n    \r\n    <!-- Blocco Testo 1 Esteso -->\r\n    <div class=\"sg-interview-badge\">\r\n      <p class=\"sg-badge-text\">\r\n        <span class=\"sg-architect-name\">Architetto Silvia Giachini Tiranni<\/span>\r\n        <span class=\"sg-badge-divider\">|<\/span>\r\n        <span class=\"sg-event-details\">Interview Radio Roma Capitale del 21 Marzo 2023<\/span>\r\n      <\/p>\r\n    <\/div>\r\n    \r\n    <!-- Bottone 1 -->\r\n    <a href=\"https:\/\/youtu.be\/DUSg5q8-TEw\" class=\"sg-sea-button\" target=\"_blank\">\r\n      <span class=\"sg-btn-text\">Click Here to View<\/span>\r\n      <svg class=\"sg-btn-arrow\" viewbox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n        <path d=\"M5 12H19M19 12L12 5M19 12L12 19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n      <\/svg>\r\n    <\/a>\r\n  <\/div>\r\n\r\n  <!-- COLONNA DESTRA: 9 Giugno 2023 -->\r\n  <!-- Aggiunto un delay di 0.2s per far comparire la seconda colonna leggermente dopo la prima -->\r\n  <div class=\"sg-col sg-scroll-anim\" style=\"transition-delay: 0.2s;\">\r\n    \r\n    <!-- Blocco Testo 2 Esteso -->\r\n    <div class=\"sg-interview-badge\">\r\n      <p class=\"sg-badge-text\">\r\n        <span class=\"sg-architect-name\">Architetto Silvia Giachini Tiranni<\/span>\r\n        <span class=\"sg-badge-divider\">|<\/span>\r\n        <span class=\"sg-event-details\">Interview Radio Roma Capitale del 9 Giugno 2023<\/span>\r\n      <\/p>\r\n    <\/div>\r\n    \r\n    <!-- Bottone 2 -->\r\n    <a href=\"https:\/\/youtu.be\/oIPAKW-Pc_s\" class=\"sg-sea-button\" target=\"_blank\">\r\n      <span class=\"sg-btn-text\">Click Here to View<\/span>\r\n      <svg class=\"sg-btn-arrow\" viewbox=\"0 0 24 24\" fill=\"none\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">\r\n        <path d=\"M5 12H19M19 12L12 5M19 12L12 19\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"\/>\r\n      <\/svg>\r\n    <\/a>\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n<!-- SCRIPT PER ANIMAZIONE ALLO SCROLL -->\r\n<script>\r\n  document.addEventListener(\"DOMContentLoaded\", function() {\r\n    const animatedElements = document.querySelectorAll('.sg-scroll-anim');\r\n    \r\n    const observer = new IntersectionObserver((entries, observer) => {\r\n      entries.forEach(entry => {\r\n        if (entry.isIntersecting) {\r\n          entry.target.classList.add('sg-visible');\r\n          observer.unobserve(entry.target); \r\n        }\r\n      });\r\n    }, { \r\n      threshold: 0.1 \r\n    });\r\n\r\n    animatedElements.forEach(el => observer.observe(el));\r\n  });\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-fae78ac elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"fae78ac\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bf207b4 e-con e-atomic-element e-flexbox-base e-default-div e-dffcf8f\" data-id=\"bf207b4\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"bf207b4\">\n    <div class=\"elementor-element elementor-element-dbc5c34 e-con-full e-flex e-con e-parent\" data-id=\"dbc5c34\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a35ddec is-style-default hostinger-ai-title elementor-widget elementor-widget-heading\" data-id=\"a35ddec\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">INTERNATIONAL AWARDS<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n<div class=\"elementor-element elementor-element-e17f647 e-con-full e-flex e-con e-parent\" data-id=\"e17f647\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;video&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-101c8b9 elementor-widget elementor-widget-html\" data-id=\"101c8b9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"custom-hero\">\r\n  \r\n  <video class=\"hero-video\" autoplay muted loop playsinline>\r\n    <source src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/Video-Project-7.mp4\" type=\"video\/mp4\">\r\n  <\/video>\r\n  \r\n  <div class=\"hero-overlay\"><\/div>\r\n\r\n  <h1 class=\"hero-title\">Lizhuang Ancient Tourist Reception Centre (built) for BCCI<\/h1>\r\n\r\n  <div class=\"hero-info-box\">\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">CATEGORY<\/span>\r\n      <span class=\"info-value\">Governament Turist Center<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">LOCATION<\/span>\r\n      <span class=\"info-value\">Lizhuang, China<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">TOTAL AREA<\/span>\r\n      <span class=\"info-value\">5204m\u00b2<\/span>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* --- STILI DESKTOP --- *\/\r\n.custom-hero {\r\n  position: relative;\r\n  width: 100%;\r\n  margin-top: -25px;\r\n  height: 85vh; \/* Occupa l'85% dell'altezza dello schermo *\/\r\n  max-width: 100%;\r\n  overflow: hidden;\r\n  animation: fadeSlideUp 1.2s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between; \/* Spinge il titolo sopra e lascia spazio sotto *\/\r\n  box-sizing: border-box;\r\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\n\/* Gestione del video a tutto schermo senza deformarsi *\/\r\n.hero-video {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  width: 100%;\r\n  height: 100%;\r\n  transform: translate(-50%, -50%);\r\n  object-fit: cover;\r\n  z-index: 1;\r\n}\r\n\r\n\/* Sfumatura o filtro sopra il video *\/\r\n.hero-overlay {\r\n  position: absolute;\r\n  top: 0; left: 0; width: 100%; height: 100%;\r\n  background: rgba(0, 0, 0, 0.1);\r\n  z-index: 2;\r\n}\r\n\r\n\/* Stile del Titolo (In alto) *\/\r\n.hero-title {\r\n  position: relative;\r\n  z-index: 3;\r\n  margin: 40px 0 0 50px;\r\n  font-size: 3.5rem;\r\n  font-weight: bold;\r\n  color: #000000;\r\n  letter-spacing: -1px;\r\n  transition: all 0.4s ease;\r\n}\r\n\r\n\/* Stile del Box Informazioni (In basso a destra) *\/\r\n.hero-info-box {\r\n  position: absolute;\r\n  bottom: 0px;\r\n  right: 0px;\r\n  background: #111111;\r\n  padding: 25px 40px;\r\n  display: flex;\r\n  gap: 50px;\r\n  z-index: 3;\r\n  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);\r\n  cursor: pointer;\r\n}\r\n\r\n.info-column {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.info-label {\r\n  font-size: 0.65rem;\r\n  color: #888888;\r\n  letter-spacing: 1px;\r\n  margin-bottom: 8px;\r\n  font-weight: 600;\r\n}\r\n\r\n.info-value {\r\n  font-size: 0.85rem;\r\n  color: #ffffff;\r\n  transition: color 0.3s ease;\r\n}\r\n\r\n\/* --- EFFETTI HOVER --- *\/\r\n.hero-title:hover {\r\n  color: #ffffff;\r\n  transform: translateX(10px);\r\n}\r\n\r\n.hero-info-box:hover {\r\n  background: #1c1c1c;\r\n  transform: translateY(-5px);\r\n  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);\r\n}\r\n\r\n.hero-info-box:hover .info-value {\r\n  color: #00ffcc;\r\n}\r\n\r\n\/* --- RESPONSIVE MOBILE (Sotto i 768px) --- *\/\r\n@media (max-width: 768px) {\r\n  .custom-hero {\r\n\tmargin-top: 15px;\r\n    height: auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: #f4f4f4;\r\n  }\r\n\r\n  .hero-video {\r\n    position: relative;\r\n    top: 0; left: 0; transform: none;\r\n    width: 100%;\r\n    height: 250px;\r\n  }\r\n\r\n  .hero-overlay {\r\n    display: none;\r\n  }\r\n\r\n  .hero-title {\r\n    font-size: 2.2rem;\r\n    margin: 20px;\r\n    order: -1;\r\n  }\r\n\r\n  .hero-info-box {\r\n    position: relative;\r\n    bottom: 0;\r\n    right: 0;\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n    padding: 30px 20px;\r\n    flex-direction: column;\r\n    gap: 20px;\r\n  }\r\n}\r\n\r\n@keyframes fadeSlideUp {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(60px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-017b013 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"017b013\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-540ea62 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"540ea62\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-8c5052a e-con e-atomic-element e-flexbox-base e-default-div e-8c5052a-b38dc1a\" data-id=\"8c5052a\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"8c5052a\">\n    <div class=\"elementor-element elementor-element-e647af5 e-con-full e-flex e-con e-parent\" data-id=\"e647af5\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-ccf3f92 is-style-default hostinger-ai-title elementor-widget elementor-widget-heading\" data-id=\"ccf3f92\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Urban Planning<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<div class=\"elementor-element elementor-element-e1ab0dc elementor-widget elementor-widget-html\" data-id=\"e1ab0dc\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"custom-hero\">\r\n\t<video class=\"hero-video\" autoplay muted loop playsinline>\r\n\t\t<source src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/Video-Project-9.mp4\" type=\"video\/mp4\">\r\n\t<\/video>\r\n  \r\n  <div class=\"hero-overlay\"><\/div>\r\n\r\n  <h1 class=\"hero-title\">Enyang ancient town Tourist Centre (Built) for BCCI<\/h1>\r\n\r\n  <div class=\"hero-info-box\">\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">CATEGORY<\/span>\r\n      <span class=\"info-value\">Governament Turist Buildng<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">LOCATION<\/span>\r\n      <span class=\"info-value\">Enyang, China<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">TOTAL AREA<\/span>\r\n      <span class=\"info-value\">3,1km\u00b2<\/span>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* --- STILI DESKTOP --- *\/\r\n.custom-hero {\r\n  position: relative;\r\n  width: 100%;\r\n  margin-top: -25px;\r\n  height: 85vh; \/* Occupa l'85% dell'altezza dello schermo *\/\r\n  max-width: 100%;\r\n  overflow: hidden;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between; \/* Spinge il titolo sopra e lascia spazio sotto *\/\r\n  box-sizing: border-box;\r\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n  animation: fadeSlideUp 1.2s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;\r\n}\r\n\r\n\r\n\/* Gestione del video a tutto schermo senza deformarsi *\/\r\n.hero-video {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  width: 100%;\r\n  height: 100%;\r\n  transform: translate(-50%, -50%);\r\n  object-fit: cover;\r\n  z-index: 1;\r\n}\r\n\r\n\/* Sfumatura o filtro sopra il video *\/\r\n.hero-overlay {\r\n  position: absolute;\r\n  top: 0; left: 0; width: 100%; height: 100%;\r\n  background: rgba(0, 0, 0, 0.1);\r\n  z-index: 2;\r\n}\r\n\r\n\/* Stile del Titolo (In alto) *\/\r\n.hero-title {\r\n  position: relative;\r\n  z-index: 3;\r\n  margin: 40px 0 0 50px;\r\n  font-size: 3.5rem;\r\n  font-weight: bold;\r\n  color: #000000;\r\n  letter-spacing: -1px;\r\n  transition: all 0.4s ease;\r\n}\r\n\r\n\/* Stile del Box Informazioni (In basso a destra) *\/\r\n.hero-info-box {\r\n  position: absolute;\r\n  bottom: 0px;\r\n  right: 0px;\r\n  background: #111111;\r\n  padding: 25px 40px;\r\n  display: flex;\r\n  gap: 50px;\r\n  z-index: 3;\r\n  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);\r\n  cursor: pointer;\r\n}\r\n\r\n.info-column {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.info-label {\r\n  font-size: 0.65rem;\r\n  color: #888888;\r\n  letter-spacing: 1px;\r\n  margin-bottom: 8px;\r\n  font-weight: 600;\r\n}\r\n\r\n.info-value {\r\n  font-size: 0.85rem;\r\n  color: #ffffff;\r\n  transition: color 0.3s ease;\r\n}\r\n\r\n\/* --- EFFETTI HOVER --- *\/\r\n.hero-title:hover {\r\n  color: #ffffff;\r\n  transform: translateX(10px);\r\n}\r\n\r\n.hero-info-box:hover {\r\n  background: #1c1c1c;\r\n  transform: translateY(-5px);\r\n  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);\r\n}\r\n\r\n.hero-info-box:hover .info-value {\r\n  color: #00ffcc;\r\n}\r\n\r\n\/* --- RESPONSIVE MOBILE (Sotto i 768px) --- *\/\r\n@media (max-width: 768px) {\r\n  .custom-hero {\r\n\tmargin-top: 15px;\r\n    height: auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: #f4f4f4;\r\n  }\r\n\r\n  .hero-video {\r\n    position: relative;\r\n    top: 0; left: 0; transform: none;\r\n    width: 100%;\r\n    height: 250px;\r\n  }\r\n\r\n  .hero-overlay {\r\n    display: none;\r\n  }\r\n\r\n  .hero-title {\r\n    font-size: 2.2rem;\r\n    margin: 20px;\r\n    order: -1;\r\n  }\r\n\r\n  .hero-info-box {\r\n    position: relative;\r\n    bottom: 0;\r\n    right: 0;\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n    padding: 30px 20px;\r\n    flex-direction: column;\r\n    gap: 20px;\r\n  }\r\n}\r\n\r\n@keyframes fadeSlideUp {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(60px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-39a793a elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"39a793a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b2a9ca0 elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"b2a9ca0\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-bd1b3d1 e-con e-atomic-element e-flexbox-base e-default-div e-bd1b3d1-e9d28a2\" data-id=\"bd1b3d1\" data-element_type=\"e-flexbox\" data-e-type=\"e-flexbox\" data-interaction-id=\"bd1b3d1\">\n    <div class=\"elementor-element elementor-element-d285803 e-con-full e-flex e-con e-parent\" data-id=\"d285803\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-a24f0f3 is-style-default hostinger-ai-title elementor-widget elementor-widget-heading\" data-id=\"a24f0f3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Contemporany Office<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\n<\/div>\n\t\t<div class=\"elementor-element elementor-element-012ff72 elementor-widget elementor-widget-html\" data-id=\"012ff72\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t<div class=\"custom-hero\">\r\n\t<video class=\"hero-video\" autoplay muted loop playsinline>\r\n\t\t<source src=\"https:\/\/sgtiranni.com\/wp-content\/uploads\/2026\/07\/studio1.mp4\" type=\"video\/mp4\">\r\n\t<\/video>\r\n\t\r\n  <div class=\"hero-overlay\"><\/div>\r\n\r\n  <h1 class=\"hero-title\">HENGTAI<\/h1>\r\n\r\n  <div class=\"hero-info-box\">\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">CATEGORY<\/span>\r\n      <span class=\"info-value\">Interior<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">LOCATION<\/span>\r\n      <span class=\"info-value\">Chengdu, China<\/span>\r\n    <\/div>\r\n    <div class=\"info-column\">\r\n      <span class=\"info-label\">TOTAL AREA<\/span>\r\n      <span class=\"info-value\">524m\u00b2<\/span>\r\n    <\/div>\r\n  <\/div>\r\n<\/div>\r\n\r\n<style>\r\n\/* --- STILI DESKTOP --- *\/\r\n.custom-hero {\r\n  position: relative;\r\n  width: 100%;\r\n  max-width: 100%;\r\n  margin-top: -25px;\r\n  height: 85vh; \/* Occupa l'85% dell'altezza dello schermo *\/\r\n  animation: fadeSlideUp 1.2s cubic-bezier(0.25, 0.8, 0.25, 1) forwards;\r\n  overflow: hidden;\r\n  display: flex;\r\n  flex-direction: column;\r\n  justify-content: space-between; \/* Spinge il titolo sopra e lascia spazio sotto *\/\r\n  box-sizing: border-box;\r\n  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;\r\n}\r\n\r\n\/* Gestione del video a tutto schermo senza deformarsi *\/\r\n.hero-video {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  width: 100%;\r\n  height: 100%;\r\n  transform: translate(-50%, -50%);\r\n  object-fit: cover;\r\n  z-index: 1;\r\n}\r\n\r\n\/* Sfumatura o filtro sopra il video *\/\r\n.hero-overlay {\r\n  position: absolute;\r\n  top: 0; left: 0; width: 100%; height: 100%;\r\n  background: rgba(0, 0, 0, 0.1);\r\n  z-index: 2;\r\n}\r\n\r\n\/* Stile del Titolo (In alto) *\/\r\n.hero-title {\r\n  position: relative;\r\n  z-index: 3;\r\n  margin: 40px 0 0 50px;\r\n  font-size: 3.5rem;\r\n  font-weight: bold;\r\n  color: #000000;\r\n  letter-spacing: -1px;\r\n  transition: all 0.4s ease;\r\n}\r\n\r\n\/* Stile del Box Informazioni (In basso a destra) *\/\r\n.hero-info-box {\r\n  position: absolute;\r\n  bottom: 0px;\r\n  right: 0px;\r\n  background: #111111;\r\n  padding: 25px 40px;\r\n  display: flex;\r\n  gap: 50px;\r\n  z-index: 3;\r\n  transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);\r\n  cursor: pointer;\r\n}\r\n\r\n.info-column {\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.info-label {\r\n  font-size: 0.65rem;\r\n  color: #888888;\r\n  letter-spacing: 1px;\r\n  margin-bottom: 8px;\r\n  font-weight: 600;\r\n}\r\n\r\n.info-value {\r\n  font-size: 0.85rem;\r\n  color: #ffffff;\r\n  transition: color 0.3s ease;\r\n}\r\n\r\n\/* --- EFFETTI HOVER --- *\/\r\n.hero-title:hover {\r\n  color: #ffffff;\r\n  transform: translateX(10px);\r\n}\r\n\r\n.hero-info-box:hover {\r\n  background: #1c1c1c;\r\n  transform: translateY(-5px);\r\n  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);\r\n}\r\n\r\n.hero-info-box:hover .info-value {\r\n  color: #00ffcc;\r\n}\r\n\r\n\/* --- RESPONSIVE MOBILE (Sotto i 768px) --- *\/\r\n@media (max-width: 768px) {\r\n  .custom-hero {\r\n\tmargin-top: 15px;\r\n    height: auto;\r\n    display: flex;\r\n    flex-direction: column;\r\n    background: #f4f4f4;\r\n  }\r\n\r\n  .hero-video {\r\n    position: relative;\r\n    top: 0; left: 0; transform: none;\r\n    width: 100%;\r\n    height: 250px;\r\n  }\r\n\r\n  .hero-overlay {\r\n    display: none;\r\n  }\r\n\r\n  .hero-title {\r\n    font-size: 2.2rem;\r\n    margin: 20px;\r\n    order: -1;\r\n  }\r\n\r\n  .hero-info-box {\r\n    position: relative;\r\n    bottom: 0;\r\n    right: 0;\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n    padding: 30px 20px;\r\n    flex-direction: column;\r\n    gap: 20px;\r\n  }\r\n\r\n@keyframes fadeSlideUp {\r\n  from {\r\n    opacity: 0;\r\n    transform: translateY(60px);\r\n  }\r\n  to {\r\n    opacity: 1;\r\n    transform: translateY(0);\r\n  }\r\n}\r\n\r\n<\/style>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>Radici profonde,visione futura Il tuo browser non supporta la riproduzione video. Architetto Silvia Giachini Tiranni | Interview Radio Roma Capitale del 21 Marzo 2023 Click Here to View Architetto Silvia Giachini Tiranni | Interview Radio Roma Capitale del 9 Giugno 2023 Click Here to View INTERNATIONAL AWARDS Lizhuang Ancient Tourist Reception Centre (built) for BCCI [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-6","page","type-page","status-publish","hentry"],"_hostinger_reach_plugin_has_subscription_block":false,"_hostinger_reach_plugin_is_elementor":false,"_links":{"self":[{"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/pages\/6","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/comments?post=6"}],"version-history":[{"count":387,"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/pages\/6\/revisions"}],"predecessor-version":[{"id":796,"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/pages\/6\/revisions\/796"}],"wp:attachment":[{"href":"https:\/\/sgtiranni.com\/en\/wp-json\/wp\/v2\/media?parent=6"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}