/*
 * Idealugano responsive layer
 * Loaded after idealugano.css so the approved desktop art direction remains
 * untouched while compact layouts get deterministic, device-safe rules.
 */

/* Shared resilience */
html,
body {
  min-width: 0;
  overscroll-behavior-x: none;
}

html.idea-menu-open,
body.idea-menu-open {
  height: 100%;
  overflow: hidden !important;
  overscroll-behavior: none;
}

#smooth-wrapper,
#smooth-content,
.site-main,
.idea-section,
.idea-container {
  min-width: 0;
  max-width: 100%;
}

img,
svg,
video,
canvas,
iframe {
  max-width: 100%;
}

button,
input,
textarea,
select {
  max-width: 100%;
}

:where(a, button, input, textarea, select, [tabindex]):focus-visible {
  outline: 2px solid var(--idea-gold-light);
  outline-offset: 4px;
}

.idea-page-hero__title,
.idea-hero__title,
.idea-section h2,
.idea-section h3 {
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.idea-lead,
.idea-page-hero__subtitle,
.idea-service-card__desc,
.idea-service-detail__text p,
.idea-method-step__desc {
  text-wrap: pretty;
}

/* Wide screens: keep readable line lengths and proportional breathing room. */
@media (min-width: 1600px) {
  :root {
    --container-max: 1500px;
    --gutter: clamp(2.5rem, 3vw, 4rem);
  }

  .idea-hero__content {
    max-width: 980px;
  }

  .idea-footer__grid {
    gap: clamp(2rem, 3vw, 4rem);
  }
}

/* Laptop and landscape tablet */
@media (max-width: 1200px) {
  :root {
    --h1-size: clamp(3rem, 7vw, 5.5rem);
    --h2-size: clamp(2.25rem, 5vw, 4rem);
    --section-pad: clamp(4rem, 7vw, 6.5rem);
  }

  .idea-header__nav-left,
  .idea-header__nav-right nav {
    gap: clamp(1rem, 1.7vw, 2rem);
  }

  .idea-nav__link {
    font-size: 0.76rem;
  }

  .idea-footer__grid {
    grid-template-columns: 1.35fr repeat(2, 1fr);
    gap: 2.5rem 2rem;
  }
}

/* Tablet and all hamburger layouts */
@media (max-width: 1024px) {
  html {
    scroll-behavior: auto !important;
  }

  :root {
    --body-size: 1rem;
    --section-gap: clamp(1.5rem, 4vw, 3rem);
  }

  .idea-header {
    padding-top: max(0.7rem, env(safe-area-inset-top));
    padding-bottom: 0.7rem;
  }

  .idea-header.scrolled {
    padding-top: max(0.45rem, env(safe-area-inset-top));
    padding-bottom: 0.45rem;
  }

  .idea-header__inner {
    min-height: 52px;
  }

  .idea-header__logo-img {
    height: clamp(42px, 6vw, 50px);
  }

  .idea-header__logo {
    min-width: 48px;
    min-height: 48px;
    justify-content: flex-start;
  }

  .idea-header.scrolled .idea-header__logo-img {
    height: 36px;
  }

  .idea-hamburger {
    width: 48px;
    min-width: 48px;
    height: 48px;
    margin-right: 0;
    transform: translateX(10px);
    touch-action: manipulation;
  }

  .idea-hamburger span {
    left: 10px;
    width: 28px;
  }

  .idea-hamburger span:nth-child(1) { top: 14px; }
  .idea-hamburger span:nth-child(2) { top: 24px; }
  .idea-hamburger span:nth-child(3) { bottom: 13px; }

  .idea-mobile-menu {
    height: 100svh;
    min-height: 100dvh;
    justify-content: flex-start;
    gap: clamp(0.55rem, 2.2vh, 1.35rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding:
      max(6.25rem, calc(env(safe-area-inset-top) + 5rem))
      max(var(--gutter), env(safe-area-inset-right))
      max(2rem, env(safe-area-inset-bottom))
      max(var(--gutter), env(safe-area-inset-left));
    transform: none;
  }

  .idea-mobile-menu__link {
    display: grid;
    min-height: 44px;
    place-items: center;
    font-size: clamp(1.65rem, 5vw, 2.35rem);
    line-height: 1.05;
  }

  .idea-mobile-menu__cta {
    margin-top: clamp(0.4rem, 1.5vh, 1rem);
  }

  .idea-mobile-menu__close {
    top: max(1rem, env(safe-area-inset-top));
    right: max(1rem, env(safe-area-inset-right));
  }

  .idea-hero {
    min-height: 100svh;
    min-height: 100dvh;
  }

  .idea-hero__content {
    width: min(100%, 760px);
    padding-top: clamp(6rem, 14svh, 8rem);
    padding-bottom: clamp(5rem, 11svh, 7rem);
  }

  .idea-hero__bg-img {
    object-position: center center;
  }

  .idea-signature {
    padding: clamp(5rem, 9vw, 8rem) 0;
  }

  .idea-signature__stage {
    min-height: clamp(760px, 92svh, 900px);
  }

  .idea-services-scene {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .idea-curtains-story__stage {
    overflow: visible;
  }

  .idea-curtains-story .idea-text-center {
    padding: 0 var(--gutter);
    margin: 0 0 clamp(2rem, 5vw, 3rem);
  }

  .idea-curtains-track {
    overscroll-behavior-inline: contain;
    scroll-padding-inline: var(--gutter);
    touch-action: pan-x pan-y;
  }

  .idea-curtains-track .idea-curtain-card {
    flex-basis: min(82vw, 720px);
    height: min(64svh, 620px);
    min-height: 440px;
  }

  .idea-objects-collage,
  .idea-transformations {
    padding-top: clamp(7rem, 15vw, 11rem);
  }

  .idea-contact-prelude {
    min-height: 58svh;
  }

  .idea-contact-prelude__line {
    font-size: clamp(4rem, 13vw, 8rem);
  }

  .idea-link,
  .idea-footer__links a,
  .idea-footer__social a,
  .idea-footer__utility a,
  .idea-footer__legal a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  .idea-gallery-masonry {
    columns: 2;
  }

  .idea-footer__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Phones and narrow tablets */
@media (max-width: 767px) {
  :root {
    --h1-size: clamp(2.65rem, 13vw, 4.5rem);
    --h2-size: clamp(2.15rem, 10vw, 3.5rem);
    --h3-size: clamp(1.55rem, 7vw, 2.1rem);
    --h4-size: clamp(1.25rem, 5vw, 1.55rem);
    --body-size: 1rem;
    --small-size: 0.875rem;
    --section-pad: clamp(3.75rem, 14vw, 5.5rem);
    --section-gap: clamp(1.5rem, 7vw, 2.5rem);
    --gutter: clamp(1.15rem, 5vw, 1.5rem);
    --radius-lg: 18px;
    --radius-xl: 22px;
  }

  .idea-section {
    overflow: clip;
  }

  .idea-mb-8 {
    margin-bottom: clamp(2.5rem, 10vw, 3.5rem);
  }

  .idea-lead {
    font-size: clamp(1rem, 4.4vw, 1.12rem);
    line-height: 1.62;
  }

  .idea-eyebrow {
    margin-bottom: 0.75rem;
    font-size: 0.72rem;
    letter-spacing: 0.13em;
  }

  .idea-gold-line {
    margin-top: 1.15rem;
    margin-bottom: 1.15rem;
  }

  .idea-btn {
    min-height: 48px;
    justify-content: center;
    padding: 0.9rem 1.15rem;
    font-size: 0.78rem;
    line-height: 1.2;
    text-align: center;
    touch-action: manipulation;
  }

  .idea-link {
    min-height: 44px;
    align-items: center;
  }

  .idea-header__inner {
    min-height: 46px;
  }

  .idea-header__logo-img {
    max-width: 112px;
    height: 42px;
  }

  .idea-header__logo-monogram {
    width: 34px;
    height: 34px;
  }

  .idea-header__logo-brand {
    font-size: 0.55rem;
  }

  .idea-mobile-menu__link {
    width: min(100%, 320px);
  }

  .idea-hero__content {
    padding-top: clamp(6rem, 18svh, 7.5rem);
    padding-bottom: clamp(4.5rem, 12svh, 6rem);
  }

  .idea-hero__title {
    margin-bottom: 1rem;
    font-size: clamp(2.9rem, 14.5vw, 4.6rem);
    line-height: 0.98;
  }

  .idea-split-title__line {
    overflow: visible;
  }

  .idea-hero__subtitle {
    max-width: 34rem;
    margin-bottom: 1.6rem;
    font-size: clamp(0.95rem, 4vw, 1.08rem);
    line-height: 1.55;
  }

  .idea-hero__gold-line {
    margin-bottom: 1.45rem;
  }

  .idea-hero__buttons {
    width: min(100%, 360px);
    margin-inline: auto;
    gap: 0.75rem;
  }

  .idea-hero__buttons .idea-btn {
    flex: 1 1 100%;
    width: 100%;
  }

  .idea-hero__scroll {
    display: none;
  }

  .idea-signature {
    padding: clamp(4rem, 15vw, 5.5rem) 0;
  }

  .idea-signature__stage {
    min-height: clamp(650px, 105svh, 760px);
    align-content: start;
  }

  .idea-signature__image {
    width: min(78vw, 390px);
    height: clamp(360px, 61svh, 480px);
  }

  .idea-signature__word--back {
    top: 4%;
  }

  .idea-signature__word--front {
    bottom: 34%;
    max-width: 100vw;
  }

  .idea-signature__copy {
    left: var(--gutter);
    right: var(--gutter);
    bottom: 0;
    width: auto;
  }

  .idea-services-scene,
  .idea-grid--2,
  .idea-grid--3,
  .idea-grid--4 {
    grid-template-columns: minmax(0, 1fr);
  }

  .idea-service-card__body,
  .idea-testimonial-card {
    padding: clamp(1.15rem, 5vw, 1.5rem);
  }

  .idea-service-card__desc {
    font-size: 0.9rem;
  }

  .idea-curtains-story {
    padding: var(--section-pad) 0;
  }

  .idea-curtains-track {
    gap: 0.9rem;
    padding-bottom: 1rem;
  }

  .idea-curtains-track .idea-curtain-card {
    flex-basis: min(86vw, 430px);
    height: min(58svh, 500px);
    min-height: 360px;
    border-radius: 20px;
    scroll-snap-align: center;
  }

  .idea-curtains-track .idea-curtain-card__title {
    left: 1.15rem;
    bottom: 1.15rem;
    font-size: clamp(1.6rem, 8vw, 2.35rem);
  }

  .idea-products-scroll {
    display: flex !important;
    gap: 1.5rem;
    width: auto;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory;
    margin-inline: calc(var(--gutter) * -1);
    padding-inline: var(--gutter);
    scroll-padding-inline: var(--gutter);
    scrollbar-width: none;
    touch-action: pan-x pan-y !important;
    -webkit-overflow-scrolling: touch;
  }

  .idea-products-scroll::-webkit-scrollbar {
    display: none;
  }

  .idea-products-scroll .idea-product-card {
    flex: 0 0 min(84vw, 330px);
    scroll-snap-align: center;
  }

  .idea-motion-enabled .idea-products-scroll .idea-product-card__image img {
    opacity: 1 !important;
  }

  .idea-product-card__body {
    padding: 1.1rem 1.15rem;
  }

  .idea-brands-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  .idea-brand-item {
    min-width: 0;
    min-height: 84px;
    padding: 0.75rem;
  }

  .idea-brand-item img {
    width: min(100%, 135px);
    height: 52px;
  }

  .idea-editorial__grid {
    gap: clamp(2.5rem, 12vw, 4rem);
  }

  .idea-objects-collage {
    padding-top: clamp(6rem, 24vw, 8rem);
  }

  .idea-objects-collage .idea-objects-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.75rem;
  }

  .idea-objects-collage .idea-object-item:nth-child(n) {
    aspect-ratio: 1 / 1;
    transform: none;
  }

  .idea-object-item__caption {
    padding: 0.8rem;
    opacity: 1;
    font-size: 0.7rem;
  }

  .idea-transformations {
    padding-top: clamp(7rem, 25vw, 9rem);
  }

  .idea-kinetic span {
    font-size: clamp(2.8rem, 14vw, 4.6rem);
    letter-spacing: -0.035em;
  }

  .idea-contact-prelude__line {
    font-size: clamp(1.8rem, 9.5vw, 3rem);
    letter-spacing: -0.035em;
  }

  /* TRASFORMARE starts from the left edge on small screens */
  .idea-kinetic--transform {
    padding-left: 0;
  }

  .idea-contact-prelude {
    min-height: 30svh;
    padding-block: 2rem;
  }

  .idea-ba-slider {
    aspect-ratio: 4 / 3;
    border-radius: 18px;
  }

  .idea-ba-slider__handle {
    width: 3px;
  }

  .idea-ba-slider__handle::before {
    width: 52px;
    height: 52px;
  }

  .idea-ba-slider__label {
    bottom: 0.65rem;
    padding: 0.28rem 0.55rem;
    font-size: 0.65rem;
  }

  .idea-ba-slider__label--before { left: 0.65rem; }
  .idea-ba-slider__label--after { right: 0.65rem; }

  .idea-ba-carousel__arrow {
    width: 46px;
    height: 46px;
  }

  .idea-ba-carousel__arrow--prev { left: 0.4rem; }
  .idea-ba-carousel__arrow--next { right: 0.4rem; }

  .idea-contact-grid {
    gap: clamp(2.5rem, 11vw, 4rem);
  }

  .idea-contact-info-card {
    gap: 0.85rem;
  }

  .idea-contact-info-card__value {
    overflow-wrap: anywhere;
  }

  .idea-form__input,
  .idea-form__textarea,
  .idea-form select {
    min-height: 48px;
    font-size: 16px;
  }

  .idea-form__textarea {
    min-height: 150px;
  }

  .idea-form .idea-btn {
    width: 100%;
  }

  .idea-page-hero {
    padding-top: clamp(7.5rem, 28vw, 9rem);
    padding-bottom: clamp(3.75rem, 14vw, 5rem);
  }

  .idea-page-hero__title {
    margin-inline: auto;
    max-width: 12ch;
    line-height: 0.98;
  }

  .idea-page-hero__subtitle {
    max-width: 34rem;
    font-size: 1rem;
  }

  .idea-service-detail {
    grid-template-columns: minmax(0, 1fr);
    gap: 1.5rem;
    padding-block: clamp(2.25rem, 10vw, 3.5rem);
  }

  .idea-service-detail:nth-child(even) .idea-service-detail__image {
    order: 0;
  }

  .idea-service-detail__image {
    aspect-ratio: 4 / 3;
  }

  .idea-products-grid {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
    gap: 1rem;
  }

  .idea-gallery-title {
    margin-bottom: 1.5rem;
  }

  .idea-gallery-filters {
    justify-content: flex-start;
    flex-wrap: nowrap;
    gap: 0.55rem;
    margin-inline: -20px;
    padding-inline: 20px !important;
    padding-block: 0 0.5rem;
    scroll-padding-inline: 20px;
    overflow-x: auto;
    scroll-snap-type: x proximity;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
  }

  .idea-gallery-filters::-webkit-scrollbar {
    display: none;
  }

  .idea-gallery-filter-btn {
    flex: 0 0 auto;
    min-height: 44px;
    padding: 0.65rem 1rem;
    scroll-snap-align: start;
  }

  .idea-gallery-masonry {
    columns: 1;
    column-gap: 0;
  }

  .idea-gallery-masonry__item {
    margin-bottom: 0.85rem;
  }

  .idea-lightbox {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
  }

  .idea-method-step {
    gap: 1rem;
    padding-block: 1.5rem;
  }

  .idea-method-step__num {
    min-width: 44px;
    font-size: 2.2rem;
  }

  .idea-map-placeholder {
    aspect-ratio: 4 / 3;
    border-radius: 18px;
  }

  .idea-google-map {
    min-height: 300px;
  }

  .idea-footer {
    padding-top: clamp(3.75rem, 15vw, 5rem);
  }

  .idea-footer__grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 2.25rem;
  }

  .idea-footer__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .idea-footer__logo-img {
    width: min(132px, 38vw);
  }

  .idea-footer__brand-desc {
    max-width: 320px;
  }

  .idea-footer__links a,
  .idea-footer__social a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  .idea-footer__contact-item > a { min-height: 44px; }

  .idea-footer__bottom,
  .idea-footer__bottom-links {
    width: 100%;
    align-items: center;
    text-align: center;
  }

  .idea-footer__utility,
  .idea-footer__legal {
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.4rem 1.1rem;
  }

  .idea-footer__utility a,
  .idea-footer__legal a {
    display: inline-flex;
    min-height: 44px;
    align-items: center;
  }

  .idea-legal-content {
    font-size: 1rem;
    line-height: 1.72;
  }
}

/* Small phones: 320–374px */
@media (max-width: 374px) {
  :root {
    --gutter: 1rem;
  }

  .idea-header__logo-img {
    max-width: 96px;
    height: 38px;
  }

  .idea-hero__title {
    font-size: clamp(2.65rem, 14vw, 3.2rem);
  }

  .idea-mobile-menu {
    gap: 0.45rem;
  }

  .idea-mobile-menu__link {
    font-size: 1.55rem;
  }

  .idea-signature__stage {
    min-height: 640px;
  }

  .idea-signature__image {
    height: 350px;
  }

  .idea-signature__word--front {
    font-size: 3.35rem;
  }

  .idea-objects-collage .idea-objects-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .idea-brand-item {
    min-height: 72px;
  }

  #metodo .reveal-stagger {
    max-width: 720px;
    margin-inline: auto;
  }

  .idea-method-step {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
  }
}

/* Short landscape screens: preserve content and keep menu scrollable. */
@media (max-height: 600px) and (orientation: landscape) {
  .idea-mobile-menu {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-content: start;
    gap: 0.25rem 1rem;
    padding-top: max(4.5rem, calc(env(safe-area-inset-top) + 3.5rem));
  }

  .idea-mobile-menu__link {
    min-height: 40px;
    font-size: clamp(1.25rem, 5vh, 1.7rem);
  }

  .idea-mobile-menu__cta {
    grid-column: 1 / -1;
    justify-self: center;
    margin-top: 0.4rem;
  }

  .idea-hero__content {
    padding-top: 5rem;
    padding-bottom: 1.5rem;
  }

  .idea-hero__title {
    font-size: clamp(2.35rem, 11vh, 4rem);
    margin-bottom: 0.55rem;
  }

  .idea-hero__subtitle {
    margin-bottom: 0.75rem;
    font-size: 0.88rem;
  }

  .idea-hero__gold-line {
    margin-bottom: 0.75rem;
  }

  .idea-hero__buttons {
    width: auto;
    flex-wrap: nowrap;
  }

  .idea-hero__buttons .idea-btn {
    width: auto;
    min-height: 42px;
    padding-block: 0.65rem;
  }

  .idea-curtains-track .idea-curtain-card {
    height: 72svh;
    min-height: 300px;
  }
}

/* Touch devices must never depend on hover to reveal information. */
@media (hover: none), (pointer: coarse) {
  .idea-btn:hover,
  .idea-service-card:hover,
  .idea-product-card:hover,
  .idea-brand-item:hover,
  .idea-service-card:hover .idea-service-card__image img,
  .idea-product-card:hover .idea-product-card__image img,
  .idea-curtain-card:hover .idea-curtain-card__image,
  .idea-object-item:hover img,
  .idea-gallery-masonry__item:hover img {
    transform: none;
  }

  .idea-object-item__caption {
    opacity: 1;
  }

  .idea-drag-cursor {
    display: none !important;
  }
}

/* Reduced motion: no hidden states, pinning or continuous effects. */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }

  .idea-hero__title,
  .idea-hero__subtitle,
  .idea-hero__buttons,
  .idea-hero__eyebrow,
  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }

  .idea-signature,
  .idea-curtains-story {
    height: auto !important;
  }

  .idea-signature__stage,
  .idea-curtains-story__stage {
    position: relative !important;
    top: auto !important;
  }

  .idea-kinetic,
  .idea-contact-prelude {
    transform: none !important;
  }
}
