/* PISSA — final brand and interaction system */
:root{
  --pissa-red:#991E1B;
  --pissa-red-hover:#B12420;
  --pissa-red-active:#7A1715;
  --pissa-red-soft:#D66A62;
  --pissa-ease:cubic-bezier(.22,.61,.36,1);
  --pissa-radius-sm:14px;
  --pissa-radius-md:22px;
  --pissa-radius-lg:30px;
  --pissa-shadow-sm:0 10px 28px rgba(15,15,14,.09);
  --pissa-shadow-md:0 18px 48px rgba(15,15,14,.13);
  --pissa-shadow-red:0 14px 34px rgba(153,30,27,.24);
  --pissa-gradient:linear-gradient(135deg,#7A1715 0%,#991E1B 55%,#B12420 100%);
}

html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}

/* Consistent interactive rhythm */
a,button,.button,.w-button,.outline-button,.button-with-animation,
.button-first-line,.button-line-main,.button-line,.menu-link-new,
.pissa-mobile-menu-trigger{
  transition:color .24s var(--pissa-ease),background-color .24s var(--pissa-ease),
  border-color .24s var(--pissa-ease),box-shadow .24s var(--pissa-ease),
  transform .24s var(--pissa-ease),opacity .24s var(--pissa-ease)!important;
}

/* Brand color consistency */
.button,.w-button,.button-with-animation,.pissa-mobile-menu-trigger[aria-expanded="true"],
.m-nav-cta,.mobile-menu-cta{background:var(--pissa-gradient)!important}
.button:hover,.w-button:hover,.button-with-animation:hover,.m-nav-cta:hover,.mobile-menu-cta:hover{
  background:linear-gradient(135deg,#841A17 0%,#B12420 100%)!important;
  box-shadow:var(--pissa-shadow-red)!important;
  transform:translateY(-2px)
}
.button:active,.w-button:active,.button-with-animation:active{transform:translateY(0) scale(.985)}

/* Outline controls */
.outline-button,.button-first-line,.button-line-main,.button-line{
  border-color:color-mix(in srgb,var(--pissa-red) 78%,transparent)!important
}
.outline-button:hover,.button-first-line:hover,.button-line-main:hover,.button-line:hover{
  border-color:var(--pissa-red)!important;color:var(--pissa-red)!important;
  box-shadow:0 10px 28px rgba(153,30,27,.12)
}

/* Cards and media use one visual language */
[class*="card"],.experience-cinematic__content,.pissa-mobile-header{
  box-shadow:var(--pissa-shadow-sm)
}
.experience-cinematic__content{border-radius:var(--pissa-radius-lg)}
img,video{backface-visibility:hidden}

/* Refined focus states */
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:3px solid rgba(153,30,27,.28)!important;outline-offset:3px
}

/* Preserve readability and make brand glows genuinely red */
.experience-cinematic__plus{color:var(--pissa-red)!important}
.pissa-mobile-menu-trigger[aria-expanded="true"]{box-shadow:var(--pissa-shadow-red)!important}

@media (hover:hover){
  .outline-button:hover,.button-with-animation:hover,.button:hover,.w-button:hover{will-change:transform}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}

/* =========================================================
   PISSA — Desktop Liquid Glass Navbar
   Visual-only enhancement. Mobile/tablet navigation untouched.
   ========================================================= */
@media (min-width: 1181px) {
  .navbarhomecard {
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .navbar-component {
    position: relative !important;
    isolation: isolate;
    overflow: hidden;
    background:
      linear-gradient(135deg,
        rgba(255,255,255,.78) 0%,
        rgba(255,255,255,.58) 46%,
        rgba(255,255,255,.69) 100%) !important;
    -webkit-backdrop-filter: blur(28px) saturate(175%) contrast(105%);
    backdrop-filter: blur(28px) saturate(175%) contrast(105%);
    border: 1px solid rgba(255,255,255,.72) !important;
    box-shadow:
      0 18px 48px rgba(15, 23, 42, .18),
      0 3px 12px rgba(15, 23, 42, .08),
      inset 0 1px 0 rgba(255,255,255,.94),
      inset 0 -1px 0 rgba(255,255,255,.30) !important;
  }

  .navbar-component::before {
    content: "";
    position: absolute;
    z-index: -1;
    inset: 0;
    pointer-events: none;
    background:
      radial-gradient(70% 110% at 14% -18%, rgba(255,255,255,.82), transparent 58%),
      linear-gradient(90deg, transparent 2%, rgba(255,255,255,.38) 48%, transparent 98%);
    opacity: .9;
  }

  .navbar-component::after {
    content: "";
    position: absolute;
    z-index: 2;
    pointer-events: none;
    top: 0;
    left: 8%;
    right: 8%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,.98), transparent);
    opacity: .9;
  }

  .navbar-component .navbar-link,
  .navbar-component .menu-left,
  .navbar-component .menu-right,
  .navbar-component .logo-link-main {
    position: relative;
    z-index: 3;
  }

  .navbar-component .navbar-link {
    text-shadow: 0 1px 0 rgba(255,255,255,.35);
  }
}

/* =========================================================
   PISSA — Desktop Liquid Glass v2
   More expressive, Apple-inspired optical glass treatment.
   Desktop only; layout and mobile navigation remain unchanged.
   ========================================================= */
@media (min-width: 1181px) {
  .navbarhomecard {
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .navbar-component {
    position: relative !important;
    isolation: isolate;
    overflow: hidden !important;
    background:
      linear-gradient(125deg,
        rgba(255,255,255,.34) 0%,
        rgba(255,255,255,.16) 38%,
        rgba(255,255,255,.24) 68%,
        rgba(255,255,255,.30) 100%) !important;
    -webkit-backdrop-filter: blur(34px) saturate(210%) contrast(108%) brightness(108%);
    backdrop-filter: blur(34px) saturate(210%) contrast(108%) brightness(108%);
    border: 1px solid rgba(255,255,255,.62) !important;
    box-shadow:
      0 24px 60px rgba(9, 14, 28, .24),
      0 8px 20px rgba(9, 14, 28, .10),
      inset 0 1px 0 rgba(255,255,255,.96),
      inset 0 -1px 0 rgba(255,255,255,.18),
      inset 1px 0 0 rgba(255,255,255,.22),
      inset -1px 0 0 rgba(255,255,255,.16) !important;
  }

  /* Optical color refractions inside the glass */
  .navbar-component::before {
    content: "";
    position: absolute;
    z-index: 0;
    inset: -70% -8%;
    pointer-events: none;
    background:
      radial-gradient(circle at 14% 54%, rgba(177,36,32,.30) 0 8%, transparent 25%),
      radial-gradient(circle at 39% 18%, rgba(235,92,138,.18) 0 7%, transparent 24%),
      radial-gradient(circle at 67% 88%, rgba(111,88,255,.18) 0 8%, transparent 26%),
      radial-gradient(circle at 91% 22%, rgba(255,174,101,.20) 0 7%, transparent 23%),
      linear-gradient(105deg, transparent 16%, rgba(255,255,255,.26) 42%, transparent 64%);
    filter: blur(12px);
    opacity: .78;
    transform: translate3d(0,0,0);
    animation: pissaGlassDrift 14s ease-in-out infinite alternate;
  }

  /* Crisp glass edge + internal caustic */
  .navbar-component::after {
    content: "";
    position: absolute;
    z-index: 1;
    inset: 0;
    pointer-events: none;
    border-radius: inherit;
    background:
      linear-gradient(180deg, rgba(255,255,255,.60), transparent 16%),
      radial-gradient(80% 110% at 50% 130%, rgba(255,255,255,.20), transparent 64%);
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.20),
      inset 0 0 26px rgba(255,255,255,.10);
    opacity: .86;
  }

  .navbar-component > * {
    position: relative;
    z-index: 3;
  }

  .navbar-component .navbar-link,
  .navbar-component .lang-switcher,
  .navbar-component .logo-link-main {
    text-shadow: 0 1px 1px rgba(255,255,255,.58);
  }

  .navbar-component .button,
  .navbar-component .button-with-animation,
  .navbar-component .w-button {
    box-shadow:
      0 12px 26px rgba(153,30,27,.24),
      inset 0 1px 0 rgba(255,255,255,.20) !important;
  }
}

@keyframes pissaGlassDrift {
  0%   { transform: translate3d(-1.5%, -1%, 0) scale(1.01); }
  100% { transform: translate3d(1.5%, 1%, 0) scale(1.04); }
}

@media (prefers-reduced-motion: reduce) {
  .navbar-component::before { animation: none !important; }
}

/* =========================================================
   PISSA — Desktop Liquid Glass v3
   Brighter, more transparent and less tinted.
   Desktop only. Mobile/tablet remain untouched.
   ========================================================= */
@media (min-width: 1181px) {
  .navbarhomecard {
    background: transparent !important;
    box-shadow: none !important;
    overflow: visible !important;
  }

  .navbar-component {
    background:
      linear-gradient(180deg,
        rgba(255,255,255,.86) 0%,
        rgba(255,255,255,.76) 48%,
        rgba(255,255,255,.82) 100%) !important;
    -webkit-backdrop-filter: blur(24px) saturate(175%) brightness(1.08) contrast(1.02) !important;
    backdrop-filter: blur(24px) saturate(175%) brightness(1.08) contrast(1.02) !important;
    border: 1px solid rgba(255,255,255,.78) !important;
    box-shadow:
      0 16px 44px rgba(8,15,28,.14),
      0 3px 10px rgba(8,15,28,.06),
      inset 0 1px 0 rgba(255,255,255,.96),
      inset 0 -1px 0 rgba(255,255,255,.22) !important;
  }

  .navbar-component::before {
    inset: -55% -6%;
    background:
      radial-gradient(circle at 14% 50%, rgba(177,36,32,.12) 0 7%, transparent 23%),
      radial-gradient(circle at 42% 10%, rgba(235,92,138,.08) 0 7%, transparent 24%),
      radial-gradient(circle at 73% 92%, rgba(111,88,255,.08) 0 7%, transparent 24%),
      radial-gradient(circle at 93% 20%, rgba(255,174,101,.09) 0 6%, transparent 22%),
      linear-gradient(105deg, transparent 18%, rgba(255,255,255,.16) 44%, transparent 68%);
    filter: blur(14px);
    opacity: .14;
    animation: pissaGlassDrift 18s ease-in-out infinite alternate;
  }

  .navbar-component::after {
    background:
      linear-gradient(180deg, rgba(255,255,255,.40), transparent 18%),
      radial-gradient(85% 120% at 50% 128%, rgba(255,255,255,.10), transparent 68%);
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.12),
      inset 0 0 20px rgba(255,255,255,.06);
    opacity: .78;
  }

  .navbar-component .navbar-link,
  .navbar-component .lang-switcher,
  .navbar-component .logo-link-main {
    color: #7A1715 !important;
    text-shadow: none;
  }
}

/* =========================================================
   PISSA — Adaptive Liquid Glass Navigation
   Transparent over the home hero; readable glass on inner
   pages and after scrolling away from the hero.
   ========================================================= */
@media (min-width: 1181px) {
  .navbar-component {
    transition:
      background-color .28s cubic-bezier(.22,.61,.36,1),
      border-color .28s cubic-bezier(.22,.61,.36,1),
      box-shadow .28s cubic-bezier(.22,.61,.36,1),
      -webkit-backdrop-filter .28s cubic-bezier(.22,.61,.36,1),
      backdrop-filter .28s cubic-bezier(.22,.61,.36,1) !important;
  }

  /* High-legibility state for red/light inner-page heroes and scrolled home. */
  body.pissa-nav-readable .navbar-component {
    background:
      linear-gradient(180deg,
        rgba(255,255,255,.92) 0%,
        rgba(255,255,255,.91) 48%,
        rgba(255,255,255,.94) 100%) !important;
    -webkit-backdrop-filter: blur(22px) saturate(150%) brightness(1.04) !important;
    backdrop-filter: blur(22px) saturate(150%) brightness(1.04) !important;
    border-color: rgba(255,255,255,.82) !important;
    box-shadow:
      0 18px 46px rgba(8,15,28,.16),
      0 4px 12px rgba(8,15,28,.08),
      inset 0 1px 0 rgba(255,255,255,.98),
      inset 0 -1px 0 rgba(255,255,255,.24) !important;
  }

  body.pissa-nav-readable .navbar-component::before {
    opacity: .10 !important;
    animation-play-state: paused !important;
  }

  body.pissa-nav-readable .navbar-component::after {
    background:
      linear-gradient(180deg, rgba(255,255,255,.72), transparent 22%),
      radial-gradient(85% 120% at 50% 128%, rgba(255,255,255,.16), transparent 70%) !important;
    opacity: .72 !important;
  }

  body.pissa-nav-readable .navbar-component .navbar-link,
  body.pissa-nav-readable .navbar-component .lang-switcher,
  body.pissa-nav-readable .navbar-component .logo-link-main {
    color: #7A1715 !important;
    text-shadow: none !important;
  }
}
