/**
 * D'Angelo anniversary page – phone and tablet presentation.
 *
 * Everything is scoped to page 2906. Desktop starts at 1025px and continues
 * to use the original Elementor/HTML-widget composition.
 */

@media (max-width: 1024px) {
  .page-id-2906,
  .page-id-2906 .elementor-2906 {
    overflow-x: clip;
  }

  .page-id-2906 {
    --jub-page-gutter: clamp(16px, 4vw, 36px);
  }

  .page-id-2906 .elementor-2906 {
    --jub-card-radius: clamp(24px, 4vw, 38px);
    --jub-story-gap: clamp(18px, 3vw, 30px);
  }

  /* Prevent Elementor wrappers from reintroducing desktop widths/gaps. */
  .page-id-2906 .elementor-2906 > .e-con,
  .page-id-2906 .elementor-2906 .elementor-element-0972a99,
  .page-id-2906 .elementor-2906 .elementor-element-ae0024d,
  .page-id-2906 .elementor-2906 .elementor-element-3e4c767,
  .page-id-2906 .elementor-2906 .elementor-element-704f778 {
    --padding-left: var(--jub-page-gutter);
    --padding-right: var(--jub-page-gutter);
  }

  .page-id-2906 .elementor-2906 .elementor-element-ae0024d {
    --padding-top: 24px;
    --padding-bottom: 18px;
  }

  /* Hero: enlarge the central artwork instead of shrinking the full wide SVG. */
  .page-id-2906 #dangelo-hero {
    width: 100%;
    max-width: 760px;
    margin-inline: auto;
    padding: 12px 0 22px;
    box-sizing: border-box;
    overflow: hidden;
  }

  .page-id-2906 #dangelo-hero #dangelo-hero-svg {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  /* Testimonials/product carousel: usable edge spacing and swipe area. */
  .page-id-2906 .elementor-element-d132dcc {
    position: relative;
    z-index: 2;
    --padding-top: 18px;
    --padding-bottom: 34px;
    --padding-left: var(--jub-page-gutter);
    --padding-right: var(--jub-page-gutter);
  }

  .page-id-2906 .elementor-element-eb3af88 {
    width: 100%;
    max-width: 900px;
    margin-inline: auto;
    --e-n-carousel-swiper-offset-size: 0px;
    --e-n-carousel-swiper-slides-gap: 14px;
  }

  .page-id-2906 .elementor-element-eb3af88 .e-n-carousel {
    overflow: hidden;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-slide .e-con-inner {
    position: relative;
    overflow: hidden;
    border-radius: 18px;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-slide .elementor-widget-image:first-child img {
    display: block;
    width: 100%;
    aspect-ratio: 5 / 3;
    object-fit: cover;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-slide .elementor-absolute {
    bottom: 8% !important;
    width: 58%;
    max-width: 58%;
  }

  /* Map: make the illustration readable on the intermediate tablet layout. */
  .page-id-2906 #dangelo-map {
    overflow: hidden;
    width: calc(100% + (2 * var(--jub-page-gutter)));
    max-width: none;
    margin-inline: calc(-1 * var(--jub-page-gutter));
  }

  .page-id-2906 #dangelo-map svg {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
  }

  /* The desktop map animation sets opacity/transforms on inner SVG groups.
     Responsive mode is intentionally static, so delayed GSAP initialization
     must never leave Italy, Germany, the quote or the bicycle invisible. */
  .page-id-2906 #dangelo-map :is(
    .dangelo-map-fade,
    .dangelo-map-bike,
    .dangelo-map-dot
  ) {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .page-id-2906 #dangelo-map #dangelo-map-reveal-path {
    opacity: 1 !important;
    visibility: visible !important;
    stroke-dasharray: none !important;
    stroke-dashoffset: 0 !important;
  }

  /* Shared vertical-story layout. */
  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) {
    display: grid;
    grid-template-columns: minmax(250px, 0.86fr) minmax(330px, 1.14fr);
    align-items: center;
    gap: var(--jub-story-gap);
    width: 100%;
    max-width: 940px;
    margin: 0 auto clamp(38px, 6vw, 68px);
    overflow: visible;
    container-type: normal;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] {
    position: relative;
    inset: auto;
    z-index: 3;
    width: auto;
    margin: 0;
    padding: clamp(22px, 3.5vw, 34px);
    border-radius: var(--jub-card-radius);
    color: #fff;
    line-height: normal;
    box-shadow: 0 10px 28px rgba(29, 30, 28, 0.08);
  }

  .page-id-2906 :is(#dangelo-1986, #dangelo-1997, #dangelo-2006, #dangelo-2021) [class$="__txt"] {
    background: #37aa47;
  }

  .page-id-2906 :is(#dangelo-1992, #dangelo-2002, #dangelo-2010, #dangelo-heute) [class$="__txt"] {
    background: #e84b1c;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] h3 {
    margin: 0 0 0.55em !important;
    color: #fff !important;
    font-size: clamp(22px, 2.7vw, 28px);
    line-height: 1.16;
    text-wrap: balance;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] p {
    margin: 0.72em 0 0 !important;
    color: #fff !important;
    font-size: clamp(16px, 1.9vw, 18px);
    line-height: 1.5;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__year"] {
    display: block;
    width: clamp(128px, 18vw, 174px);
    height: auto;
    margin: 0 0 14px;
  }

  /* Intrinsic grid stages replace the large percentage-height canvases. */
  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__stage"] {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: center;
    gap: clamp(8px, 1.8vw, 18px);
    width: 100%;
    min-width: 0;
    padding-top: 0;
    isolation: isolate;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__vec"] {
    display: none;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class*="__photo"] {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    height: auto;
    max-height: 330px;
    object-fit: contain;
    justify-self: center;
    will-change: auto;
    transform: none !important;
  }

  .page-id-2906 #dangelo-1986 .dangelo-1986__photo--display,
  .page-id-2906 #dangelo-2006 .dangelo-2006__photo--portrait,
  .page-id-2906 #dangelo-2021 .dangelo-2021__photo--messestand2 {
    grid-column: 1 / -1;
    width: 52%;
    margin-top: -8%;
  }

  .page-id-2906 #dangelo-1997 .dangelo-1997__photo {
    grid-column: 1 / -1;
    width: min(78%, 410px);
  }

  .page-id-2906 #dangelo-2006 .dangelo-2006__photo--familie,
  .page-id-2906 #dangelo-2021 .dangelo-2021__photo--produktion,
  .page-id-2906 #dangelo-heute .dangelo-heute__photo--frau {
    margin-top: 18%;
  }

  .page-id-2906 #dangelo-heute .dangelo-heute__photo--ricotta {
    rotate: 7deg;
  }

  /* Portrait intro follows the same compact collage language. */
  .page-id-2906 #dangelo-portraits {
    width: 100%;
    max-width: 760px;
    margin: 0 auto clamp(34px, 5vw, 58px);
    overflow: visible;
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__stage {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: end;
    gap: clamp(8px, 2vw, 18px);
    width: 100%;
    padding-top: 0;
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__photo {
    position: relative;
    inset: auto;
    width: 100%;
    height: auto;
    transform: none !important;
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__photo--center {
    margin-bottom: 12%;
  }

  /* The noodle remains a quiet timeline motif without mobile scroll scrub. */
  .page-id-2906 #dangelo-nudel {
    pointer-events: none;
    opacity: 0.12;
  }

  .page-id-2906 #dangelo-nudel .dangelo-nudel__path {
    opacity: 1 !important;
    stroke-dasharray: none !important;
    stroke-dashoffset: 0 !important;
  }

  /* Outro and surrounding Elementor background must end with their content. */
  .page-id-2906 .elementor-element-3e4c767 {
    position: relative;
    z-index: 0 !important;
    overflow: hidden;
    --padding-top: 12px;
    --padding-bottom: 30px;
    background-size: 100% auto !important;
  }

  .page-id-2906 #dangelo-und-jetzt {
    max-width: 760px;
    margin-inline: auto;
  }

  .page-id-2906 #dangelo-und-jetzt.dangelo-outro-mobile-ready .dangelo-und-jetzt__stage {
    display: block;
    position: relative;
    width: 100%;
    padding-top: 63.15%;
    overflow: hidden;
  }

  .page-id-2906 #dangelo-und-jetzt.dangelo-outro-mobile-ready .dangelo-und-jetzt__vec {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    opacity: 1 !important;
  }

  .page-id-2906 #dangelo-und-jetzt.dangelo-outro-mobile-ready .dangelo-und-jetzt__vec foreignObject {
    display: none;
  }

  .page-id-2906 #dangelo-und-jetzt.dangelo-outro-mobile-ready :is(
    .dangelo-und-jetzt__mascot,
    .dangelo-und-jetzt__sign,
    .dangelo-und-jetzt__confetti
  ) {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-outro-mobile {
    position: relative;
    z-index: 2;
    width: min(100%, 680px);
    margin: 0 auto;
    padding: clamp(46px, 8vw, 76px) var(--jub-page-gutter) clamp(64px, 10vw, 96px);
    box-sizing: border-box;
    text-align: center;
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-outro-mobile h2 {
    margin: 0;
    color: #289e49;
    font-size: clamp(28px, 4.5vw, 40px);
    line-height: 1.14;
    font-weight: 800;
    text-wrap: balance;
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-outro-mobile p {
    margin: 10px 0 0;
    color: #1d1e1c;
    font-size: clamp(16px, 2.3vw, 19px);
    line-height: 1.4;
    font-weight: 700;
  }

  .page-id-2906 #dangelo-und-jetzt:not(.dangelo-outro-mobile-ready) .dangelo-und-jetzt__stage {
    padding-top: 72%;
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-und-jetzt__txt h2 {
    font-size: clamp(27px, 4.5vw, 38px);
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-und-jetzt__txt p {
    font-size: clamp(16px, 2.3vw, 19px);
  }

  /* Pending inline animations may never hide responsive content. */
  .page-id-2906 :is(
    #dangelo-hero,
    #dangelo-map,
    #dangelo-portraits,
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute,
    #dangelo-und-jetzt
  ) :is(svg, img, [class$="__txt"]) {
    opacity: 1 !important;
  }

  /* Lightweight IntersectionObserver motion uses the individual translate
     property, so it does not conflict with old GSAP transform declarations. */
  .page-id-2906.dangelo-mobile-motion .dangelo-mobile-reveal {
    opacity: 0.01;
    translate: 0 18px;
    transition:
      opacity 480ms ease,
      translate 560ms cubic-bezier(0.22, 1, 0.36, 1);
  }

  .page-id-2906.dangelo-mobile-motion .dangelo-mobile-reveal.is-visible {
    opacity: 1;
    translate: 0 0;
  }

  /* Header/footer refinements are deliberately page-scoped. */
  .page-id-2906 .elementor-location-header .elementor-element-8ec0cff .marquee-content {
    padding-block: 8px;
    font-size: clamp(11px, 1.8vw, 14px);
  }

  .page-id-2906 .elementor-location-footer {
    position: relative;
    z-index: 10;
    overflow: visible;
    background: #289e49;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-42b907a {
    position: relative;
    height: auto !important;
    min-height: 0 !important;
    background: #289e49;
    --padding-top: 42px;
    --padding-bottom: 42px;
    --padding-left: var(--jub-page-gutter);
    --padding-right: var(--jub-page-gutter);
  }

  .page-id-2906 .elementor-location-footer .elementor-element-42b907a > .e-con-inner {
    display: grid !important;
    height: auto !important;
    min-height: 0 !important;
    grid-template-columns: minmax(0, 1.15fr) minmax(220px, 0.85fr);
    align-items: start;
    gap: clamp(30px, 6vw, 70px);
    width: min(100%, 920px);
    margin-inline: auto;
  }

  .page-id-2906 .elementor-location-footer :is(
    .elementor-element-68251c4,
    .elementor-element-716d2ef,
    .elementor-element-640a669,
    .elementor-element-db9fb7c
  ) {
    height: auto !important;
    min-height: 0 !important;
    width: 100%;
    min-width: 0;
    --width: 100%;
    --min-height: 0px;
    --gap: 24px;
    --padding-top: 0px;
    --padding-bottom: 0px;
    --padding-left: 0px;
    --padding-right: 0px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-4ed5d45 {
    display: none !important;
  }

  .page-id-2906 .elementor-location-footer :is(
    .elementor-element-27a6365 .elementor-heading-title,
    .elementor-element-43e5900 .elementor-heading-title
  ) {
    margin: 0;
    color: #fff;
    font-size: clamp(17px, 2.5vw, 21px);
    line-height: 1.42;
    letter-spacing: 0.6px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-3150259 {
    margin-top: 6px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-3150259 .elementor-icon-list-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px 20px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-3150259 .elementor-icon-list-item {
    margin: 0;
    min-width: 0;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-3150259 .elementor-icon-list-item:has(br) {
    display: none;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-3150259 :is(
    a,
    .elementor-icon-list-text
  ) {
    color: #fff;
    font-size: clamp(15px, 2vw, 18px);
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-46c95bd {
    width: 100%;
    max-width: 100%;
    margin: 0;
    text-align: left;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-46c95bd img {
    display: block;
    width: min(70%, 250px);
    height: auto;
  }
}

@media (max-width: 767px) {
  .page-id-2906 .elementor-2906 {
    --jub-page-gutter: clamp(16px, 5vw, 22px);
  }

  .page-id-2906 #dangelo-hero #dangelo-hero-svg {
    width: 100%;
    margin-left: 0;
  }

  .page-id-2906 #dangelo-map svg {
    width: 100%;
    margin-left: 0;
  }

  .page-id-2906 .elementor-element-d132dcc {
    --padding-top: 16px;
    --padding-bottom: 30px;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-wrapper {
    align-items: stretch;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-slide {
    flex: 0 0 100% !important;
    width: 100% !important;
  }

  .page-id-2906 .elementor-element-eb3af88 .swiper-slide > .e-con {
    height: 100%;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    max-width: 620px;
    margin-bottom: clamp(34px, 11vw, 52px);
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] {
    padding: clamp(20px, 6vw, 28px);
    border-radius: clamp(24px, 8vw, 34px);
    box-shadow: 0 8px 22px rgba(29, 30, 28, 0.07);
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] h3 {
    font-size: clamp(22px, 6.2vw, 26px);
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__txt"] p {
    font-size: 16px;
    line-height: 1.48;
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class$="__year"] {
    width: clamp(126px, 42vw, 166px);
  }

  .page-id-2906 :is(
    #dangelo-1986,
    #dangelo-1992,
    #dangelo-1997,
    #dangelo-2002,
    #dangelo-2006,
    #dangelo-2010,
    #dangelo-2021,
    #dangelo-heute
  ) [class*="__photo"] {
    max-height: 260px;
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__stage {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__photo--center {
    margin-bottom: 16%;
  }

  .page-id-2906 #dangelo-portraits .dangelo-portraits__photo--right {
    grid-column: 1 / -1;
    width: 54%;
    margin: -9% auto 0;
  }

  .page-id-2906 #dangelo-nudel {
    opacity: 0.08;
  }

  .page-id-2906 #dangelo-und-jetzt:not(.dangelo-outro-mobile-ready) .dangelo-und-jetzt__stage {
    padding-top: 84%;
  }

  .page-id-2906 #dangelo-und-jetzt .dangelo-outro-mobile {
    padding-top: 42px;
    padding-bottom: 72px;
  }

  .page-id-2906 .elementor-location-header .elementor-element-c9518a9 {
    --padding-top: 12px;
    --padding-bottom: 12px;
    --padding-left: var(--jub-page-gutter);
    --padding-right: var(--jub-page-gutter);
  }

  .page-id-2906 .elementor-location-header .elementor-menu-toggle {
    min-width: 44px;
    min-height: 44px;
  }

  .page-id-2906 .elementor-location-footer :is(
    .elementor-element-27a6365 .elementor-heading-title,
    .elementor-element-43e5900 .elementor-heading-title
  ) {
    font-size: 16px;
    line-height: 1.45;
  }
}

@media (max-width: 620px) {
  .page-id-2906 .elementor-location-footer .elementor-element-42b907a > .e-con-inner {
    grid-template-columns: minmax(0, 1fr);
    gap: 34px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-42b907a {
    --padding-top: 34px;
    --padding-bottom: 38px;
  }

  .page-id-2906 .elementor-location-footer .elementor-element-46c95bd img {
    width: min(58%, 230px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .page-id-2906 .dangelo-mobile-reveal {
    opacity: 1 !important;
    translate: none !important;
    transition: none !important;
  }
}