/* Fashion on Screen — V35
   Dark professional space + safe native page transitions.
   No link interception: all transition layers are pointer-events:none. */

:root{
  --fos35-pro:#012925;
  --fos35-pro-deep:#011f1c;
  --fos35-pro-card:#063832;
  --fos35-pro-card-hover:#08473f;
  --fos35-cream:#fff7f1;
  --fos35-muted:rgba(255,247,241,.72);
  --fos35-line:rgba(255,247,241,.16);
  --fos35-ease:cubic-bezier(.22,1,.36,1);
}

/* ---------- Professional space: deliberately darker ---------- */
body.v35-page.page-professionnels{
  background:var(--fos35-pro-deep)!important;
  color:var(--fos35-cream)!important;
}
body.v35-page.page-professionnels .site-header:not(.scrolled){
  background:linear-gradient(180deg,rgba(1,31,28,.92),rgba(1,31,28,.68) 72%,transparent)!important;
}
body.v35-page.page-professionnels .v6-page-hero,
body.v35-page.page-professionnels .v7-pro-hero{
  background:
    radial-gradient(circle at 72% 22%,rgba(24,118,102,.20),transparent 31%),
    radial-gradient(circle at 18% 80%,rgba(9,91,79,.15),transparent 28%),
    linear-gradient(145deg,#063b35 0%,var(--fos35-pro) 45%,#011b19 100%)!important;
  color:var(--fos35-cream)!important;
  border-bottom:1px solid var(--fos35-line)!important;
}
body.v35-page.page-professionnels .v6-page-hero :where(h1,h2,h3,strong,b),
body.v35-page.page-professionnels .v6-page-hero .v6-title,
body.v35-page.page-professionnels .v6-page-hero .v6-kicker{
  color:#fff!important;
}
body.v35-page.page-professionnels .v6-page-hero :where(p,span),
body.v35-page.page-professionnels .v6-lead,
body.v35-page.page-professionnels .v6-page-hero-foot{
  color:var(--fos35-muted)!important;
}
body.v35-page.page-professionnels .v6-page-hero-foot strong{color:#fff!important}
body.v35-page.page-professionnels .v6-hero-orbit{
  border-color:rgba(255,247,241,.10)!important;
}
body.v35-page.page-professionnels .v7-pro-section,
body.v35-page.page-professionnels #categories{
  background:var(--fos35-pro-deep)!important;
  color:var(--fos35-cream)!important;
}
body.v35-page.page-professionnels .v6-section-head :where(h2,h3),
body.v35-page.page-professionnels .v6-section-title,
body.v35-page.page-professionnels .v6-eyebrow{color:#fff!important}
body.v35-page.page-professionnels .v6-section-head p{color:var(--fos35-muted)!important}
body.v35-page.page-professionnels .v7-pro-card{
  background:linear-gradient(150deg,rgba(8,62,55,.98),rgba(3,45,41,.98))!important;
  color:var(--fos35-cream)!important;
  border:1px solid var(--fos35-line)!important;
  box-shadow:0 20px 55px rgba(0,0,0,.12)!important;
}
body.v35-page.page-professionnels .v7-pro-card:hover{
  background:linear-gradient(150deg,var(--fos35-pro-card-hover),#053a34)!important;
  border-color:rgba(255,247,241,.30)!important;
  transform:translateY(-5px)!important;
}
body.v35-page.page-professionnels .v7-pro-card :where(h3,strong,b){color:#fff!important}
body.v35-page.page-professionnels .v7-pro-card :where(p,small,span){color:var(--fos35-muted)!important}
body.v35-page.page-professionnels .v7-pro-card>b{color:#f7d9c8!important}
body.v35-page.page-professionnels .v6-cta{
  background:#052f2b!important;
  color:var(--fos35-cream)!important;
  border-top:1px solid var(--fos35-line)!important;
}
body.v35-page.page-professionnels .v6-cta :where(h2,strong){color:#fff!important}
body.v35-page.page-professionnels .v6-cta p{color:var(--fos35-muted)!important}
body.v35-page.page-professionnels .v6-cta .btn.green{
  background:#fff7f1!important;
  color:#033d37!important;
  border-color:#fff7f1!important;
}

/* ---------- Homepage entry sequence: darker, cleaner and visibly premium ---------- */
body.v35-page .v9-startup{
  background:
    radial-gradient(circle at 50% 44%,rgba(74,166,148,.16),transparent 24%),
    radial-gradient(circle at 50% 50%,rgba(255,247,241,.055),transparent 42%),
    linear-gradient(155deg,#07544b 0%,#023d37 45%,#011f1c 100%)!important;
}
body.v35-page .v9-startup-frame{opacity:.72!important}
body.v35-page .v9-startup .fos-startup-logo{
  width:min(410px,68vw)!important;
  filter:none!important;
  animation-duration:2.25s!important;
}
body.v35-page .v9-startup-sweep{animation-duration:2.2s!important}
body.v35-page .v9-startup-status,
body.v35-page .fos-startup-copy{color:rgba(255,247,241,.65)!important}

/* ---------- Native, non-blocking page entrance ---------- */
body.v35-page:not(.page-index)::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:5900;
  pointer-events:none;
  background:
    linear-gradient(90deg,transparent 0 44%,rgba(255,255,255,.08) 49.5%,rgba(255,255,255,.16) 50%,rgba(255,255,255,.08) 50.5%,transparent 56%),
    #023b35;
  transform-origin:top center;
  animation:fos35VeilOut .56s var(--fos35-ease) both;
}
body.v35-page:not(.page-index) main{
  animation:fos35PageIn .58s var(--fos35-ease) both;
}
body.v35-page:not(.page-index) .site-header{
  animation:fos35HeaderIn .46s var(--fos35-ease) both;
}

@keyframes fos35VeilOut{
  0%{opacity:1;transform:translateY(0)}
  45%{opacity:1}
  100%{opacity:0;transform:translateY(-102%)}
}
@keyframes fos35PageIn{
  0%{opacity:.18;transform:translateY(12px);filter:blur(2px)}
  100%{opacity:1;transform:none;filter:none}
}
@keyframes fos35HeaderIn{
  0%{opacity:0;transform:translateY(-10px)}
  100%{opacity:1;transform:none}
}

/* Cross-document View Transitions where the browser supports them.
   Unsupported browsers simply keep the native navigation + CSS entrance above. */
@view-transition{navigation:auto}
::view-transition-old(root){animation:fos35OldPage .24s ease both}
::view-transition-new(root){animation:fos35NewPage .42s var(--fos35-ease) both}
@keyframes fos35OldPage{to{opacity:.72;transform:scale(.994)}}
@keyframes fos35NewPage{from{opacity:.35;transform:translateY(7px)}to{opacity:1;transform:none}}

/* Keep the professional dropdown in the same dark family. */
body.v35-page .nav-dropdown-menu{
  background:rgba(1,35,31,.97)!important;
  border-color:rgba(255,247,241,.14)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.22)!important;
}
body.v35-page .nav-dropdown-menu a{border-color:rgba(255,247,241,.08)!important}
body.v35-page .nav-dropdown-menu a:hover{background:rgba(255,255,255,.065)!important}
body.v35-page .nav-dropdown-menu :where(b,small){color:#fff!important}
body.v35-page .nav-dropdown-menu small{opacity:.62}

@media(max-width:780px){
  body.v35-page.page-professionnels .v7-pro-card{min-height:280px!important}
  body.v35-page:not(.page-index)::after{animation-duration:.44s}
  body.v35-page:not(.page-index) main{animation-duration:.48s}
}

@media(prefers-reduced-motion:reduce){
  body.v35-page:not(.page-index)::after{display:none!important}
  body.v35-page:not(.page-index) main,
  body.v35-page:not(.page-index) .site-header,
  ::view-transition-old(root),
  ::view-transition-new(root){animation:none!important}
  body.v35-page.page-professionnels .v7-pro-card:hover{transform:none!important}
}
