@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../images/montserrat-regular.ttf') format('truetype');
}

/* PREVÉN interaction layer. Static content remains readable without JavaScript. */
:root {
  --ui-duration: 0.3s;
  --ui-ease: cubic-bezier(0.2, 0.65, 0.3, 1);
}

/* Original white brand asset over the photographic header. */
.immersive-page header .brand {
  background: transparent;
  padding: 0;
  border-radius: 0;
  box-shadow: none;
}
.immersive-page header .brand img {
  filter: none;
  width: 175px;
  height: auto;
  display: block;
  object-fit: contain;
}

.scroll-reveal {
  opacity: 0;
  translate: 0 24px;
  transition: opacity 0.65s var(--ui-ease), translate 0.65s var(--ui-ease);
  transition-delay: var(--reveal-delay, 0ms);
}
.scroll-reveal.is-visible,
.scroll-reveal:focus-within {
  opacity: 1;
  translate: 0 0;
}
.immersive-hero .photo-stage.parallax-photo {
  transform: translate3d(0, var(--parallax-y, 0px), 0) scale(1.07);
}

.btn,
.deck-arrows button,
.studio-tabs button,
.comparison-mode button,
.journey-controls button,
.reveal-guide button,
.nav-pop a,
.faq-question {
  transition: all var(--ui-duration) ease;
}
.btn:hover,
.btn:focus-visible {
  translate: 0 -2px;
  box-shadow: 0 9px 24px #17475225;
}
.btn:active,
.deck-arrows button:active {
  translate: 0 0;
  scale: 0.98;
}
.text-link,
.studio-lead a,
footer a:not(.brand),
nav > a {
  text-decoration: underline;
  text-decoration-color: transparent;
  text-underline-offset: 6px;
  transition: color var(--ui-duration) ease, text-decoration-color var(--ui-duration) ease;
}
.text-link:hover,
.studio-lead a:hover,
footer a:hover,
nav > a:hover {
  text-decoration-color: currentColor;
}
.story-image img,
.story-small img {
  transition: filter var(--ui-duration) ease;
}
.story-feature:hover img,
.story-small:hover img {
  filter: saturate(1.08) contrast(1.025);
}
.protection-card::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  opacity: 0;
  background: radial-gradient(260px circle at var(--pointer-x, 50%) var(--pointer-y, 50%), #c2fff120, transparent 75%);
  transition: opacity var(--ui-duration) ease;
}
.protection-card.has-spotlight::after { opacity: 1; }
.protection-card:not(.is-active):hover .card-art {
  transform: translateY(-5px) rotate(-5deg);
  background: #ffffff70;
}
.protection-card:not(.is-active):hover .card-expand { translate: 3px -3px; }
.card-expand { transition: translate var(--ui-duration) ease; }
.compare-row-labels button:hover,
.compare-row-labels button:focus-visible { background: #c7ded5; }
.journey-track button:hover > span { box-shadow: 0 0 0 7px #8ac2c31a; }

.faq-section {
  display: grid;
  grid-template-columns: 0.8fr 1.2fr;
  gap: 65px;
  background: #f3f7f5;
  border-radius: 28px;
  margin-bottom: 75px;
}
.faq-heading h2 {
  font-size: clamp(30px, 3.6vw, 48px);
  line-height: 1.12;
  letter-spacing: -1.4px;
  margin: 20px 0;
  color: #263550;
}
.faq-heading h2 span { color: #448b87; }
.faq-heading p { font-size: 14px; color: #667b7b; max-width: 330px; }
.faq-heading .btn { margin-top: 18px; font-size: 12px; }
.faq-item { border-bottom: 1px solid #d4e1da; }
.faq-item h3 { margin: 0; }
.faq-question {
  border: 0;
  padding: 22px 0;
  background: none;
  width: 100%;
  display: flex;
  gap: 20px;
  justify-content: space-between;
  align-items: center;
  text-align: left;
  color: #263550;
  font-size: 16px;
  line-height: 1.45;
  font-weight: 600;
}
.faq-question:hover { color: #377e77; }
.faq-question > span {
  position: relative;
  width: 29px;
  height: 29px;
  border: 1px solid #cadcd5;
  border-radius: 50%;
  flex-shrink: 0;
  transition: all var(--ui-duration) ease;
}
.faq-question > span::before,
.faq-question > span::after {
  content: '';
  position: absolute;
  top: 13px;
  left: 8px;
  width: 11px;
  height: 1px;
  background: currentColor;
  transition: transform var(--ui-duration) ease;
}
.faq-question > span::after { transform: rotate(90deg); }
.is-open .faq-question > span { background: #263550; color: white; border-color: #263550; }
.is-open .faq-question > span::after { transform: rotate(0); }
.faq-panel { display: grid; grid-template-rows: 1fr; }
.faq-panel > div { overflow: hidden; min-height: 0; }
.faq-panel p { margin: 0; padding: 0 40px 24px 0; font-size: 14px; line-height: 1.8; color: #617776; }
.faq-enhanced .faq-panel {
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows var(--ui-duration) ease, opacity var(--ui-duration) ease;
}
.faq-enhanced .is-open .faq-panel { grid-template-rows: 1fr; opacity: 1; }

@media (max-width: 800px) {
  .faq-section { grid-template-columns: 1fr; gap: 28px; border-radius: 0; }
  .faq-heading p { max-width: 100%; }
  .immersive-page header .brand { padding: 0; }
  .immersive-page header .brand img { width: 125px; }
}
@media (max-width: 540px) {
  .faq-question { font-size: 14px; }
  .faq-panel p { font-size: 13px; padding-right: 10px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .scroll-reveal { opacity: 1; translate: none; }
  .parallax-photo { transform: none !important; }
  *, *::before, *::after {
    animation: none !important;
    transition: none !important;
  }
}
@media print {
  .scroll-reveal { opacity: 1; translate: none; }
  .faq-enhanced .faq-panel { grid-template-rows: 1fr; opacity: 1; }
}

/* Unified type and component finish. Regular is the only requested weight. */
body, body * {
  font-family: 'Montserrat', Arial, sans-serif !important;
  font-weight: 400 !important;
  font-synthesis: none;
}
h1 em { font-style: normal; }
button, .btn, .nav-drop summary {
  border-radius: 12px !important;
  transition: all 0.3s ease;
}
.protection-card, .product-card, .studio-detail, .comparison-lab,
.journey-panel, .journey-deliverables > div, .video-shell,
.story-image, .story-small img, .story-feature, .story-small,
.seo-product-grid article, .faq-section, .nav-pop, dialog {
  border-radius: 12px !important;
}
.product-card, .protection-card, .story-feature, .story-small,
.seo-product-grid article {
  transition: all 0.3s ease;
}
.nav-drop summary {
  padding: 10px 12px;
  margin: -10px -12px;
}
.nav-drop summary > span { transition: transform 0.3s ease; }
.nav-drop.dropdown-open summary > span { transform: rotate(180deg); }
.nav-drop.dropdown-open summary { background: #84c2b918; }
.nav-pop { transform-origin: top center; }
.nav-pop a { border-radius: 12px; }
.nav-pop a:hover, .nav-pop a:focus-visible {
  background: #e4f0ea;
  transform: translateX(4px);
}
@media (hover: hover) and (pointer: fine) {
  button:hover, .btn:hover {
    translate: 0 0;
    transform: translateY(-5px);
    box-shadow: 0 10px 24px #1a40541c;
  }
  .product-card:hover, .protection-card:hover,
  .story-feature:hover, .story-small:hover,
  .seo-product-grid article:hover {
    transform: translateY(-5px);
    box-shadow: 0 14px 30px #1a40541a;
  }
  button:disabled:hover { transform: none; box-shadow: none; }
}
@media (prefers-reduced-motion: reduce) {
  button:hover, .btn:hover, .product-card:hover, .protection-card:hover,
  .story-feature:hover, .story-small:hover, .seo-product-grid article:hover,
  .nav-pop a:hover { transform: none !important; translate: none !important; }
}