/* Header bar color follows the page's own hero/head box exactly — via CSS
   custom properties, so it works for ANY color or texture (not just
   black/white), on every current and future page. --dark and --light are
   just convenience presets for the two most common cases; for anything else
   (a different color, a blurred/matte hero, etc.) set --nav-bg / --nav-fg /
   --nav-border / --nav-blur inline on the <header class="site-nav"> tag to
   match that page's actual head box precisely. */
.site-nav{position:relative;z-index:70;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;height:88px;padding:0 32px;border-bottom:1px solid;box-sizing:border-box;font-family:'Inter',Arial,sans-serif;background:var(--nav-bg,#0a0a0a);color:var(--nav-fg,#fff);border-bottom-color:var(--nav-border,rgba(255,255,255,.12));backdrop-filter:var(--nav-blur,none);-webkit-backdrop-filter:var(--nav-blur,none)}
.site-nav--dark{--nav-bg:#0a0a0a;--nav-fg:#fff;--nav-border:rgba(255,255,255,.12)}
.site-nav--light{--nav-bg:#fff;--nav-fg:#0a0a0a;--nav-border:rgba(10,10,10,.12)}
.site-nav__logo{grid-column:1;justify-self:start;display:block;width:127px;height:24px}
.site-nav__logo img{display:block;width:127px;height:24px;object-fit:contain;object-position:left center}
.site-nav .site-nav__links{position:static;z-index:auto;grid-column:2;justify-self:center;display:flex;grid-template-columns:none;align-items:center;gap:32px;padding:0;background:transparent;border:0;font-size:11px;font-weight:700;letter-spacing:.035em;text-transform:uppercase}
.site-nav__links a,.site-nav__languages a{position:relative;color:inherit;text-decoration:none;transition:opacity .2s}
.site-nav__services{position:relative;display:flex;align-items:center}
.site-nav__services-toggle{display:none;border:0;background:transparent;color:inherit;cursor:pointer}
.site-nav__submenu{position:absolute;z-index:80;top:calc(100% + 18px);left:50%;display:flex;min-width:290px;flex-direction:column;gap:0;padding:14px 18px;background:#0a0a0a;color:#fff;border:1px solid rgba(255,255,255,.14);box-shadow:0 18px 46px rgba(0,0,0,.35);opacity:0;visibility:hidden;transform:translate(-50%,-7px);transition:opacity .2s ease,transform .2s ease,visibility .2s}
.site-nav__submenu::before{content:"";position:absolute;right:0;bottom:100%;left:0;height:20px}
.site-nav__submenu a{padding:10px 2px;border-bottom:1px solid rgba(255,255,255,.14);font-size:11px;line-height:1.35;white-space:nowrap}
.site-nav__submenu a:last-child{border-bottom:0}
.site-nav__projects-submenu{min-width:330px;max-height:min(68vh,540px);overflow-y:auto}
.site-nav__submenu a::after{bottom:5px}
.site-nav__services:hover .site-nav__submenu,.site-nav__services:focus-within .site-nav__submenu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.site-nav__links a::after{display:none}
.site-nav__links a:hover::after,.site-nav__links a:focus-visible::after,.site-nav__links a[aria-current="page"]::after{transform:scaleX(1);transform-origin:left}
.site-nav__right{grid-column:3;justify-self:end;display:flex;align-items:center;gap:10px}
.site-nav__languages{display:flex;align-items:center;gap:0;font-size:11px;font-weight:700;letter-spacing:.04em}
.site-nav__languages a{padding:8px 5px;opacity:.68}
.site-nav__languages a[aria-current="page"]{opacity:1;color:#e92d24}
.site-nav__languages a:hover,.site-nav__languages a:focus-visible{opacity:1}
.site-nav__languages span{opacity:.3}
.site-nav__menu{display:none;width:38px;height:38px;margin-left:7px;padding:7px;border:0;background:transparent;color:inherit;cursor:pointer}
.site-nav__menu span{display:block;width:24px;height:1px;margin:5px 0;background:currentColor;transition:transform .25s,opacity .2s}
.site-nav-backdrop{display:none}
@media(max-width:1040px){
  .site-nav{grid-template-columns:1fr auto;height:72px;padding:0 20px}
  .site-nav__logo,.site-nav__logo img{width:106px;height:20px}
  .site-nav .site-nav__links{position:fixed;z-index:72;top:0;right:0;display:flex;width:min(82vw,330px);height:100dvh;flex-direction:column;align-items:stretch;justify-content:center;gap:0;padding:38px;background:var(--nav-bg,#0a0a0a);color:var(--nav-fg,#fff);box-shadow:-24px 0 60px rgba(0,0,0,.4);transform:translateX(105%);transition:transform .3s ease}
  .site-nav.menu-open .site-nav__links{transform:none}
  .site-nav__links a{padding:15px 0;border-bottom:1px solid var(--nav-border,rgba(255,255,255,.16));font-size:12px}
  .site-nav__services{display:grid;grid-template-columns:1fr 42px;align-items:center;border-bottom:1px solid var(--nav-border,rgba(255,255,255,.16))}
  .site-nav__services>.site-nav__services-link{border-bottom:0}
  .site-nav__services-toggle{display:grid;width:42px;height:42px;place-items:center;padding:0;font-size:17px;transition:transform .2s ease}
  .site-nav__services.submenu-open .site-nav__services-toggle{transform:rotate(180deg)}
  .site-nav__submenu{position:static;grid-column:1/-1;display:none;min-width:0;padding:0 0 10px 16px;border:0;border-left:1px solid var(--nav-border,rgba(255,255,255,.22));box-shadow:none;opacity:1;visibility:visible;transform:none;transition:none}
  .site-nav__services.submenu-open .site-nav__submenu{display:flex}
  .site-nav__submenu::before{display:none}
  .site-nav__submenu a{padding:9px 0;border-bottom:0;font-size:11px;font-weight:600;text-transform:none;white-space:normal}
  .site-nav__services:hover .site-nav__submenu,.site-nav__services:focus-within .site-nav__submenu{transform:none}
  .site-nav__links a::after{display:none}
  .site-nav__links a:hover,.site-nav__links a:focus-visible,.site-nav__links a[aria-current="page"]{color:#e92d24}
  .site-nav__right{grid-column:2}
  .site-nav__menu{display:block;position:relative;z-index:74}
  .site-nav.menu-open .site-nav__menu{color:#fff}
  .site-nav.menu-open .site-nav__menu span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .site-nav.menu-open .site-nav__menu span:nth-child(2){opacity:0}
  .site-nav.menu-open .site-nav__menu span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  .site-nav-backdrop.open{display:block;position:fixed;z-index:68;inset:0;background:rgba(0,0,0,.34);backdrop-filter:blur(2px)}
}

.site-nav--light .site-nav__logo img{content:url('/assets/branding-fain-wordmark-black.webp')}

/* Hover accent — global "light bulb" effect for link buttons sitewide */
a{transition:color .2s ease,text-shadow .2s ease}
a:hover,a:focus-visible,a:active{color:#e92d24;text-shadow:0 0 10px rgba(233,45,36,.55),0 0 20px rgba(233,45,36,.3)}
.nav-cta:hover,.lang-toggle:hover{box-shadow:0 0 16px rgba(231,43,34,.55)}

/* Link curent / apasat ramane rosu (nu doar la hover) */
.site-nav__links a[aria-current="page"],.site-nav__submenu a[aria-current="page"]{color:#e92d24}

/* Bara "inapoi la servicii" - doar pe cele 6 pagini individuale de serviciu */
.service-back-bar{display:flex;align-items:center;justify-content:space-between;height:88px;padding:0 32px;background:#0a0a0a;color:#fff;border-top:1px solid rgba(255,255,255,.12);box-sizing:border-box;font-family:'Inter',Arial,sans-serif}
.service-back-bar__logo{display:block;width:127px;height:24px}
.service-back-bar__logo img{display:block;width:127px;height:24px;object-fit:contain}
.service-back-bar__link{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-width:min(40vw,460px);color:inherit;text-decoration:none;font-size:clamp(14px,1.1vw,18px);font-weight:600;letter-spacing:-.015em;text-transform:none}
.service-back-bar__link span{font-size:1.15em;font-weight:300}
@media(max-width:1040px){.service-back-bar{height:80px;padding:0 20px}.service-back-bar__logo{width:106px;height:20px}.service-back-bar__logo img{width:106px;height:20px}.service-back-bar__link{min-width:0;font-size:14px;text-align:right}}
/* Unified site footer — same on every page: brand-black bar with a single
   row of primary navigation links, no extra copyright/meta row. */
footer{background:#0a0a0a;color:#7a7a75;border-top:1px solid #2a2a2a;font-size:11px;letter-spacing:0.02em;}
.site-footer-inner{padding:26px 32px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:18px 32px;box-sizing:border-box;width:100%;max-width:1180px;margin:0 auto;}
.site-footer-logo{display:block;flex-shrink:0;line-height:0;}
.site-footer-logo img{display:block;width:127px;height:24px;object-fit:contain;}
.site-footer-nav{display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px;list-style:none;}
.site-footer-nav a{color:#c8c8c4;font-size:12px;letter-spacing:.06em;text-transform:uppercase;font-weight:700;text-decoration:none;white-space:nowrap;}
@media(max-width:680px){
  .site-footer-inner{padding:22px;flex-direction:column;align-items:flex-start;gap:16px;}
  .site-footer-nav{flex-wrap:nowrap;width:100%;gap:clamp(6px,2.4vw,16px);}
  .site-footer-nav a{font-size:clamp(8.5px,2.4vw,11px);letter-spacing:.01em;}
}

/* Global header + footer system shared by every Romanian and English page. */
body>.site-nav{position:absolute;top:0;right:0;left:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
/* The AI pages render their navigation inside <main>; give that variant the
   same transparent hero overlay used by the rest of the site. */
main>.site-nav{position:absolute;top:0;right:0;left:0;background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;--nav-fg:#111!important;--nav-border:rgba(10,10,10,.18)!important;color:#111!important}
main>.site-nav .site-nav__logo img{content:url('/assets/branding-fain-wordmark-black.webp')!important}
main>.site-nav+.site-nav-backdrop+.hero{padding-top:88px}
.site-nav--dark{--nav-bg:transparent;--nav-fg:#fff;--nav-border:rgba(255,255,255,.16);--nav-panel:#090909;color:#fff}
.site-nav--light{--nav-bg:transparent;--nav-fg:#111;--nav-border:rgba(10,10,10,.18);--nav-panel:#f5f3ee;color:#111}
.site-nav--dark .site-nav__logo img{content:url('/assets/branding-fain-wordmark-white.webp')}
.site-nav--light .site-nav__logo img{content:url('/assets/branding-fain-wordmark-black.webp')}
.projects-page .site-nav,.projects-page .site-nav--light{--nav-fg:#fff;--nav-border:rgba(255,255,255,.16);--nav-panel:#090909;color:#fff}
.projects-page .site-nav--light .site-nav__logo img{content:url('/assets/branding-fain-wordmark-white.webp')}
.site-nav+.site-nav-backdrop+main>.case-hero{padding-top:120px}
.site-nav+.site-nav-backdrop+.hero>.hero-grid{padding-top:72px}
/* Keep the artwork behind the transparent navigation, while moving the hero
   copy below its readable/safe area on the two editorial layouts. */
.site-nav+.site-nav-backdrop+main .services-path-intro.orbit-editorial{padding-top:132px}
.site-nav+.site-nav-backdrop+main .strategy-hero .strategy-hero-copy{padding-top:120px!important}
.site-nav__links a{font-weight:600;letter-spacing:.02em;text-transform:none;font-size:13px}
.site-nav__links a[aria-current="page"]{color:inherit}
.site-nav__links a[aria-current="page"]::before{content:"";position:absolute;right:0;bottom:-12px;left:0;height:1px;background:#e72b22}

.global-site-footer{position:relative;z-index:2;margin:0;background:#050505;color:#777;border-top:1px solid rgba(255,255,255,.12);font-family:'Inter',Arial,sans-serif}
.global-site-footer__inner{width:100%;box-sizing:border-box;padding:52px clamp(28px,4.5vw,88px) 34px}
.global-site-footer__main{display:grid;grid-template-columns:minmax(190px,1fr) auto minmax(190px,1fr);align-items:center;gap:34px}
.global-site-footer__logo{display:block;width:210px;line-height:0}
.global-site-footer__logo img{display:block;width:100%;height:auto;object-fit:contain}
.global-site-footer__nav{display:flex;align-items:center;justify-content:center;gap:clamp(26px,3vw,54px);min-height:92px;padding:0 clamp(28px,3.8vw,66px);background:#090909;border-bottom:1px solid rgba(255,255,255,.16)}
.global-site-footer__nav a{color:#d5d5d2;text-decoration:none;font-size:14px;font-weight:500;letter-spacing:.01em;white-space:nowrap}
.global-site-footer__social{justify-self:end;display:flex;align-items:center;gap:16px}
.global-site-footer__social .social-icon{display:block;width:31px;height:31px;border-radius:8px;overflow:hidden;line-height:0;box-shadow:0 0 0 1px rgba(255,255,255,.16);transition:transform .2s ease,box-shadow .2s ease}
.global-site-footer__social .social-icon:hover,.global-site-footer__social .social-icon:focus-visible{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.45);color:inherit;text-shadow:none}
.global-site-footer__social svg{display:block;width:100%;height:100%}

/* Individual case studies use one continuous black gallery environment.
   The projects listing deliberately does not receive this class. */
body.case-project-page{background:#050505;color:#f5f5f2}
.case-project-page main,.case-project-page .case-hero,.case-project-page .case-gallery{background:#050505;color:#f5f5f2}
.case-project-page .case-gallery{padding-bottom:0!important;border-top:1px solid rgba(255,255,255,.1)}
.case-project-page .case-video-wrap,.case-project-page .case-grid a{background:#0a0a0a;border-color:rgba(255,255,255,.14)}
.case-project-page .case-nav-links{padding-top:30px;border-top:1px solid rgba(255,255,255,.12)}
.case-project-page .case-nav-links a{color:#d8d8d4}
.case-project-page .case-nav-links a:hover,.case-project-page .case-nav-links a:focus-visible{color:#e72b22}
.case-project-page .progress{background:#e72b22}
.case-project-picker{width:100vw;margin:34px 0 2px calc(50% - 50vw);padding:30px 0 34px;border-top:1px solid rgba(255,255,255,.12);border-bottom:1px solid rgba(255,255,255,.12);overflow:hidden;background:#050505;box-sizing:border-box}
.case-project-picker__label{margin:0 clamp(24px,5vw,88px) 25px;color:#aaa9a4;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.case-project-picker__label span{display:inline-block;margin-left:8px;color:#e72b22;font-size:15px;letter-spacing:0}
.case-project-logo-marquee{width:100%;overflow:hidden;cursor:grab;touch-action:pan-y;user-select:none;-webkit-user-select:none}
.case-project-logo-marquee.is-dragging{cursor:grabbing}
.case-project-logo-track{display:flex;width:max-content;align-items:center;gap:clamp(44px,5vw,86px);padding:13px 0;will-change:transform}
.case-project-logo-track a{display:flex;width:210px;height:54px;flex:0 0 210px;align-items:center;justify-content:center;color:inherit;text-decoration:none;opacity:.72;transition:opacity .2s ease,transform .2s ease}
.case-project-logo-track a:hover,.case-project-logo-track a:focus-visible{opacity:1;transform:scale(1.06);text-shadow:none}
.case-project-logo-track img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;pointer-events:none}
.case-project-logo-text{display:flex;align-items:baseline;gap:7px;color:#efefeb;font-size:25px;font-weight:800;letter-spacing:.08em;white-space:nowrap;pointer-events:none}.case-project-logo-text i{font-size:.5em;font-style:normal;font-weight:600;letter-spacing:.13em}
.hero-logos-track .case-project-logo-text{width:210px;justify-content:center;opacity:.62}
@media(max-width:1100px){
  .global-site-footer__main{grid-template-columns:1fr auto}.global-site-footer__nav{grid-column:1/-1;grid-row:2}.global-site-footer__social{grid-column:2;grid-row:1}
}
@media(max-width:680px){
  .global-site-footer__inner{padding:38px 20px 26px}.global-site-footer__main{display:flex;flex-direction:column;align-items:flex-start;gap:28px}
  .global-site-footer__logo{width:174px}.global-site-footer__nav{order:2;width:100%;box-sizing:border-box;display:grid;grid-template-columns:1fr 1fr;justify-content:stretch;gap:0;min-height:0;padding:10px 18px}
  .global-site-footer__nav a{padding:12px 0;font-size:13px}.global-site-footer__social{order:3;align-self:flex-start}.global-site-footer__social .social-icon{width:34px;height:34px}
}

@media(max-width:680px){
  .case-project-picker{margin-top:24px;padding:24px 0 28px}
  .case-project-picker__label{margin:0 20px 20px;font-size:10px}
  .case-project-logo-track{gap:36px;padding:10px 0}
  .case-project-logo-track a{width:168px;height:44px;flex-basis:168px}
}

@media(max-width:1040px){
  .site-nav--dark .site-nav__links{background:#090909;color:#fff}
  .site-nav--light .site-nav__links{background:#f5f3ee;color:#111}
  .projects-page .site-nav__links{background:#090909;color:#fff}
  .site-nav+.site-nav-backdrop+main>.case-hero{padding-top:98px}
  .site-nav+.site-nav-backdrop+.hero>.hero-grid{padding-top:86px}
  .site-nav+.site-nav-backdrop+main .services-path-intro.orbit-editorial{padding-top:100px}
  .site-nav+.site-nav-backdrop+main .strategy-hero .strategy-hero-copy{padding-top:126px!important}
  main>.site-nav+.site-nav-backdrop+.hero{padding-top:72px}
}

/* Responsive safety net shared by every template. Components reflow at their
   own breakpoint; these rules prevent fixed media or long copy from escaping
   their grid cells while the desktop viewport is being narrowed. */
html,body{max-width:100%;overflow-x:hidden}
*,*::before,*::after{box-sizing:border-box}
:where(main,section,article,header,footer,nav,div){min-width:0}
:where(img,video,svg,canvas,iframe){max-width:100%}
:where(h1,h2,h3,h4,p,a,span){overflow-wrap:break-word}

/* One typographic language across the whole site. Legacy <b>/<em> tags were
   previously used as decorative hooks and produced isolated heavy letters.
   Semantic <strong> remains the only inline emphasis for relevant terms. */
html,body,button,input,textarea,select{font-family:'Inter',Arial,sans-serif!important}
body b{font-weight:inherit}
body em{font-style:normal;text-decoration:none}
body strong{font-family:inherit;font-weight:700}
body :where(h1,h2,h3,h4,h5,h6,p,li,a,button,span,strong,b,em){font-family:'Inter',Arial,sans-serif!important}

/* Medical Branding always sits on a black hero, therefore every header item
   remains white; only the active-language/accent state is red. */
.medical-branding-page>.site-nav{--nav-fg:#fff!important;--nav-border:rgba(255,255,255,.16)!important;--nav-panel:#090909!important;color:#fff!important}
.medical-branding-page>.site-nav .site-nav__logo img{content:url('/assets/branding-fain-wordmark-white.webp')!important}
.medical-branding-page>.site-nav .site-nav__links,.medical-branding-page>.site-nav .site-nav__right{color:#fff!important}
.medical-branding-page>.site-nav .site-nav__links a,
.medical-branding-page>.site-nav .site-nav__languages a:not([aria-current="page"]),
.medical-branding-page>.site-nav .site-nav__languages span,
.medical-branding-page>.site-nav .site-nav__menu{color:#fff!important}
.medical-branding-page>.site-nav .site-nav__languages a[aria-current="page"]{color:#e92d24!important}
.medical-branding-page .med-hero-grid{min-height:0!important}
.medical-branding-page .med-hero-video{aspect-ratio:4/3!important}

@media(min-width:861px) and (max-width:1180px){
  .medical-branding-page .med-hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr)}
  .medical-branding-page .med-hero-content{padding:112px clamp(28px,4.5vw,54px) 72px clamp(28px,4vw,48px)}
  .medical-branding-page .med-hero-content h1{font-size:clamp(34px,4.5vw,50px)}
  .medical-branding-page .med-hero-content p{font-size:clamp(14px,1.45vw,16px)}
  .medical-branding-page .med-approach-top{gap:clamp(28px,4vw,48px)}
  .medical-branding-page .med-approach-col{padding:0 clamp(14px,2vw,24px)}
  .medical-branding-page .med-showcase-grid{gap:clamp(10px,1.5vw,18px)}
  .medical-branding-page .med-showcase-name{font-size:clamp(11px,1.15vw,13px)}
  .medical-branding-page .med-showcase-tags{font-size:clamp(10.5px,1.05vw,12.5px)}
  .medical-branding-page .med-audience-col{padding:0 clamp(10px,1.6vw,20px)}
  .medical-branding-page .med-audience-col h3{font-size:clamp(13px,1.4vw,16px)}
  .medical-branding-page .med-audience-col p{font-size:clamp(11px,1.2vw,13.5px)}
}

/* Header links use colour only: never an underline or active-page rule. */
.site-nav .site-nav__links a,
.site-nav .site-nav__languages a{border-bottom-color:transparent;text-decoration:none!important}
.site-nav .site-nav__links a::before,
.site-nav .site-nav__links a::after,
.site-nav .site-nav__languages a::before,
.site-nav .site-nav__languages a::after{display:none!important;content:none!important}
.site-nav .site-nav__links a:is(:hover,:focus-visible,:active),
.site-nav .site-nav__links a[aria-current="page"],
.site-nav .site-nav__submenu a[aria-current="page"],
.site-nav .site-nav__languages a:is(:hover,:focus-visible,:active),
.site-nav .site-nav__languages a[aria-current="page"]{color:#e92d24!important;opacity:1!important}
