/* Strela Fruit | Joomla 5 Cassiopeia child | version 1.0.6 */
:root { --sf-red:#bd0014; --sf-black:#292929; --sf-width:1120px; }
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body.sf-page { margin:0; background:#fff; color:var(--sf-black); font-family:Arial,Helvetica,sans-serif; min-width:320px; }
.sf-page img { max-width:100%; }
.sf-skip { position:absolute; top:-100px; left:10px; z-index:999; background:#fff; color:#111; padding:8px 14px; }
.sf-skip:focus { top:8px; }
/* Header: original logo at left, two-tier navigation at right. */
.sf-header { position:relative; z-index:20; background:rgba(255,255,255,.97); width:100%; }
.sf-header-inner { max-width:var(--sf-width); min-height:135px; margin:0 auto; padding:0 15px; display:flex; align-items:stretch; justify-content:space-between; gap:28px; }
.sf-brand { display:flex; align-items:center; flex:0 0 168px; text-decoration:none; }
.sf-brand img { display:block; width:160px; height:auto; max-height:130px; object-fit:contain; }
.sf-header-right { flex:1; min-width:0; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-end; }
.sf-topbar { width:100%; min-height:76px; display:flex; flex-direction:column; justify-content:flex-end; align-items:flex-end; gap:8px; padding:12px 0 6px; }
.sf-top-links, .sf-language { display:flex; justify-content:flex-end; align-items:center; }
/* Joomla mod_menu and legacy generated nav markup. */
.sf-top-links ul, .sf-main-nav ul { list-style:none; padding:0; margin:0; }
.sf-top-links ul { display:flex; justify-content:flex-end; align-items:center; gap:10px; flex-wrap:wrap; }
.sf-top-links li { margin:0; padding:0; }
.sf-top-links a { background:#b90013; border-radius:99px; color:#fff !important; display:inline-block; font-size:10px; line-height:1.35; padding:4px 12px; text-decoration:none; white-space:nowrap; }
.sf-top-links a:hover, .sf-top-links a:focus-visible { background:#8b0010; }
.sf-language img, .sf-top-links img { vertical-align:middle; }
.sf-main-nav { align-self:stretch; min-height:48px; display:flex; align-items:flex-end; justify-content:flex-end; }
.sf-main-nav > div, .sf-main-nav .mod-menu { width:100%; }
.sf-main-nav ul.mod-menu, .sf-main-nav > ul, .sf-main-nav .mod-menu > ul { display:flex; align-items:stretch; justify-content:flex-end; flex-wrap:wrap; column-gap:25px; }
.sf-main-nav li { position:relative; list-style:none; }
.sf-main-nav li > a, .sf-main-nav li > span, .sf-main-nav li > button { display:block; background:none; color:#292929; font-weight:400; text-decoration:none; padding:12px 0 10px; font-size:15px; line-height:25px; border:none; border-bottom:3px solid transparent; }
.sf-main-nav li.active > a, .sf-main-nav li.current > a, .sf-main-nav li > a:hover, .sf-main-nav li > a:focus-visible { border-bottom-color:var(--sf-red); color:var(--sf-red); }
.sf-main-nav li ul { display:none; position:absolute; z-index:50; top:100%; left:0; min-width:200px; background:white; box-shadow:0 8px 24px rgba(0,0,0,.13); padding:6px 14px; }
.sf-main-nav li:hover > ul, .sf-main-nav li:focus-within > ul { display:block; }
.sf-main-nav li ul li > a { white-space:nowrap; padding:8px 0; font-size:13px; line-height:1.5; }
/* Full-width module slots: no wrapper height, no inner margins, no parallax logic. */
.sf-main { display:block; min-height:45vh; width:100%; }
.sf-home-modules { display:flow-root; width:100%; margin:0; padding:0; max-width:none; }
.sf-home-modules > * { max-width:none; }
.sf-home-modules .moduletable { margin:0; padding:0; }
.sf-content-grid { max-width:var(--sf-width); margin:0 auto; padding:36px 15px 50px; display:grid; grid-template-columns:minmax(0,1fr); gap:32px; }
.sf-home .sf-content-grid { padding-top:0; }
.sf-content-grid.sf-with-sidebar { grid-template-columns:minmax(0,3fr) minmax(220px,1fr); }
.sf-component { min-width:0; }
.sf-footer { background:#292929; color:#f4f4f4; width:100%; }
.sf-footer-inner { max-width:var(--sf-width); margin:auto; padding:44px 15px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.sf-footer a { color:#fff; }
.sf-back-to-top { position:fixed; right:20px; bottom:20px; z-index:30; display:grid; place-items:center; width:56px; height:56px; border-radius:50%; background:#c94150; color:#fff; font-size:32px; font-weight:300; line-height:1; text-decoration:none; box-shadow:0 2px 6px rgba(0,0,0,.12); }
.sf-back-to-top:hover, .sf-back-to-top:focus { color:#fff; background:#a91024; }
/* Custom error view */
.sf-error-page { min-height:100vh; margin:0; background:#fafafa; color:var(--sf-black); font-family:Arial,Helvetica,sans-serif; }
.sf-error-header { padding:24px; text-align:center; }
.sf-error-header img { width:105px; height:auto; }
.sf-error-main { padding:4vh 24px 80px; max-width:680px; margin:0 auto; text-align:center; }
.sf-error-code { display:block; color:var(--sf-red); font-weight:800; font-size:clamp(90px,18vw,170px); line-height:1.1; letter-spacing:-.07em; }
.sf-error-main h1 { margin:10px 0 18px; font-size:clamp(25px,4vw,38px); }
.sf-error-main p { line-height:1.65; }
.sf-error-home { display:inline-block; background:var(--sf-red); color:#fff; text-decoration:none; padding:12px 26px; border-radius:4px; margin-top:24px; }
.sf-error-home:hover, .sf-error-home:focus { color:#fff; background:#8e0008; }
@media(max-width:900px) {
 .sf-header-inner { gap:18px; }
 .sf-brand { flex-basis:125px; }
 .sf-brand img { width:125px; }
 .sf-main-nav ul.mod-menu, .sf-main-nav > ul { column-gap:12px; }
 .sf-main-nav li > a { font-size:13px; }
}
@media(max-width:700px) {
 .sf-header-inner { min-height:0; padding:12px 16px 8px; flex-direction:column; align-items:stretch; gap:8px; }
 .sf-brand { flex-basis:auto; justify-content:center; }
 .sf-brand img { width:115px; max-height:none; }
 .sf-header-right { align-items:stretch; }
 .sf-topbar { min-height:0; align-items:center; padding:0; gap:9px; }
 .sf-top-links, .sf-language { justify-content:center; }
 .sf-top-links ul { justify-content:center; }
 .sf-main-nav { justify-content:center; align-items:center; overflow:visible; min-height:40px; }
 .sf-main-nav ul.mod-menu, .sf-main-nav > ul { justify-content:center; gap:5px 14px; }
 .sf-main-nav li > a { padding:7px 0; font-size:13px; }
 .sf-main-nav li ul { left:auto; right:0; }
 .sf-content-grid.sf-with-sidebar { grid-template-columns:minmax(0,1fr); }
 .sf-footer-inner { grid-template-columns:minmax(0,1fr); }
 .sf-back-to-top { width:44px; height:44px; font-size:25px; right:14px; bottom:14px; }
}

/* 1.0.2: normalize Joomla menu output for both standard and legacy layouts.
   Target only header modules; leave Aikon and content module CSS untouched. */
@media (min-width: 901px) {
  .sf-header-inner { height:135px; min-height:135px; }
  .sf-header-right { justify-content:space-between; }
  .sf-topbar { min-height:65px; }
  .sf-main-nav { min-height:47px; }
}
.sf-header .sf-top-links > div,
.sf-header .sf-top-links > nav,
.sf-header .sf-main-nav > div,
.sf-header .sf-main-nav > nav { max-width:100%; }
.sf-main-nav ul,
.sf-top-links ul { list-style:none; margin:0; padding:0; }
/* Joomla may emit .mod-menu, .mod-list, .menu, or .nav, depending on module layout. */
.sf-main-nav > ul,
.sf-main-nav > div > ul,
.sf-main-nav > nav > ul,
.sf-main-nav > div > nav > ul,
.sf-main-nav ul.mod-menu,
.sf-main-nav ul.mod-list,
.sf-main-nav ul.menu,
.sf-main-nav ul.nav,
.sf-main-nav .mod-menu > ul {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center;
  justify-content:flex-end;
  column-gap:24px;
  width:auto;
  padding:0;
  margin:0;
}
.sf-main-nav li { float:none !important; margin:0 !important; }
.sf-main-nav li > a, .sf-main-nav li > span, .sf-main-nav li > button {
  white-space:nowrap; text-align:left;
}
.sf-main-nav li ul,
.sf-main-nav li ul.mod-menu,
.sf-main-nav li ul.mod-list,
.sf-main-nav li ul.menu,
.sf-main-nav li ul.nav {
  display:none !important;
  position:absolute;
  top:100%; left:0;
  flex-direction:column !important;
  align-items:stretch;
  min-width:190px;
  width:max-content;
  max-width:min(320px, 90vw);
  background:#fff;
  padding:7px 14px;
  box-shadow:0 8px 22px rgba(0,0,0,.13);
}
.sf-main-nav li:hover > ul,
.sf-main-nav li:focus-within > ul,
.sf-main-nav li:hover > ul.mod-menu,
.sf-main-nav li:focus-within > ul.mod-menu { display:flex !important; }
.sf-top-links > ul,
.sf-top-links > div > ul,
.sf-top-links ul.mod-menu,
.sf-top-links ul.mod-list,
.sf-top-links ul.menu,
.sf-top-links ul.nav {
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:wrap !important;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}
.sf-top-links li { float:none !important; }
.sf-top-links .moduletable { margin:0; }
/* Header typography approximates original, independent of parallax module. */
.sf-main-nav li > a, .sf-main-nav li > span { font-size:15px; }
@media (max-width:900px) and (min-width:701px) {
 .sf-main-nav > ul, .sf-main-nav > div > ul, .sf-main-nav ul.mod-menu,
 .sf-main-nav ul.mod-list, .sf-main-nav ul.menu, .sf-main-nav ul.nav { column-gap:12px; }
}
@media (max-width:700px) {
 .sf-main-nav > ul, .sf-main-nav > div > ul, .sf-main-nav ul.mod-menu,
 .sf-main-nav ul.mod-list, .sf-main-nav ul.menu, .sf-main-nav ul.nav {
   justify-content:center; gap:4px 12px;
 }
 .sf-main-nav li > a, .sf-main-nav li > span { font-size:13px; }
}


/* 1.0.4 — navigation polish and sitewide link decoration policy.
   Parallax modules manage their own dimensions: no heights, min-heights,
   transforms, positioning or image scaling are assigned here. */
.sf-page a, .sf-page a:link, .sf-page a:visited,
.sf-page a:hover, .sf-page a:focus, .sf-page a:active {
  text-decoration: none !important;
  text-decoration-line: none !important;
}
.sf-main-nav li > a,
.sf-main-nav li > span,
.sf-main-nav li > button,
.sf-main-nav li.active > a,
.sf-main-nav li.current > a,
.sf-main-nav li > a:hover,
.sf-main-nav li > a:focus-visible {
  border-bottom: 0 !important;
  text-decoration: none !important;
}
.sf-main-nav li.active > a,
.sf-main-nav li.current > a,
.sf-main-nav li > a:hover,
.sf-main-nav li > a:focus-visible { color:var(--sf-red); }
.sf-main-nav li > a:focus-visible, .sf-top-links a:focus-visible {
  outline:2px solid var(--sf-red);
  outline-offset:3px;
}
/* Parent navigation arrows: CSS-only, compatible with Joomla menu classes. */
.sf-main-nav li:has(> ul) > a::after,
.sf-main-nav li:has(> ul) > span::after {
  content:"";
  display:inline-block;
  margin:0 0 2px 7px;
  border:4px solid transparent;
  border-top-color:currentColor;
  border-bottom:0;
  vertical-align:middle;
}
/* Dropdowns are independent of the main horizontal menu rules. */
.sf-main-nav li > ul,
.sf-main-nav li > ul.mod-menu,
.sf-main-nav li > ul.mod-list,
.sf-main-nav li > ul.menu,
.sf-main-nav li > ul.nav {
  min-width:190px;
  padding:5px 0;
  border:0;
  border-radius:0;
  background:#fff;
  box-shadow:0 8px 20px rgba(0,0,0,.11);
}
.sf-main-nav li > ul > li > a,
.sf-main-nav li > ul > li > span {
  display:block;
  padding:11px 14px;
  line-height:1.4;
  font-size:13px;
  color:#292929;
  border:0 !important;
  white-space:nowrap;
}
.sf-main-nav li > ul > li > a:hover,
.sf-main-nav li > ul > li > a:focus-visible,
.sf-main-nav li > ul > li.active > a {
  color:var(--sf-red);
  background:#fafafa;
}
@media (hover:none) {
  .sf-main-nav li:focus-within > ul { display:flex !important; }
}


/* 1.0.5 — hierarchical dropdown typography, spacing and subtle hover animation.
   This section only targets header menus; parallax assets and sizing remain untouched. */
@media (min-width: 701px) {
  /* First level menus: prevent inherited horizontal styles from styling descendants. */
  .sf-main-nav ul.mod-menu li > ul,
  .sf-main-nav ul.mod-list li > ul,
  .sf-main-nav ul.menu li > ul,
  .sf-main-nav ul.nav li > ul,
  .sf-main-nav li > ul {
    padding:8px 0 !important;
    min-width:225px;
    width:max-content;
    max-width:min(340px, 85vw);
    align-items:stretch !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    column-gap:0 !important;
    row-gap:0 !important;
  }
  .sf-main-nav li > ul > li {
    display:block;
    width:100%;
    flex:0 0 auto;
  }
  .sf-main-nav li > ul > li > a,
  .sf-main-nav li > ul > li > span,
  .sf-main-nav li > ul > li > button {
    display:block;
    width:100%;
    padding:13px 22px !important;
    font-size:15px !important;
    font-weight:400;
    line-height:1.45;
    letter-spacing:0;
    color:#292929;
    background:transparent;
    border:none !important;
    white-space:nowrap;
    text-decoration:none !important;
    transition:background-color .18s ease, color .18s ease, padding-left .18s ease;
  }
  .sf-main-nav li > ul > li > a:hover,
  .sf-main-nav li > ul > li > a:focus-visible,
  .sf-main-nav li > ul > li > span:hover,
  .sf-main-nav li > ul > li.active > a {
    padding-left:26px !important;
    background:#f5f5f5;
    color:var(--sf-red);
  }
  /* Nested levels open beside their parent, rather than overlapping the first level. */
  .sf-main-nav li > ul li { position:relative; }
  .sf-main-nav li > ul li > ul {
    top:-8px !important;
    left:100% !important;
    right:auto !important;
    margin:0;
    z-index:70;
  }
  .sf-main-nav li > ul li:hover > ul,
  .sf-main-nav li > ul li:focus-within > ul {
    display:flex !important;
  }
  .sf-main-nav li:hover > ul,
  .sf-main-nav li:focus-within > ul { animation:sf-menu-in .19s ease-out both; }
  .sf-main-nav > ul > li > a,
  .sf-main-nav > div > ul > li > a,
  .sf-main-nav > ul > li > span {
    transition:color .18s ease;
  }
}
@keyframes sf-menu-in {
  from { opacity:0; transform:translateY(5px); }
  to { opacity:1; transform:translateY(0); }
}
@media (prefers-reduced-motion:reduce) {
  .sf-main-nav li > ul,
  .sf-main-nav li > ul a,
  .sf-main-nav > ul > li > a { animation:none !important; transition:none !important; }
}


/* 1.0.6 — concept header: separate utility band + branded navigation.
   Parallax module styles, image sizing and module heights deliberately untouched. */
:root { --sf-red:#b90028; --sf-ease:ease; --sf-width:1180px; }
.sf-header {
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.96);
  box-shadow:0 1px 0 rgba(35,35,35,.07);
  transition:background-color .22s ease, box-shadow .22s ease;
}
.sf-header.is-scrolled {
  background:rgba(255,255,255,.96);
  box-shadow:0 6px 26px rgba(23,27,24,.09);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.sf-utility-bar {
  background:#f8f8f6; border-bottom:1px solid #ebebe8;
  max-height:65px; opacity:1; overflow:visible;
  transition:max-height .24s ease, opacity .18s ease, border-color .2s ease;
}
.sf-header.is-scrolled .sf-utility-bar { max-height:0; opacity:0; border-color:transparent; overflow:hidden; pointer-events:none; }
.sf-utility-inner {
  max-width:var(--sf-width); margin:auto; padding:0 20px;
  min-height:45px; display:flex; align-items:center; justify-content:space-between; gap:25px;
}
.sf-utility-label { font-size:10px; font-weight:700; letter-spacing:.15em; color:#898c88; white-space:nowrap; }
.sf-utility-actions { margin-left:auto; display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-end; gap:15px; }
.sf-top-links { display:flex; align-items:center; justify-content:flex-end; gap:12px; }
.sf-top-links > * { margin:0; }
.sf-top-links ul, .sf-top-links > ul, .sf-top-links ul.mod-menu, .sf-top-links ul.mod-list,
.sf-top-links ul.menu, .sf-top-links ul.nav {
  display:flex !important; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:16px;
}
.sf-top-links li { line-height:1; }
.sf-top-links a, .sf-top-links a:link, .sf-top-links a:visited {
  background:none !important; color:#555a57 !important; border-radius:0;
  padding:4px 0; font-size:11px; font-weight:600; letter-spacing:.025em;
  transition:color .2s ease;
}
.sf-top-links a:hover, .sf-top-links a:focus-visible { color:var(--sf-red) !important; }
/* If flags are output from hmenu-top, visually separate them from corporate links. */
.sf-top-links li:has(img) { border-left:1px solid #d4d4d0; padding-left:13px; }
.sf-top-links li:has(img) ~ li:has(img) { border-left:0; padding-left:0; }
.sf-top-links li:has(img) a { padding:0; }
.sf-top-links img { max-height:16px; width:auto; vertical-align:middle; }
.sf-language {
  padding-left:14px; border-left:1px solid #d4d4d0;
  min-height:22px; display:flex; align-items:center;
}
.sf-language > * { margin:0; }
.sf-language select { max-width:205px; min-height:28px; font-size:12px; border:1px solid #dededa; border-radius:4px; background:#fff; padding:2px 8px; color:#454545; }
.sf-header-inner {
  max-width:var(--sf-width); height:auto; min-height:93px; padding:10px 20px;
  display:flex; align-items:center; justify-content:space-between; gap:32px;
  transition:min-height .22s ease, padding .22s ease;
}
.sf-brand { flex:0 0 auto; min-width:0; display:flex; align-items:center; }
.sf-brand img { width:124px; height:auto; max-height:none; transition:width .22s ease; }
.sf-header.is-scrolled .sf-header-inner { min-height:68px; padding-top:7px; padding-bottom:7px; }
.sf-header.is-scrolled .sf-brand img { width:92px; }
.sf-main-nav { flex:1; width:auto; min-height:0; display:flex; align-self:center; align-items:center; justify-content:flex-end; }
.sf-main-nav > div, .sf-main-nav > nav, .sf-main-nav .mod-menu { width:auto; }
.sf-main-nav > ul, .sf-main-nav > div > ul, .sf-main-nav > nav > ul,
.sf-main-nav > div > nav > ul, .sf-main-nav ul.mod-menu, .sf-main-nav ul.mod-list,
.sf-main-nav ul.menu, .sf-main-nav ul.nav, .sf-main-nav .mod-menu > ul {
  justify-content:flex-end; column-gap:clamp(12px,2.2vw,29px);
}
.sf-main-nav li > a, .sf-main-nav li > span, .sf-main-nav li > button {
  font-size:14px; font-weight:500; padding:13px 0; line-height:1.5;
  transition:color .2s ease !important;
}
.sf-main-nav li > ul > li > a, .sf-main-nav li > ul > li > span,
.sf-main-nav li > ul > li > button { font-size:14px !important; }
.sf-main-nav li:hover > ul, .sf-main-nav li:focus-within > ul { animation:sf-menu-in .2s ease both; }
.sf-nav-toggle { display:none; appearance:none; background:none; border:1px solid #dedede; border-radius:6px; width:42px; height:40px; padding:9px; cursor:pointer; }
.sf-nav-toggle span { display:block; height:2px; margin:4px 0; background:#333; transition:transform .2s ease, opacity .2s ease; }
.sf-nav-toggle:focus-visible { outline:2px solid var(--sf-red); outline-offset:2px; }
.sf-page .sf-top-links a, .sf-page .sf-main-nav a { text-decoration:none !important; }
.sf-header .sf-topbar, .sf-header .sf-header-right { display:none; }
@media (max-width:1000px) {
  .sf-header-inner { min-height:80px; gap:15px; }
  .sf-brand img { width:104px; }
  .sf-main-nav > ul, .sf-main-nav > div > ul, .sf-main-nav ul.mod-menu,
  .sf-main-nav ul.mod-list, .sf-main-nav ul.menu, .sf-main-nav ul.nav { column-gap:12px; }
  .sf-main-nav li > a { font-size:12px; }
  .sf-utility-label { display:none; }
}
@media (max-width:760px) {
  .sf-utility-inner { padding:5px 16px; min-height:36px; }
  .sf-utility-actions { margin:0; gap:8px; width:100%; justify-content:center; }
  .sf-top-links ul, .sf-top-links ul.mod-menu, .sf-top-links ul.mod-list,
  .sf-top-links ul.menu, .sf-top-links ul.nav { gap:8px; }
  .sf-top-links a { font-size:10px; }
  .sf-top-links li:has(img) { padding-left:7px; }
  .sf-language { padding-left:8px; }
  .sf-language select { width:120px; font-size:11px; }
  .sf-header-inner { position:relative; padding:8px 16px; flex-direction:row; min-height:69px; align-items:center; }
  .sf-header.is-scrolled .sf-header-inner { min-height:60px; }
  .sf-brand img { width:90px; }
  .sf-header.is-scrolled .sf-brand img { width:77px; }
  .sf-nav-toggle { display:block; margin-left:auto; }
  .sf-main-nav { display:none; position:absolute; top:100%; left:0; right:0; width:100%; max-height:calc(100vh - 70px); overflow-y:auto;
    background:#fff; box-shadow:0 10px 18px rgba(0,0,0,.12); padding:12px 18px 22px; }
  .sf-header.nav-open .sf-main-nav { display:block; }
  .sf-main-nav > ul, .sf-main-nav > div > ul, .sf-main-nav > nav > ul,
  .sf-main-nav ul.mod-menu, .sf-main-nav ul.mod-list, .sf-main-nav ul.menu, .sf-main-nav ul.nav {
    display:flex !important; flex-direction:column !important; align-items:stretch; gap:0; width:100%;
  }
  .sf-main-nav li > a, .sf-main-nav li > span { font-size:14px; padding:10px 8px; }
  .sf-main-nav li ul, .sf-main-nav li ul.mod-menu, .sf-main-nav li ul.mod-list,
  .sf-main-nav li ul.menu, .sf-main-nav li ul.nav {
    position:static; display:none !important; box-shadow:none; padding:0 0 0 15px !important; max-width:none;
    min-width:0; width:100%; animation:none !important;
  }
  .sf-main-nav li:focus-within > ul, .sf-main-nav li:hover > ul { display:flex !important; }
  .sf-footer-inner { grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce) {
  .sf-header, .sf-utility-bar, .sf-header-inner, .sf-brand img, .sf-top-links a,
  .sf-main-nav li > a, .sf-nav-toggle span { transition:none !important; animation:none !important; }
  html { scroll-behavior:auto; }
}


/* 1.0.7 — refined concept header: larger spanning logo, lighter utility row,
   restored hover transitions and 350ms ease standard.
   Language-module duplication is not handled here; it should be resolved in module config if needed. */
:root {
  --sf-ease: ease;
  --sf-speed: .35s;
}
.sf-utility-label { display:none !important; }
.sf-utility-inner {
  justify-content:flex-end;
  min-height:42px;
  gap:18px;
}
.sf-utility-actions {
  gap:18px;
  width:100%;
}
.sf-top-links,
.sf-language { min-height:22px; }
.sf-top-links ul,
.sf-top-links > ul,
.sf-top-links ul.mod-menu,
.sf-top-links ul.mod-list,
.sf-top-links ul.menu,
.sf-top-links ul.nav {
  gap:0 !important;
}
.sf-top-links li {
  position:relative;
  display:flex;
  align-items:center;
}
.sf-top-links li:not(:first-child):not(:has(img))::before {
  content:"";
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--sf-red);
  opacity:.65;
  margin:0 14px 0 14px;
  flex:0 0 auto;
}
.sf-top-links li:has(img) {
  padding-left:12px;
  margin-left:12px;
  border-left:1px solid #d7d7d3;
}
.sf-top-links li:has(img) + li:has(img) {
  margin-left:10px;
  padding-left:0;
  border-left:0;
}
.sf-top-links a,
.sf-top-links a:link,
.sf-top-links a:visited {
  color:#545a57 !important;
  font-size:11px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  transition:color var(--sf-speed) var(--sf-ease), opacity var(--sf-speed) var(--sf-ease), transform var(--sf-speed) var(--sf-ease);
}
.sf-top-links a:hover,
.sf-top-links a:focus-visible {
  color:var(--sf-red) !important;
  opacity:1;
}
.sf-language {
  padding-left:14px;
  margin-left:2px;
}
.sf-language select {
  transition:border-color var(--sf-speed) var(--sf-ease), box-shadow var(--sf-speed) var(--sf-ease), color var(--sf-speed) var(--sf-ease);
}
.sf-language select:hover,
.sf-language select:focus {
  border-color:#c5c5c1;
  box-shadow:0 0 0 3px rgba(185,0,40,.08);
}
.sf-header-inner {
  min-height:102px;
  padding:14px 20px 12px;
  align-items:flex-end;
}
.sf-brand {
  position:relative;
  z-index:3;
  margin-top:-26px;
  margin-bottom:-4px;
}
.sf-brand img {
  width:184px;
  max-width:none;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.55));
  transition:width var(--sf-speed) var(--sf-ease), transform var(--sf-speed) var(--sf-ease), opacity var(--sf-speed) var(--sf-ease);
}
.sf-header.is-scrolled .sf-header-inner {
  min-height:74px;
  padding-top:10px;
  padding-bottom:8px;
}
.sf-header.is-scrolled .sf-brand {
  margin-top:-8px;
  margin-bottom:0;
}
.sf-header.is-scrolled .sf-brand img {
  width:138px;
}
.sf-main-nav li > a,
.sf-main-nav li > span,
.sf-main-nav li > button {
  transition:color var(--sf-speed) var(--sf-ease), opacity var(--sf-speed) var(--sf-ease), transform var(--sf-speed) var(--sf-ease) !important;
}
.sf-main-nav li > a:hover,
.sf-main-nav li > a:focus-visible,
.sf-main-nav li.active > a,
.sf-main-nav li.current > a {
  transform:translateY(-1px);
}
.sf-main-nav li > ul,
.sf-main-nav li > ul.mod-menu,
.sf-main-nav li > ul.mod-list,
.sf-main-nav li > ul.menu,
.sf-main-nav li > ul.nav {
  transition:opacity var(--sf-speed) var(--sf-ease), transform var(--sf-speed) var(--sf-ease);
}
.sf-main-nav li > ul > li > a,
.sf-main-nav li > ul > li > span,
.sf-main-nav li > ul > li > button {
  transition:background-color var(--sf-speed) var(--sf-ease), color var(--sf-speed) var(--sf-ease), padding-left var(--sf-speed) var(--sf-ease);
}
.sf-main-nav li:hover > ul,
.sf-main-nav li:focus-within > ul { animation:sf-menu-in-350 var(--sf-speed) var(--sf-ease) both !important; }
@keyframes sf-menu-in-350 {
  from { opacity:0; transform:translateY(8px); }
  to { opacity:1; transform:translateY(0); }
}
.sf-back-to-top {
  transition:background-color var(--sf-speed) var(--sf-ease), transform var(--sf-speed) var(--sf-ease), box-shadow var(--sf-speed) var(--sf-ease);
}
.sf-back-to-top:hover,
.sf-back-to-top:focus {
  transform:translateY(-2px);
}
@media (max-width:1000px) {
  .sf-brand { margin-top:-18px; }
  .sf-brand img { width:160px; }
  .sf-header.is-scrolled .sf-brand img { width:122px; }
}
@media (max-width:760px) {
  .sf-utility-inner {
    justify-content:center;
    min-height:0;
    padding-top:8px;
    padding-bottom:8px;
  }
  .sf-utility-actions {
    justify-content:center;
    gap:10px;
  }
  .sf-top-links li:not(:first-child):not(:has(img))::before {
    margin-left:9px;
    margin-right:9px;
  }
  .sf-top-links li:has(img) {
    margin-left:8px;
    padding-left:8px;
  }
  .sf-header-inner {
    min-height:78px;
    align-items:center;
  }
  .sf-brand {
    margin-top:-10px;
    margin-bottom:0;
  }
  .sf-brand img {
    width:126px;
  }
  .sf-header.is-scrolled .sf-brand img {
    width:108px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .sf-top-links a,
  .sf-language select,
  .sf-main-nav li > a,
  .sf-main-nav li > ul,
  .sf-main-nav li > ul > li > a,
  .sf-back-to-top,
  .sf-brand img { transition:none !important; animation:none !important; }
}


/* 1.0.8 — compact translucent header and stable-width dropdown hover.
   Parallax sections and Aikon heights are intentionally untouched. */
@media (min-width: 1001px) {
  .sf-header-inner {
    height:92px !important;
    min-height:92px !important;
    padding:0 20px !important;
    align-items:center;
    position:relative;
  }
  .sf-brand {
    position:absolute;
    top:-39px;
    left:20px;
    margin:0 !important;
    width:170px;
    flex:none;
    z-index:4;
  }
  .sf-brand img {
    display:block;
    width:170px !important;
    max-width:170px !important;
    height:auto;
  }
  .sf-main-nav {
    margin-left:195px;
    min-width:0;
    align-self:stretch;
    align-items:center;
  }
  .sf-header.is-scrolled .sf-header-inner {
    height:70px !important;
    min-height:70px !important;
    padding:0 20px !important;
  }
  .sf-header.is-scrolled .sf-brand {
    top:-3px;
    margin:0 !important;
  }
  .sf-header.is-scrolled .sf-brand img {
    width:96px !important;
    max-width:96px !important;
  }
}
/* 12% transparent surface over the content with blurred backdrop. */
.sf-header {
  background:rgba(255,255,255,.88) !important;
  -webkit-backdrop-filter:blur(13px);
  backdrop-filter:blur(13px);
  transition:background-color .35s ease, box-shadow .35s ease;
}
.sf-header.is-scrolled {
  background:rgba(255,255,255,.88) !important;
  -webkit-backdrop-filter:blur(13px);
  backdrop-filter:blur(13px);
}
.sf-utility-bar { background:rgba(248,248,246,.88); }
.sf-header-inner { background:transparent; }
/* Keep dropdowns white for contrast/readability; only header surface is translucent. */
.sf-main-nav li > ul {
  background:#fff;
}
/* Fix hover-induced menu width jump. The old v1.0.5 rule increased padding-left
   from 22px to 26px, which changed max-content width on long labels. */
@media (min-width:701px) {
  .sf-main-nav li > ul > li > a,
  .sf-main-nav li > ul > li > span,
  .sf-main-nav li > ul > li > button,
  .sf-main-nav li > ul > li > a:hover,
  .sf-main-nav li > ul > li > a:focus-visible,
  .sf-main-nav li > ul > li > span:hover,
  .sf-main-nav li > ul > li.active > a {
    padding-left:22px !important;
    padding-right:22px !important;
    transform:none !important;
    box-sizing:border-box;
  }
  .sf-main-nav li > ul > li > a,
  .sf-main-nav li > ul > li > span,
  .sf-main-nav li > ul > li > button {
    transition:background-color .35s ease, color .35s ease !important;
  }
  .sf-main-nav li > ul > li > a:hover,
  .sf-main-nav li > ul > li > a:focus-visible,
  .sf-main-nav li > ul > li.active > a {
    background-color:#f5f5f5;
    color:var(--sf-red);
  }
}
@media (min-width:761px) and (max-width:1000px) {
  .sf-header-inner {
    height:88px !important;
    min-height:88px !important;
    padding:0 16px !important;
    position:relative;
  }
  .sf-brand {
    position:absolute;
    top:-22px;
    left:16px;
    margin:0 !important;
  }
  .sf-brand img { width:145px !important; max-width:145px !important; }
  .sf-main-nav { margin-left:165px; }
  .sf-header.is-scrolled .sf-header-inner { min-height:66px !important; height:66px !important; }
  .sf-header.is-scrolled .sf-brand { top:-5px; }
  .sf-header.is-scrolled .sf-brand img { width:96px !important; max-width:96px !important; }
}
@media (max-width:760px) {
  .sf-header-inner {
    min-height:66px !important;
    height:auto !important;
    padding:8px 16px !important;
  }
  .sf-brand { margin:0 !important; position:relative; top:auto; }
  .sf-brand img { width:110px !important; max-width:110px !important; }
  .sf-header.is-scrolled .sf-brand img { width:92px !important; max-width:92px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .sf-header { transition:none !important; }
}


/* 1.0.9 — logo clearance, shortened utility background, uppercase navigation.
   Presentation only. No size rules are applied to Aikon modules. */
.sf-header { isolation:isolate; }
.sf-header::before {
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:2px;
  background:#b90028;
  z-index:5;
  pointer-events:none;
}
/* The secondary background begins AFTER the logo's visual zone, rather than
   occupying the full row. The top accent above remains full-width. */
.sf-utility-bar {
  position:relative;
  background:transparent !important;
  border-bottom:0 !important;
}
.sf-utility-bar::before {
  content:"";
  position:absolute;
  z-index:0;
  top:2px;
  bottom:0;
  right:0;
  left:max(280px, calc((100% - 1180px)/2 + 250px));
  background:rgba(248,248,246,.89);
  border-bottom:1px solid rgba(75,75,75,.09);
  pointer-events:none;
}
.sf-utility-inner { position:relative; z-index:1; padding-top:5px; }
.sf-main-nav, .sf-main-nav li > a, .sf-main-nav li > span, .sf-main-nav li > button {
  text-transform:uppercase;
}
.sf-header-inner {
  background:rgba(255,255,255,.86);
}
.sf-header.is-scrolled .sf-header-inner { background:rgba(255,255,255,.86); }
@media (min-width:1001px) {
  .sf-brand { top:-46px !important; }
  .sf-brand img {
    width:160px !important;
    max-width:160px !important;
  }
  .sf-header.is-scrolled .sf-brand { top:-3px !important; }
  .sf-header.is-scrolled .sf-brand img { width:96px !important; max-width:96px !important; }
}
@media (min-width:761px) and (max-width:1000px) {
  .sf-utility-bar::before { left:215px; }
  .sf-brand { top:-32px !important; }
  .sf-brand img { width:136px !important; max-width:136px !important; }
  .sf-header.is-scrolled .sf-brand { top:-5px !important; }
  .sf-header.is-scrolled .sf-brand img { width:96px !important; max-width:96px !important; }
}
@media (max-width:760px) {
  .sf-utility-bar::before { left:0; }
  .sf-header-inner, .sf-header.is-scrolled .sf-header-inner { background:rgba(255,255,255,.9); }
  .sf-brand, .sf-header.is-scrolled .sf-brand { top:auto !important; }
}


/* 1.0.10 — unify header translucency and smoothly scale sticky logo.
   Does not size or alter any Parallax modules. */
:root { --sf-header-ease: ease; --sf-header-duration:350ms; }
.sf-header {
  border-top:0 !important;
  background:rgba(255,255,255,.81) !important;
  -webkit-backdrop-filter:blur(15px) saturate(125%);
  backdrop-filter:blur(15px) saturate(125%);
  transition:background-color var(--sf-header-duration) ease, box-shadow var(--sf-header-duration) ease !important;
}
.sf-header.is-scrolled {
  background:rgba(255,255,255,.81) !important;
  -webkit-backdrop-filter:blur(15px) saturate(125%);
  backdrop-filter:blur(15px) saturate(125%);
}
/* Single translucent surface: the header container is the ONLY main-nav layer. */
.sf-header-inner,
.sf-header.is-scrolled .sf-header-inner {
  background:transparent !important;
  box-shadow:none !important;
}
.sf-header::before {
  height:5px !important;
  background:#45484a !important;
}
.sf-utility-bar::before {
  top:5px !important;
}
.sf-utility-inner { padding-top:8px; }
@media (min-width:1001px) {
  .sf-header-inner {
    height:94px !important;
    min-height:94px !important;
    padding:0 20px !important;
  }
  .sf-brand, .sf-header.is-scrolled .sf-brand {
    position:absolute;
    left:20px;
    width:146px !important;
    height:auto;
    flex:none;
    margin:0 !important;
    transform:none !important;
    transition:top var(--sf-header-duration) var(--sf-header-ease) !important;
  }
  .sf-brand { top:-30px !important; }
  .sf-header.is-scrolled .sf-brand { top:4px !important; }
  .sf-brand img,
  .sf-header.is-scrolled .sf-brand img {
    display:block;
    width:146px !important;
    max-width:146px !important;
    height:auto;
    transform-origin:top left;
    transition:transform var(--sf-header-duration) var(--sf-header-ease) !important;
    will-change:transform;
  }
  .sf-brand img { transform:scale(1) !important; }
  .sf-header.is-scrolled .sf-brand img { transform:scale(.76) !important; }
  .sf-main-nav { margin-left:175px !important; }
  .sf-header.is-scrolled .sf-header-inner {
    height:98px !important;
    min-height:98px !important;
    padding:0 20px !important;
  }
}
@media (min-width:761px) and (max-width:1000px) {
  .sf-header-inner { height:92px !important; min-height:92px !important; }
  .sf-brand, .sf-header.is-scrolled .sf-brand {
    position:absolute;
    left:16px;
    width:132px !important;
    margin:0 !important;
    transition:top var(--sf-header-duration) ease !important;
  }
  .sf-brand { top:-25px !important; }
  .sf-header.is-scrolled .sf-brand { top:6px !important; }
  .sf-brand img, .sf-header.is-scrolled .sf-brand img {
    width:132px !important;
    max-width:132px !important;
    transform-origin:top left;
    transition:transform var(--sf-header-duration) ease !important;
  }
  .sf-brand img { transform:scale(1) !important; }
  .sf-header.is-scrolled .sf-brand img { transform:scale(.78) !important; }
  .sf-main-nav { margin-left:155px !important; }
  .sf-header.is-scrolled .sf-header-inner { height:92px !important; min-height:92px !important; }
}
@media (max-width:760px) {
  .sf-header-inner, .sf-header.is-scrolled .sf-header-inner {
    background:transparent !important;
  }
  .sf-brand { transition:none !important; }
  .sf-brand img, .sf-header.is-scrolled .sf-brand img {
    transition:transform var(--sf-header-duration) ease !important;
  }
}
@media (prefers-reduced-motion:reduce) {
  .sf-brand, .sf-brand img, .sf-header, .sf-header-inner {
    transition:none !important;
  }
}


/* 1.0.11 — initial hero image may sit behind the translucent primary nav.
   Aikon owns all Parallax dimensions. The overlap changes only normal flow placement. */
@media (min-width:1001px) {
  .sf-home .sf-main { margin-top:-94px; position:relative; z-index:0; }
}
@media (min-width:761px) and (max-width:1000px) {
  .sf-home .sf-main { margin-top:-92px; position:relative; z-index:0; }
}
/* The main nav stays above the overlapping hero, the utility bar remains its own layer. */
.sf-header { z-index:100; }
.sf-header-inner { position:relative; z-index:2; }
.sf-utility-bar { z-index:3; }

/* Replace triangular CSS arrows with slender chevrons matching the back-to-top icon.
   First-level navigation points down, nested menu parents point right. */
.sf-main-nav li:has(> ul) > a::after,
.sf-main-nav li:has(> ul) > span::after {
  content:"" !important;
  display:inline-block !important;
  box-sizing:border-box;
  width:6px !important;
  height:6px !important;
  border:0 !important;
  border-right:1.6px solid currentColor !important;
  border-bottom:1.6px solid currentColor !important;
  margin:0 0 3px 9px !important;
  vertical-align:middle;
  transform:rotate(45deg);
  transition:transform 350ms ease, border-color 350ms ease;
}
.sf-main-nav li ul li:has(> ul) > a::after,
.sf-main-nav li ul li:has(> ul) > span::after {
  transform:rotate(-45deg) !important;
  margin:0 0 1px 9px !important;
}
@media (prefers-reduced-motion:reduce) {
  .sf-main-nav li:has(>ul)>a::after,
  .sf-main-nav li:has(>ul)>span::after { transition:none !important; }
}


/* 1.0.12 — increased header translucency, right-aligned nested arrows.
   Only the presentation of the header changes; Aikon remains untouched. */
.sf-header,
.sf-header.is-scrolled {
  background-color: rgba(255, 255, 255, .74) !important;
}

/* Keep dropdown dimensions stable on hover while placing nested
   chevrons at the right edge rather than alongside the menu label. */
@media (min-width: 761px) {
  .sf-main-nav li ul li:has(> ul) > a,
  .sf-main-nav li ul li:has(> ul) > span {
    display: flex !important;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding-right: 22px !important;
    min-width: 100%;
    width: 100%;
  }
  .sf-main-nav li ul li:has(> ul) > a::after,
  .sf-main-nav li ul li:has(> ul) > span::after {
    position: static !important;
    flex: 0 0 6px;
    margin: 0 0 0 auto !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sf-main-nav li ul li:has(> ul) > a::after,
  .sf-main-nav li ul li:has(> ul) > span::after {
    transition: none !important;
  }
}


/* 1.0.13 — translucent dropdowns integrated with header and hero image */
:root {
  --sf-dropdown-bg: rgba(255,255,255,.76);
  --sf-dropdown-border: rgba(255,255,255,.48);
  --sf-dropdown-shadow: 0 14px 34px rgba(27, 33, 39, .10);
}

/* Keep opened parent visibly active */
.sf-main-nav > ul > li:hover > a,
.sf-main-nav > ul > li:focus-within > a,
.sf-main-nav > ul > li:hover > span,
.sf-main-nav > ul > li:focus-within > span {
  color: var(--sf-red) !important;
}

/* Dropdowns should visually merge with the translucent header */
.sf-main-nav li > ul,
.sf-main-nav li > ul.mod-menu,
.sf-main-nav li > ul.mod-list,
.sf-main-nav li > ul.menu,
.sf-main-nav li > ul.nav,
.sf-main-nav li > ul li > ul {
  background: var(--sf-dropdown-bg) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.18);
  backdrop-filter: blur(14px) saturate(1.18);
  border: 1px solid var(--sf-dropdown-border);
  box-shadow: var(--sf-dropdown-shadow);
}

/* Slightly tighter item rhythm, still comfortable */
.sf-main-nav li > ul > li > a,
.sf-main-nav li > ul > li > span,
.sf-main-nav li > ul > li > button {
  padding-top: 11px !important;
  padding-bottom: 11px !important;
}

/* Hover states should not break the glass-like feel */
.sf-main-nav li > ul > li > a:hover,
.sf-main-nav li > ul > li > a:focus-visible,
.sf-main-nav li > ul > li > span:hover,
.sf-main-nav li > ul > li.active > a {
  background: rgba(255,255,255,.30) !important;
}


/* 1.0.14: isolated header glass layer lets nested dropdowns blur the hero independently.
   Parent backdrop filtering can create a backdrop root that prevents nested filters
   from sampling the photograph behind it (notably in WebKit/Safari). */
.sf-header,
.sf-header.is-scrolled {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.sf-header::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: rgba(255,255,255,.74);
  -webkit-backdrop-filter: blur(15px) saturate(1.18);
  backdrop-filter: blur(15px) saturate(1.18);
}
.sf-header-inner { z-index: 2; }
.sf-utility-bar { z-index: 3; }
/* Higher-strength dropdown blur and sufficiently visible hover highlight. */
.sf-main-nav li > ul,
.sf-main-nav li > ul.mod-menu,
.sf-main-nav li > ul.mod-list,
.sf-main-nav li > ul.menu,
.sf-main-nav li > ul.nav,
.sf-main-nav li > ul li > ul {
  background: rgba(255,255,255,.74) !important;
  -webkit-backdrop-filter: blur(20px) saturate(1.2) !important;
  backdrop-filter: blur(20px) saturate(1.2) !important;
}
.sf-main-nav li > ul > li > a:hover,
.sf-main-nav li > ul > li > a:focus-visible,
.sf-main-nav li > ul > li > span:hover,
.sf-main-nav li > ul > li.active > a,
.sf-main-nav li > ul > li:focus-within > a {
  background: rgba(185,0,40,.12) !important;
  color: var(--sf-red) !important;
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .sf-header::after { background:rgba(255,255,255,.88); }
  .sf-main-nav li > ul, .sf-main-nav li > ul li > ul { background:rgba(255,255,255,.93) !important; }
}


/* ===== 1.0.15: focused mobile header redesign =====
   Desktop remains unchanged; Aikon parallax retains full control of its sizes. */
.sf-mobile-language-slot, .sf-mobile-related, .sf-submenu-toggle { display:none; }
@media (max-width:760px) {
  /* Single compact header row: logo | existing FaLang selector | menu button */
  .sf-page .sf-header { background:rgba(255,255,255,.93) !important; }
  .sf-page .sf-header::after {
    background:rgba(255,255,255,.93) !important;
    -webkit-backdrop-filter:blur(12px);
    backdrop-filter:blur(12px);
  }
  .sf-page .sf-utility-bar { display:none !important; }
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    height:80px !important;
    min-height:80px !important;
    padding:8px 16px !important;
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    background:transparent !important;
    position:relative;
  }
  .sf-page .sf-brand,
  .sf-page .sf-header.is-scrolled .sf-brand {
    position:static !important;
    top:auto !important;
    left:auto !important;
    width:auto !important;
    height:auto !important;
    flex:0 0 auto;
    margin:0 !important;
    padding:0 !important;
    transform:none !important;
    transition:none !important;
    align-items:center;
  }
  .sf-page .sf-brand img,
  .sf-page .sf-header.is-scrolled .sf-brand img {
    display:block;
    width:91px !important;
    max-width:91px !important;
    max-height:68px !important;
    height:auto !important;
    transform:none !important;
    transition:none !important;
  }
  .sf-mobile-language-slot {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    margin-left:auto;
    min-width:0;
  }
  .sf-mobile-language-slot .sf-language {
    display:flex !important;
    margin:0 !important;
    padding:0 !important;
    min-height:0 !important;
    border:0 !important;
    max-width:155px;
  }
  .sf-mobile-language-slot .sf-language select {
    max-width:142px !important;
    width:auto !important;
    min-width:0;
    height:36px;
    padding:5px 6px !important;
    font-size:12px !important;
    border-radius:6px;
    background:#fff;
  }
  .sf-page .sf-nav-toggle {
    display:flex !important;
    flex-direction:column;
    justify-content:center;
    flex:0 0 42px;
    width:42px;
    height:42px;
    margin:0 !important;
    padding:9px !important;
    border:1px solid #d5d5d5;
    border-radius:7px;
    background:rgba(255,255,255,.85);
    cursor:pointer;
  }
  .sf-page .sf-nav-toggle span {
    height:2px;
    margin:3px 0;
    width:100%;
    background:#292929;
    transition:transform 350ms ease, opacity 350ms ease, background-color 350ms ease;
  }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(1) { transform:translateY(8px) rotate(45deg); }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(2) { opacity:0; }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(3) { transform:translateY(-8px) rotate(-45deg); }
  .sf-page .sf-main-nav {
    display:none !important;
    position:absolute !important;
    top:100% !important;
    left:0 !important;
    right:0 !important;
    margin:0 !important;
    width:100% !important;
    max-height:calc(100dvh - 80px);
    overflow-y:auto;
    overscroll-behavior:contain;
    background:rgba(255,255,255,.98) !important;
    box-shadow:0 14px 30px rgba(20,20,20,.13);
    padding:8px 20px 22px !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
  }
  .sf-page .sf-header.nav-open .sf-main-nav {
    display:block !important;
    animation:sf-mobile-panel-in 350ms ease both;
  }
  @keyframes sf-mobile-panel-in {
    from { opacity:0; transform:translateY(-8px); }
    to { opacity:1; transform:translateY(0); }
  }
  .sf-page .sf-main-nav > ul,
  .sf-page .sf-main-nav > div > ul,
  .sf-page .sf-main-nav > nav > ul,
  .sf-page .sf-main-nav ul.mod-menu,
  .sf-page .sf-main-nav ul.mod-list,
  .sf-page .sf-main-nav ul.menu,
  .sf-page .sf-main-nav ul.nav {
    display:flex !important;
    flex-direction:column !important;
    flex-wrap:nowrap !important;
    align-items:stretch !important;
    width:100% !important;
    gap:0 !important;
    margin:0 !important;
    padding:0 !important;
  }
  .sf-page .sf-main-nav li {
    position:relative !important;
    float:none !important;
    display:flex !important;
    flex-wrap:wrap;
    align-items:center;
    width:100% !important;
    border-bottom:1px solid #ededed;
  }
  .sf-page .sf-main-nav li > a,
  .sf-page .sf-main-nav li > span {
    flex:1 1 auto;
    width:auto !important;
    min-width:0;
    min-height:48px;
    display:flex !important;
    align-items:center;
    padding:13px 10px !important;
    font-size:14px !important;
    line-height:1.4;
    font-weight:500;
    letter-spacing:.015em;
    background:transparent !important;
    border:none !important;
    transform:none !important;
    transition:color 350ms ease !important;
  }
  .sf-page .sf-main-nav li > a:hover,
  .sf-page .sf-main-nav li > a:focus-visible,
  .sf-page .sf-main-nav li.active > a { color:var(--sf-red) !important; }
  /* Remove desktop pseudo-chevron; use a real large touch target. */
  .sf-page .sf-main-nav li:has(> ul) > a::after,
  .sf-page .sf-main-nav li:has(> ul) > span::after { content:none !important; display:none !important; }
  .sf-page .sf-main-nav li > .sf-submenu-toggle {
    display:flex !important;
    align-items:center;
    justify-content:center;
    appearance:none;
    border:none !important;
    border-left:1px solid #ededed !important;
    background:transparent !important;
    width:46px;
    height:46px;
    flex:0 0 46px;
    padding:0;
    margin:0;
    color:#454545;
    cursor:pointer;
    transition:color 350ms ease, background-color 350ms ease;
  }
  .sf-page .sf-main-nav li > .sf-submenu-toggle:hover,
  .sf-page .sf-main-nav li > .sf-submenu-toggle:focus-visible,
  .sf-page .sf-main-nav li.sf-submenu-open > .sf-submenu-toggle {
    color:var(--sf-red);
    background:rgba(185,0,40,.06) !important;
  }
  .sf-submenu-chevron {
    width:8px;
    height:8px;
    border:solid currentColor;
    border-width:0 1.7px 1.7px 0;
    transform:translateY(-2px) rotate(45deg);
    transition:transform 350ms ease;
  }
  .sf-page .sf-main-nav li.sf-submenu-open > .sf-submenu-toggle .sf-submenu-chevron {
    transform:translateY(2px) rotate(225deg);
  }
  /* All nested levels are in-flow, independent of hover/focus. */
  .sf-page .sf-main-nav li > ul,
  .sf-page .sf-main-nav li > ul.mod-menu,
  .sf-page .sf-main-nav li > ul.mod-list,
  .sf-page .sf-main-nav li > ul.menu,
  .sf-page .sf-main-nav li > ul.nav,
  .sf-page .sf-main-nav li:hover > ul,
  .sf-page .sf-main-nav li:focus-within > ul,
  .sf-page .sf-main-nav li > ul li > ul {
    position:static !important;
    display:none !important;
    top:auto !important;
    left:auto !important;
    right:auto !important;
    flex:0 0 100%;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box;
    padding:0 0 0 13px !important;
    margin:0 0 7px !important;
    background:#f6f6f5 !important;
    border:0 !important;
    border-radius:6px;
    box-shadow:none !important;
    -webkit-backdrop-filter:none !important;
    backdrop-filter:none !important;
    animation:none !important;
    transform:none !important;
  }
  .sf-page .sf-main-nav li.sf-submenu-open > ul {
    display:flex !important;
    animation:sf-mobile-accordion-in 350ms ease both !important;
  }
  @keyframes sf-mobile-accordion-in {
    from { opacity:0; transform:translateY(-5px); }
    to { opacity:1; transform:translateY(0); }
  }
  .sf-page .sf-main-nav li > ul li {
    background:transparent !important;
    border-color:#e9e9e7;
    padding:0 !important;
  }
  .sf-page .sf-main-nav li > ul li > a,
  .sf-page .sf-main-nav li > ul li > span {
    font-size:13px !important;
    white-space:normal !important;
    padding:12px 10px !important;
    min-height:46px;
  }
  .sf-page .sf-main-nav li > ul li > ul { background:#ececea !important; }
  .sf-mobile-related {
    display:block;
    padding:22px 10px 6px;
    margin-top:12px;
    border-top:1px solid #e3e3e3;
  }
  .sf-mobile-related-title {
    display:block;
    color:#777;
    font-size:10px;
    letter-spacing:.1em;
    font-weight:700;
    margin-bottom:12px;
  }
  .sf-mobile-related-links { display:flex; flex-wrap:wrap; gap:10px 18px; }
  .sf-mobile-related-links a {
    display:inline-block;
    font-size:11px;
    color:#555;
    font-weight:700;
    letter-spacing:.025em;
    text-transform:uppercase;
    padding:5px 0;
    transition:color 350ms ease;
  }
  .sf-mobile-related-links a:hover, .sf-mobile-related-links a:focus-visible { color:var(--sf-red); }
}
@media (max-width:370px) {
  .sf-page .sf-header-inner { padding-left:12px !important; padding-right:12px !important; gap:7px !important; }
  .sf-page .sf-brand img, .sf-page .sf-header.is-scrolled .sf-brand img { width:80px !important; max-width:80px !important; }
  .sf-mobile-language-slot .sf-language select { max-width:118px !important; font-size:11px !important; }
}
@media (prefers-reduced-motion:reduce) {
  .sf-page .sf-header.nav-open .sf-main-nav,
  .sf-page .sf-main-nav li.sf-submenu-open > ul,
  .sf-submenu-chevron,
  .sf-page .sf-nav-toggle span { animation:none !important; transition:none !important; }
}


/* 1.0.16 — one FaLang switcher, desktop and mobile, no duplicated module. */
@media (max-width:760px) {
  .sf-mobile-language-slot .sf-mobile-flags {
    display:flex;
    align-items:center;
    justify-content:flex-end;
    gap:12px;
    min-width:0;
  }
  .sf-mobile-language-slot .sf-mobile-flags a {
    display:inline-flex;
    align-items:center;
    gap:3px;
    flex:0 0 auto;
    padding:7px 0;
    color:#333;
    font-size:12px;
    font-weight:600;
    line-height:1.2;
    text-decoration:none;
    background:transparent !important;
    border:0 !important;
    border-radius:0;
    transition:color 350ms ease;
  }
  .sf-mobile-language-slot .sf-mobile-flags a:hover,
  .sf-mobile-language-slot .sf-mobile-flags a:focus-visible { color:var(--sf-red); }
  .sf-mobile-language-slot .sf-mobile-flags a img {
    display:inline-block;
    max-width:20px;
    width:auto;
    max-height:14px;
    height:auto;
    vertical-align:middle;
  }
}
@media (max-width:370px) {
  .sf-mobile-language-slot .sf-mobile-flags { gap:8px; }
  .sf-mobile-language-slot .sf-mobile-flags a { font-size:11px; }
}
@media (prefers-reduced-motion:reduce) {
  .sf-mobile-language-slot .sf-mobile-flags a { transition:none !important; }
}


/* 1.0.17 — isolate mobile controls from the approved desktop header. */
@media (min-width: 761px) {
  /* Earlier generic navigation-button styles overrode the hidden state. */
  .sf-page .sf-main-nav li > button.sf-submenu-toggle {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    flex: 0 0 0 !important;
  }
  .sf-page .sf-mobile-language-slot,
  .sf-page .sf-mobile-related { display: none !important; }
}
@media (max-width: 760px) {
  /* Slightly larger logo without reducing the navigation's touch targets. */
  .sf-page .sf-brand img,
  .sf-page .sf-header.is-scrolled .sf-brand img {
    width: 99px !important;
    max-width: 99px !important;
  }
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    gap: 10px !important;
  }
  /* More breathing room between FaLang and the hamburger. */
  .sf-page .sf-mobile-language-slot {
    margin-right: 12px !important;
  }
  .sf-mobile-language-slot .sf-mobile-flags { gap: 16px !important; }
  /* A slightly tighter menu without sacrificing the 44px touch target. */
  .sf-page .sf-main-nav li > a,
  .sf-page .sf-main-nav li > span {
    min-height: 46px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  .sf-page .sf-main-nav li > ul li > a,
  .sf-page .sf-main-nav li > ul li > span {
    min-height: 44px;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
  /* The expanded panel scrolls independently while the logo row stays put. */
  .sf-page .sf-main-nav {
    max-height: calc(100vh - 80px) !important;
    max-height: calc(100dvh - 80px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
}
@media (max-width: 370px) {
  .sf-page .sf-brand img,
  .sf-page .sf-header.is-scrolled .sf-brand img {
    width: 84px !important;
    max-width: 84px !important;
  }
  .sf-page .sf-mobile-language-slot { margin-right: 9px !important; }
  .sf-mobile-language-slot .sf-mobile-flags { gap: 10px !important; }
}


/* 1.0.18 — translucent mobile sticky header, without double white layers.
   Desktop and Aikon module presentation intentionally untouched. */
@media (max-width: 760px) {
  .sf-page .sf-header,
  .sf-page .sf-header.is-scrolled {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .sf-page .sf-header::after,
  .sf-page .sf-header.is-scrolled::after {
    background: rgba(255, 255, 255, .76) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.12) !important;
    backdrop-filter: blur(14px) saturate(1.12) !important;
    transition: background-color 350ms ease !important;
  }
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    background: transparent !important;
  }
  .sf-page .sf-mobile-language-slot {
    margin-right: 20px !important;
  }
}
@media (max-width: 370px) {
  .sf-page .sf-mobile-language-slot { margin-right: 13px !important; }
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  @media (max-width:760px) {
    .sf-page .sf-header::after,
    .sf-page .sf-header.is-scrolled::after {
      background:rgba(255,255,255,.88) !important;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  .sf-page .sf-header::after { transition: none !important; }
}


/* 1.0.19 — home content responsive pass, without changing Aikon module sizing.
   These rules target legacy three-column content/layouts, not parallax modules. */
@media (max-width: 760px) {
  /* Nicepage-style three-column informational content: each block gets its own row. */
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child),
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child) > .u-layout {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    gap: 0 !important;
  }
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child) > .u-layout-cell {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
    margin: 0 !important;
    padding: 22px 22px !important;
    text-align: center;
  }
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child) > .u-layout-cell + .u-layout-cell {
    border-top: 1px solid rgba(35, 35, 35, .09);
  }
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child) > .u-layout-cell :is(h1,h2,h3,h4,h5,p) {
    max-width: 100%;
    overflow-wrap: anywhere;
  }
  .sf-home-pos1 .u-layout-row:has(> .u-layout-cell:nth-child(3):last-child) > .u-layout-cell img {
    display: block;
    width: auto;
    max-width: min(145px, 46vw);
    height: auto;
    margin: 0 auto 10px;
  }
  /* Legacy informational tables with exactly three columns on the home page. */
  .sf-home-pos1 .mod-custom table:has(> tbody > tr > td:nth-child(3)) > tbody > tr {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .sf-home-pos1 .mod-custom table:has(> tbody > tr > td:nth-child(3)) > tbody > tr > td {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 18px !important;
    text-align: center;
    overflow-wrap: anywhere;
  }
  /* Product image collections in Custom modules may be narrower than the viewport. */
  .sf-home-pos2 .mod-custom img,
  .sf-home-pos1 .mod-custom img {
    max-width: 100%;
    height: auto;
  }
  .sf-home-pos2 .mod-custom :is(.u-layout-cell, .u-container-layout) {
    min-width: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .sf-home-pos1 .u-layout-row, .sf-home-pos2 .mod-custom { scroll-behavior: auto; }
}

/* 1.0.20 — clean Home-Icons Custom module.
   Class-scoped, independent from Bootstrap / legacy layout helpers. */
.sf-home .sf-features {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: stretch;
  max-width: 1180px;
  margin: 0 auto;
  padding: 22px 20px;
  background: #fafaf9;
}
.sf-home .sf-feature {
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
  padding: 18px 16px;
  color: #292929;
  text-align: center;
  text-decoration: none !important;
  transition: background-color 350ms ease, color 350ms ease;
}
.sf-home .sf-feature + .sf-feature {
  border-left: 1px solid rgba(40,40,40,.10);
}
.sf-home .sf-feature img {
  display: block;
  width: auto;
  height: 80px;
  max-width: 100%;
  object-fit: contain;
  margin: 0 0 10px;
  border: 0;
  transition: transform 350ms ease;
}
.sf-home .sf-feature h3 {
  font-size: 15px;
  font-weight: 650;
  line-height: 1.4;
  margin: 0;
  color: inherit;
  text-transform: uppercase;
}
.sf-home .sf-feature p {
  font-size: 14px;
  line-height: 1.5;
  margin: 0;
  color: #5b5b5b;
}
@media (hover: hover) {
  .sf-home .sf-feature:hover {
    background: rgba(185,0,40,.035);
    color: var(--sf-red);
  }
  .sf-home .sf-feature:hover img { transform: translateY(-3px); }
}
.sf-home .sf-feature:focus-visible {
  outline: 2px solid var(--sf-red);
  outline-offset: -2px;
}
@media (max-width: 760px) {
  .sf-home .sf-features {
    grid-template-columns: minmax(0,1fr);
    padding: 8px 18px;
  }
  .sf-home .sf-feature {
    padding: 20px 12px;
  }
  .sf-home .sf-feature + .sf-feature {
    border-left: 0;
    border-top: 1px solid rgba(40,40,40,.10);
  }
  .sf-home .sf-feature img { height: 76px; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-home .sf-feature,
  .sf-home .sf-feature img { transition: none !important; }
}


/* 1.0.21 — Strela Fruit feature cards (clean Custom HTML only).
   Visible editorial layout and staggered entrance; no Aikon/module sizing changes. */
.sf-home .sf-home-pos1 .sf-features {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(12px,2vw,24px);
  width:min(100% - 32px,1160px);
  max-width:1160px;
  padding:clamp(26px,3.5vw,44px) 0;
  background:transparent;
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature {
  position:relative;
  isolation:isolate;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  min-height:220px;
  gap:9px;
  padding:28px 22px;
  border:1px solid rgba(40,40,40,.075);
  border-radius:10px;
  background:linear-gradient(155deg,#fff 0%,#f7f7f5 100%);
  box-shadow:0 4px 18px rgba(24,29,32,.035);
  text-align:center;
  color:#303033;
  text-decoration:none !important;
  transform:translateY(0);
  transition:background-color 350ms ease,border-color 350ms ease,color 350ms ease,
             box-shadow 350ms ease,transform 350ms ease;
  animation:sf-feature-enter 650ms ease both;
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature + .sf-feature {
  border-left:1px solid rgba(40,40,40,.075);
}
.sf-home .sf-home-pos1 .sf-feature:nth-child(2) {animation-delay:110ms;}
.sf-home .sf-home-pos1 .sf-feature:nth-child(3) {animation-delay:220ms;}
@keyframes sf-feature-enter {
  from {opacity:0;transform:translateY(17px);}
  to {opacity:1;transform:translateY(0);}
}
.sf-home .sf-home-pos1 .sf-feature img {
  display:block;
  height:76px;
  width:auto;
  max-width:100%;
  object-fit:contain;
  margin:0 0 8px;
  filter:grayscale(1);
  transition:transform 350ms ease,filter 350ms ease;
}
.sf-home .sf-home-pos1 .sf-feature h3 {
  margin:0;
  font-size:clamp(14px,1.15vw,17px);
  line-height:1.4;
  font-weight:700;
  letter-spacing:.035em;
  color:inherit;
}
.sf-home .sf-home-pos1 .sf-feature p {
  margin:0;
  font-size:clamp(14px,1.1vw,16px);
  line-height:1.45;
  color:#646568;
}
.sf-home .sf-home-pos1 .sf-feature::after {
  content:"";
  position:absolute;
  bottom:0;
  left:50%;
  width:0;
  height:3px;
  transform:translateX(-50%);
  border-radius:3px 3px 0 0;
  background:var(--sf-red,#b90028);
  transition:width 350ms ease;
}
@media (hover:hover) {
 .sf-home .sf-home-pos1 .sf-feature:hover {
   transform:translateY(-5px);
   color:var(--sf-red,#b90028);
   border-color:rgba(185,0,40,.18);
   background:#fff;
   box-shadow:0 14px 36px rgba(24,29,32,.09);
 }
 .sf-home .sf-home-pos1 .sf-feature:hover::after {width:42%;}
 .sf-home .sf-home-pos1 .sf-feature:hover img {transform:translateY(-3px);filter:grayscale(.25);}
}
.sf-home .sf-home-pos1 .sf-feature:focus-visible {
  outline:2px solid var(--sf-red,#b90028);
  outline-offset:3px;
}
@media (max-width:760px) {
 .sf-home .sf-home-pos1 .sf-features {
   grid-template-columns:minmax(0,1fr);
   width:min(100% - 32px,480px);
   gap:12px;
   padding:22px 0;
 }
 .sf-home .sf-home-pos1 .sf-features > .sf-feature {
   min-height:165px;
   padding:20px 16px;
 }
 .sf-home .sf-home-pos1 .sf-feature img {height:64px;margin-bottom:4px;}
 .sf-home .sf-home-pos1 .sf-feature h3 {font-size:15px;}
}
@media (prefers-reduced-motion:reduce) {
 .sf-home .sf-home-pos1 .sf-feature,
 .sf-home .sf-home-pos1 .sf-feature img,
 .sf-home .sf-home-pos1 .sf-feature::after {
   animation:none !important;
   transition:none !important;
 }
}

/* 1.0.22 — features emerge from a clean white surface.
   No default cards/borders/shadows. Interaction = elevation + shadow only. */
.sf-home .sf-home-pos1 .sf-features > .sf-feature,
.sf-home .sf-home-pos1 .sf-features > .sf-feature + .sf-feature {
  border: 0 !important;
  border-radius: 10px;
  background: transparent !important;
  box-shadow: none;
  animation-fill-mode: backwards;
  transition: transform 350ms ease, box-shadow 350ms ease;
}
.sf-home .sf-home-pos1 .sf-feature::after { content: none !important; }
@media (hover: hover) {
  .sf-home .sf-home-pos1 .sf-features > .sf-feature:hover {
    transform: translateY(-6px);
    background: transparent !important;
    box-shadow: 0 15px 34px rgba(30, 32, 36, .13);
  }
  /* Preserve existing subtle icon lift, but no additional text recoloring. */
  .sf-home .sf-home-pos1 .sf-feature:hover { color: #303033; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-home .sf-home-pos1 .sf-feature { animation: none !important; transition: none !important; }
}

/* 1.0.23 — hairline separators between clean feature blocks.
   No card borders; hover elevation and staggered entrance remain unchanged. */
@media (min-width: 761px) {
  .sf-home .sf-home-pos1 .sf-features {
    --sf-feature-gap: clamp(12px, 2vw, 24px);
    gap: var(--sf-feature-gap);
  }
  .sf-home .sf-home-pos1 .sf-features > .sf-feature:nth-child(n+2)::before {
    content: "";
    position: absolute;
    left: calc(var(--sf-feature-gap) / -2);
    top: 18%;
    height: 64%;
    width: 1px;
    background: rgba(52, 58, 64, .135);
    pointer-events: none;
  }
}
@media (max-width: 760px) {
  .sf-home .sf-home-pos1 .sf-features > .sf-feature::before { content: none !important; }
}


/* 1.0.23 — entrance animation starts when cards enter the viewport,
   not during initial page load. Existing hover animations stay intact. */
.sf-home .sf-home-pos1 .sf-features > .sf-feature {
  animation: none !important; /* replace initial-load keyframes from 1.0.21 */
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature.sf-feature-reveal-pending {
  opacity: 0;
  transform: translateY(19px);
  transition: opacity 650ms ease, transform 650ms ease, box-shadow 350ms ease;
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature.sf-feature-reveal-pending.sf-feature-reveal-in {
  opacity: 1;
  transform: translateY(0);
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature:nth-child(2).sf-feature-reveal-pending {
  transition-delay: 110ms, 110ms, 0ms;
}
.sf-home .sf-home-pos1 .sf-features > .sf-feature:nth-child(3).sf-feature-reveal-pending {
  transition-delay: 220ms, 220ms, 0ms;
}
@media (prefers-reduced-motion: reduce) {
  .sf-home .sf-home-pos1 .sf-features > .sf-feature.sf-feature-reveal-pending {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* 1.0.25: Main article now precedes homepage-pos2, preserving module ordering and module-defined parallax dimensions. */
.sf-home .sf-content-grid { padding-top: 32px; padding-bottom: 32px; }
@media(max-width:760px){ .sf-home .sf-content-grid { padding-top: 24px; padding-bottom: 26px; } }


/* 1.0.26 — modern homepage Leading Article + three Intro Articles.
   Only homepage category/featured blog elements are affected. */
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) {
  width:100%;
  max-width:1140px;
  margin-inline:auto;
}
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) .items-leading {
  display:block !important;
  margin:0;
}
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) .items-leading > .blog-item {
  display:block;
  width:100%;
}
.sf-home .sf-product-leading {
  display:grid;
  grid-template-columns:minmax(0,48%) minmax(0,52%);
  align-items:center;
  gap:clamp(20px,3.6vw,54px);
  min-height:450px;
  padding:30px 2% 54px 0;
}
.sf-home .sf-product-leading .sf-product-media {
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sf-home .sf-product-media .item-image,
.sf-home .sf-product-media figure {
  float:none !important;
  margin:0 !important;
  width:100%;
  max-width:none;
  text-align:center;
}
.sf-home .sf-product-leading .sf-product-media img {
  width:100%;
  max-height:490px;
  height:auto;
  object-fit:contain;
  display:block;
  margin:auto;
}
.sf-home .sf-product-copy {min-width:0;}
.sf-home .sf-product-title {
  font-family:inherit;
  font-weight:450;
  text-transform:none;
  letter-spacing:-.025em;
  line-height:1.18;
  margin:0 0 24px;
  color:#25272a;
}
.sf-home .sf-product-leading .sf-product-title {
  font-size:clamp(30px,3.1vw,43px);
}
.sf-home .sf-product-body {
  color:#515357;
  font-size:16px;
  line-height:1.75;
  overflow-wrap:break-word;
}
.sf-home .sf-product-body p { margin:0 0 1em; }
.sf-home .sf-product-leading .sf-product-body {max-width:530px;}
.sf-home .sf-product-leading .sf-product-body img {
  max-width:180px;
  height:auto;
  float:none !important;
  margin:10px 0 0 auto !important;
  display:block;
}
.sf-home .sf-product-link {
  display:inline-flex;
  align-items:center;
  gap:12px;
  margin-top:16px;
  padding:4px 0 7px;
  color:var(--sf-red) !important;
  font-size:13px;
  font-weight:700;
  letter-spacing:.045em;
  text-transform:uppercase;
  text-decoration:none !important;
  transition:color 350ms ease, gap 350ms ease;
}
.sf-home .sf-product-link:hover,
.sf-home .sf-product-link:focus-visible {color:#910014 !important;gap:17px;}
.sf-home .sf-product-link:focus-visible {outline:2px solid var(--sf-red);outline-offset:4px;}
.sf-home .sf-product-link span:last-child {font-size:19px;line-height:1;}

/* Intro cards: Joomla still owns item count and ordering. */
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) .blog-items:not(.items-leading) {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  align-items:start;
  gap:clamp(18px,2.2vw,32px);
  margin:15px 0 54px;
}
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) .blog-items:not(.items-leading) > .blog-item {
  display:block !important;
  margin:0 !important;
  width:auto !important;
  max-width:none !important;
  break-inside:avoid;
}
.sf-home .sf-product-intro {min-width:0;}
.sf-home .sf-product-intro .sf-product-media {
  overflow:hidden;
  background:#fafaf9;
  border-radius:3px;
}
.sf-home .sf-product-intro .sf-product-media > a {display:block;text-decoration:none;}
.sf-home .sf-product-intro .sf-product-media img {
  display:block;
  width:100%;
  height:205px;
  object-fit:contain;
  padding:15px;
  transition:transform 350ms ease;
}
@media (hover:hover) {
  .sf-home .sf-product-intro:hover .sf-product-media img {transform:scale(1.035);}
}
.sf-home .sf-product-intro .sf-product-copy {padding:17px 1px 6px;}
.sf-home .sf-product-intro .sf-product-title {
  font-size:clamp(19px,1.7vw,24px);
  margin:0 0 10px;
  font-weight:550;
}
.sf-home .sf-product-intro .sf-product-title a {color:inherit !important;text-decoration:none !important;transition:color 350ms ease;}
.sf-home .sf-product-intro .sf-product-title a:hover {color:var(--sf-red) !important;}
.sf-home .sf-product-intro .sf-product-body {
  font-size:14px;
  line-height:1.6;
  max-height:6.4em;
  overflow:hidden;
}
.sf-home .sf-product-intro .sf-product-body img {display:none;}
.sf-home .sf-product-intro .sf-product-link {margin-top:10px;font-size:12px;}

@media (max-width:850px) {
  .sf-home .sf-product-leading {grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;min-height:0;}
  .sf-home .sf-product-leading .sf-product-title {font-size:clamp(25px,3vw,34px);}
  .sf-home .sf-product-intro .sf-product-media img {height:165px;}
}
@media (max-width:760px) {
  .sf-home .sf-product-leading {grid-template-columns:minmax(0,1fr);gap:10px;padding:0 3px 36px;}
  .sf-home .sf-product-leading .sf-product-media img {max-height:335px;}
  .sf-home .sf-product-leading .sf-product-title {font-size:clamp(27px,7vw,34px);margin-bottom:16px;}
  .sf-home .sf-product-body {font-size:15px;line-height:1.7;}
  .sf-home .sf-product-leading .sf-product-body img {max-width:135px;}
  .sf-home .sf-component :is(.com-content-category-blog,.blog-featured):has(.sf-product) .blog-items:not(.items-leading) {
    grid-template-columns:minmax(0,1fr) !important;
    gap:29px;
    margin:8px 0 35px;
  }
  .sf-home .sf-product-intro .sf-product-media img {height:220px;}
}

/* IntersectionObserver adds classes only when JS is available; content is visible by default. */
.sf-home .sf-product.sf-product-reveal-pending {opacity:0;transform:translateY(22px);}
.sf-home .sf-product.sf-product-reveal-in {
  opacity:1;
  transform:none;
  transition:opacity 700ms ease, transform 700ms ease;
}
@media(prefers-reduced-motion:reduce){
  .sf-home .sf-product, .sf-home .sf-product.sf-product-reveal-in,
  .sf-home .sf-product-intro .sf-product-media img {opacity:1 !important;transform:none !important;transition:none !important;}
}

/* 1.0.27 — editorial product layout: open, borderless imagery and tighter rhythm.
   Scoped to the homepage com_content blog only; Aikon and other pages unaffected. */
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product) {
  max-width: 1120px;
}
.sf-home .sf-product-leading {
  min-height: 0;
  gap: clamp(24px, 4vw, 56px);
  padding: 6px 1% 20px 0;
}
.sf-home .sf-product-leading .sf-product-media img {
  max-height: 395px;
}
.sf-home .sf-product-leading .sf-product-title {
  margin-bottom: 16px;
}
.sf-home .sf-product-leading .sf-product-body {
  line-height: 1.65;
}
.sf-home .sf-product-leading .sf-product-link {
  margin-top: 6px;
}
/* Header/label for any number of intro articles. Remains part of the Joomla blog grid. */
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
  .blog-items:not(.items-leading)::before {
  content: 'MORE PRODUCTS';
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 18px;
  color: #777b7d;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.5;
  margin: 0 0 3px;
}
html[lang^="sr"] .sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
  .blog-items:not(.items-leading)::before {
  content: 'OSTALI PROIZVODI';
}
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
  .blog-items:not(.items-leading) {
  gap: clamp(18px, 2.2vw, 32px);
  margin: 8px 0 32px;
}
.sf-home .sf-product-intro .sf-product-media {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  overflow: visible;
}
.sf-home .sf-product-intro .sf-product-media .item-image,
.sf-home .sf-product-intro .sf-product-media figure {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.sf-home .sf-product-intro .sf-product-media img {
  height: 182px;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  object-fit: contain;
  transform-origin: 50% 55%;
  transition: transform 350ms ease, filter 350ms ease;
}
.sf-home .sf-product-intro .sf-product-copy {
  padding: 10px 0 2px;
}
.sf-home .sf-product-intro .sf-product-title {
  margin-bottom: 7px;
  font-size: clamp(18px, 1.6vw, 22px);
}
.sf-home .sf-product-intro .sf-product-body {
  max-height: 4.8em;
  line-height: 1.6;
  color: #62666a;
}
.sf-home .sf-product-intro .sf-product-link {
  margin-top: 6px;
}
@media (hover: hover) {
  .sf-home .sf-product-intro:hover .sf-product-media img {
    transform: translateY(-5px) scale(1.02);
    filter: none;
  }
}
@media (max-width: 850px) {
  .sf-home .sf-product-leading .sf-product-media img {max-height: 330px;}
  .sf-home .sf-product-intro .sf-product-media img {height: 160px;}
}
@media (max-width: 760px) {
  .sf-home .sf-product-leading {padding: 0 3px 19px; gap: 8px;}
  .sf-home .sf-product-leading .sf-product-media img {max-height: 290px;}
  .sf-home .sf-component :is(.com-content-category-blog,.blog-featured):has(.sf-product)
    .blog-items:not(.items-leading) {gap: 21px; margin: 5px 0 28px;}
  .sf-home .sf-product-intro .sf-product-media img {height: 180px;}
  .sf-home .sf-product-intro .sf-product-copy {padding-top: 8px;}
}

/* 1.0.28 — full-bleed, softly tinted background for the Home-Icons module only.
   The content remains centered at its current max-width. Do not touch Aikon
   modules or the separate Joomla blog section. */
.sf-home .sf-home-pos1 .sf-features {
  position: relative;
  isolation: isolate;
  background: transparent !important;
}
.sf-home .sf-home-pos1 .sf-features::before {
  content: "";
  position: absolute;
  inset-block: 0;
  left: 50%;
  width: 100vw;
  transform: translateX(-50%);
  background-color: #f5f5f3;
  z-index: -1;
  pointer-events: none;
}

/* 1.0.29 — visual hierarchy within homepage Joomla products.
   Keep Home-Icons, Aikon and production modules untouched. */
.sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
  .blog-items:not(.items-leading)::before {
  /* Reserve a clear label zone and draw a restrained rule to its right. */
  background-image: linear-gradient(to right,
    transparent 0,
    transparent 162px,
    rgba(35, 40, 42, .16) 162px,
    rgba(35, 40, 42, .16) 100%);
  background-size: 100% 1px;
  background-repeat: no-repeat;
  background-position: center;
}
html[lang^="sr"] .sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
  .blog-items:not(.items-leading)::before {
  background-image: linear-gradient(to right,
    transparent 0,
    transparent 175px,
    rgba(35, 40, 42, .16) 175px,
    rgba(35, 40, 42, .16) 100%);
}
/* 1.0.30 — intro cards: no hover shadow, keep lift only; slightly clearer vertical dividers. */

/* 1.0.31 — reliably visible separators on the actual Joomla intro grid items,
   plus consistent short previews; no shadows on image hover. */
@media (min-width: 761px) {
  .sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
    .blog-items:not(.items-leading) > .blog-item:not(:first-of-type) {
    border-left: 1px solid rgba(35, 40, 42, .16) !important;
    padding-left: clamp(12px, 1.5vw, 20px) !important;
  }
}
@media (max-width: 760px) {
  .sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
    .blog-items:not(.items-leading) > .blog-item:not(:first-of-type) {
    border-left: 0 !important;
    padding-left: 0 !important;
    border-top: 1px solid rgba(35, 40, 42, .11);
    padding-top: 18px;
  }
}
.sf-home .sf-product-intro .sf-product-excerpt {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
  max-height: none;
  margin: 0;
}
@media (hover: hover) {
  .sf-home .sf-product-intro:hover .sf-product-media img {
    filter: none !important;
    box-shadow: none !important;
  }
}


/* 1.0.32 — PRODUCTION custom module: independently styled,
   no effects on Aikon in the same module position. */
.sf-home .sf-home-pos2 .sf-production {
  position: relative;
  isolation: isolate;
  width: 100%;
  padding: clamp(34px, 4vw, 56px) 18px clamp(40px, 5vw, 64px);
}
.sf-home .sf-home-pos2 .sf-production::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset-block: 0;
  width: 100vw;
  left: 50%;
  transform: translateX(-50%);
  background: #f6f6f5;
  pointer-events: none;
}
.sf-home .sf-home-pos2 .sf-production-inner {
  width: min(100%, 1130px);
  margin-inline: auto;
}
.sf-home .sf-home-pos2 .sf-production-heading {
  display: flex;
  align-items: center;
  gap: 24px;
  margin-bottom: clamp(22px, 3vw, 32px);
}
.sf-home .sf-home-pos2 .sf-production-heading h2 {
  margin: 0;
  color: #343538;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .13em;
}
.sf-home .sf-home-pos2 .sf-production-rule {
  flex: 1;
  height: 1px;
  background: rgba(35,40,42,.14);
}
.sf-home .sf-home-pos2 .sf-production-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: clamp(12px, 2vw, 26px);
  align-items: center;
}
.sf-home .sf-home-pos2 .sf-production-item {
  display: block;
  min-width: 0;
  padding: 0;
  text-decoration: none !important;
  border: 0;
  background: transparent;
  transition: transform 350ms ease;
}
.sf-home .sf-home-pos2 .sf-production-item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  object-fit: contain;
  border: 0 !important;
  box-shadow: none !important;
  background: transparent;
  transition: transform 350ms ease;
}
@media (hover: hover) {
  .sf-home .sf-home-pos2 .sf-production-item:hover {
    transform: translateY(-5px);
  }
}
.sf-home .sf-home-pos2 .sf-production-item:focus-visible {
  outline: 2px solid #bc0028;
  outline-offset: 5px;
}
@media (max-width: 760px) {
  .sf-home .sf-home-pos2 .sf-production {
    padding: 30px 18px 38px;
  }
  .sf-home .sf-home-pos2 .sf-production-grid {
    grid-template-columns: minmax(0,1fr);
    gap: 20px;
  }
  .sf-home .sf-home-pos2 .sf-production-item {
    max-width: 460px;
    width: 100%;
    margin-inline: auto;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sf-home .sf-home-pos2 .sf-production-item,
  .sf-home .sf-home-pos2 .sf-production-item img {
    transition: none !important;
  }
}

/* 1.0.33 — targeted correction for the final Aikon Easy Parallax (module 117).
   Confirmed in Safari Inspector: cover + centered background eliminates the
   uncovered area at taller viewport heights. Preserve module-controlled height
   and fixed background behavior; leave other parallax modules untouched. */
.sf-home #aikon_paralax_117 {
  background-size: cover !important;
  background-position: center center !important;
}

/* 1.0.34 — footer: three contact columns and a full-width copyright row. */
.sf-footer {
  background: #252628;
  color: #e8e9ea;
}
.sf-footer-inner {
  padding-top: clamp(42px, 5vw, 66px);
  padding-bottom: clamp(38px, 4vw, 54px);
  gap: clamp(24px, 4vw, 62px);
}
.sf-footer .sf-footer-column { min-width: 0; }
.sf-footer .sf-footer-panel { margin: 0; }
.sf-footer .sf-footer-label {
  color: #aeb0b3;
  font-size: 12px;
  font-weight: 500;
  margin: 0 0 8px;
}
.sf-footer .sf-footer-data {
  color: #f2f2f3;
  font-size: 14px;
  line-height: 1.65;
  font-weight: 500;
  margin: 0;
}
.sf-footer .sf-footer-entry + .sf-footer-entry { margin-top: 24px; }
.sf-footer .sf-footer-data a {
  color: inherit;
  text-decoration: none !important;
  overflow-wrap: anywhere;
  transition: color 350ms ease;
}
.sf-footer .sf-footer-data a:hover,
.sf-footer .sf-footer-data a:focus-visible { color: #f18d99; }
.sf-footer .sf-footer-certifications {
  color: #e5e6e7;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.7;
  margin: 0;
}
.sf-footer .sf-footer-bottom {
  width: 100%;
  background: #202123;
  border-top: 1px solid rgba(255,255,255,.10);
}
.sf-footer .sf-footer-bottom-inner {
  max-width: var(--sf-width);
  padding: 18px 15px 19px;
  margin: 0 auto;
}
.sf-footer .sf-footer-copyright {
  margin: 0;
  color: #aeb0b3;
  font-size: 12px;
  line-height: 1.6;
  letter-spacing: .01em;
}
@media (max-width: 760px) {
  .sf-footer-inner {gap: 28px; padding-block: 38px;}
  .sf-footer .sf-footer-entry + .sf-footer-entry {margin-top: 17px;}
  .sf-footer .sf-footer-bottom-inner {padding: 17px 16px;}
}
@media (prefers-reduced-motion: reduce) {
  .sf-footer .sf-footer-data a { transition: none !important; }
}

/* 1.0.35 — footer refinement and updated back-to-top button.
   - darker footer tones
   - vertical separators between the three footer columns
   - chevron-style back-to-top icon with JS-assisted smooth scroll */
.sf-footer {
  background: #1f2023;
  color: #e6e7e8;
}
.sf-footer .sf-footer-column {
  min-width: 0;
  position: relative;
}
@media (min-width: 761px) {
  .sf-footer-inner {
    gap: clamp(26px, 3.5vw, 54px);
  }
  .sf-footer .sf-footer-column + .sf-footer-column {
    border-left: 1px solid rgba(255,255,255,.09);
    padding-left: clamp(22px, 2.2vw, 34px);
  }
}
.sf-footer .sf-footer-label { color: #a9acb0; }
.sf-footer .sf-footer-data { color: #f1f2f2; }
.sf-footer .sf-footer-certifications { color: #eaebec; }
.sf-footer .sf-footer-bottom {
  background: #18191c;
  border-top: 1px solid rgba(255,255,255,.08);
}
.sf-footer .sf-footer-copyright { color: #a1a4a8; }

.sf-back-to-top {
  background: #c40b1b;
  color: #fff;
  font-size: 0;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}
.sf-back-to-top:hover,
.sf-back-to-top:focus-visible {
  background: #a30012;
  color: #fff;
}
.sf-back-to-top svg {
  display: block;
  width: 18px;
  height: 18px;
}
.sf-back-to-top svg path,
.sf-back-to-top svg polyline {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}
@media (max-width: 760px) {
  .sf-footer .sf-footer-column + .sf-footer-column {
    border-left: 0;
    padding-left: 0;
  }
}


/* 1.0.36 DEV — mobile-only homepage spacing pass.
   No changes to desktop, header or Aikon parallax geometry. */
@media (max-width: 760px) {
  /* Feature module: keep three clean items, but avoid long vertical gaps. */
  .sf-home .sf-home-pos1 .sf-features {
    width: min(100% - 32px, 480px);
    gap: 0;
    padding-block: 17px;
  }
  .sf-home .sf-home-pos1 .sf-features > .sf-feature {
    min-height: 0;
    padding: 19px 14px 20px;
    gap: 5px;
  }
  .sf-home .sf-home-pos1 .sf-feature img {
    height: 62px;
    margin-bottom: 5px;
  }
  .sf-home .sf-home-pos1 .sf-features > .sf-feature + .sf-feature::before {
    content: "" !important;
    display: block;
    position: absolute;
    top: 0;
    left: 16%;
    height: 1px;
    width: 68%;
    background: rgba(52, 58, 64, .16);
    pointer-events: none;
  }
  /* Intro cards: modestly tighter rhythm, without changing image proportions. */
  .sf-home .sf-product-leading {padding-bottom: 14px; gap: 6px;}
  .sf-home .sf-product-leading .sf-product-title {margin-bottom: 12px;}
  .sf-home .sf-component :is(.com-content-category-blog, .blog-featured):has(.sf-product)
    .blog-items:not(.items-leading) {gap: 16px; margin-bottom: 24px;}
  .sf-home .sf-product-intro .sf-product-copy {padding-top: 5px;}
  .sf-home .sf-product-intro .sf-product-title {margin-bottom: 6px;}
  .sf-home .sf-product-intro .sf-product-link {margin-top: 4px;}
  /* Machine banners: keep Aikon section separate and module-height untouched. */
  .sf-home .sf-home-pos2 .sf-production {padding-block: 26px 31px;}
  .sf-home .sf-home-pos2 .sf-production-heading {margin-bottom: 18px;}
  .sf-home .sf-home-pos2 .sf-production-grid {gap: 13px;}
  /* Footer: labels/data stay readable, but the tall empty gaps are reduced. */
  .sf-footer-inner {gap: 21px; padding-block: 29px 32px;}
  .sf-footer .sf-footer-entry + .sf-footer-entry {margin-top: 14px;}
  .sf-footer .sf-footer-label {margin-bottom: 5px;}
  .sf-footer .sf-footer-bottom-inner {padding-block: 15px;}
  /* EN/SR module contents may still contain old inline green spans. */
  .sf-footer .sf-footer-certifications,
  .sf-footer .sf-footer-certifications span,
  .sf-footer .sf-footer-certifications strong,
  .sf-footer .sf-footer-certifications a {
    color: #eaebec !important;
  }
  /* Back to top: reduce overlap with mobile text and preserve tap area. */
  .sf-back-to-top {
    width: 42px;
    height: 42px;
    right: 12px;
    bottom: max(14px, env(safe-area-inset-bottom, 0px));
  }
  .sf-back-to-top svg {width: 17px; height: 17px;}
}

/* 1.0.37 — Optional inner product article layout; no effect on blog/home/other articles. */
.sf-inner-page .sf-component:has(.sf-product-detail) { min-width: 0; }
.sf-inner-page .sf-content-grid:has(.sf-product-detail) {
  max-width: 1200px;
  padding-top: clamp(36px, 5vw, 70px);
  padding-bottom: clamp(55px, 6vw, 95px);
}
.sf-product-detail-header {
  margin-bottom: clamp(28px, 4vw, 52px);
}
.sf-product-detail-category {
  margin: 0 0 10px;
  color: #777b80;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.sf-product-detail-header h1 {
  max-width: 980px;
  margin: 0 0 16px;
  font-size: clamp(28px, 3.2vw, 43px);
  line-height: 1.15;
  font-weight: 500;
  letter-spacing: -.025em;
  color: #292b2e;
  text-transform: uppercase;
}
.sf-product-detail-accent {
  display: block;
  width: 52px;
  height: 3px;
  background: #b90025;
}
.sf-product-detail-grid {
  display: grid;
  grid-template-columns: minmax(0,1fr) minmax(0,1fr);
  align-items: start;
  gap: clamp(28px, 5vw, 72px);
}
.sf-product-detail-grid.sf-product-detail-no-image {
  grid-template-columns: 1fr;
}
.sf-product-detail-visual {
  margin: 0;
  min-width: 0;
  align-self: start;
}
.sf-product-detail-visual > img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: contain;
  max-height: 540px;
  border: 0;
}
.sf-product-detail-visual figcaption {
  margin-top: 10px;
  color: #73777a;
  font-size: 12px;
}
.sf-product-detail-copy {
  min-width: 0;
  color: #33363a;
  font-size: 16px;
  line-height: 1.8;
}
.sf-product-detail-copy p { margin: 0 0 1.3em; }
.sf-product-detail-copy p:empty { display:none; }
.sf-product-detail-copy img,
.sf-product-detail-copy img.u-image {
  max-width: 100%;
  height: auto;
  border: 0;
}
/* Respect the existing in-article Featherlight link, but neutralize its old inline float/margins. */
.sf-product-detail-copy a[data-featherlight="image"] {
  display: inline-block;
  max-width: 100%;
  margin: 20px 0 0;
  transition: transform 350ms ease;
}
.sf-product-detail-copy a[data-featherlight="image"] img {
  float: none !important;
  display: block;
  margin: 0 !important;
}
@media (hover:hover) {
  .sf-product-detail-copy a[data-featherlight="image"]:hover { transform: translateY(-4px); }
}
@media (max-width: 760px) {
  .sf-inner-page .sf-content-grid:has(.sf-product-detail) { padding: 26px 20px 48px; }
  .sf-product-detail-header { margin-bottom: 20px; }
  .sf-product-detail-header h1 { font-size: clamp(27px, 7vw, 35px); }
  .sf-product-detail-grid { grid-template-columns: 1fr; gap: 20px; }
  .sf-product-detail-visual > img { max-height: 380px; }
  .sf-product-detail-copy { font-size: 15px; line-height: 1.7; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-product-detail-copy a[data-featherlight="image"] { transition: none !important; }
}


/* 1.0.38 — product detail refinement and true sticky footer on inner pages.
   Do not alter homepage Aikon module heights or the homepage flow. */
body.sf-inner-page {
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}
body.sf-inner-page > .sf-header,
body.sf-inner-page > .sf-footer { flex-shrink: 0; }
body.sf-inner-page > .sf-main {
  flex: 1 0 auto;
  min-height: 0;
}
body.sf-inner-page > .sf-footer { margin-top: auto; }

/* Only the separately selected product article layout. */
.sf-inner-page .sf-content-grid:has(.sf-product-detail) {
  padding-top: clamp(30px, 3.2vw, 46px);
  padding-bottom: clamp(30px, 3.5vw, 48px);
}
.sf-product-detail-header { margin-bottom: clamp(20px, 2.5vw, 34px); }
.sf-product-detail-header h1 {
  font-size: clamp(27px, 2.75vw, 38px);
  margin-bottom: 12px;
}
.sf-product-detail-grid { gap: clamp(26px, 4.5vw, 62px); }
.sf-product-detail-visual > img { max-height: 480px; }
.sf-product-detail-copy { line-height: 1.73; }
.sf-product-detail-copy p { margin-bottom: 1.05em; }
.sf-product-detail-copy p:has(> a[data-featherlight="image"]) {
  margin: 12px 0 0;
}
.sf-product-detail-copy a[data-featherlight="image"] {
  margin: 0;
  vertical-align: top;
}
@media (max-width: 760px) {
  .sf-inner-page .sf-content-grid:has(.sf-product-detail) {
    padding: 24px 20px 38px;
  }
  .sf-product-detail-header { margin-bottom: 18px; }
  .sf-product-detail-header h1 { font-size: clamp(26px, 7vw, 34px); }
  .sf-product-detail-grid { gap: 16px; }
  .sf-product-detail-visual > img { max-height: 340px; }
  .sf-product-detail-copy { font-size: 15px; line-height: 1.68; }
}

/* 1.0.40 — white product detail layout with a quiet divider between columns. */
@media (min-width: 761px) {
  .sf-inner-page .sf-product-detail-grid:not(.sf-product-detail-no-image) {
    --sf-detail-gap: clamp(26px, 4.5vw, 62px);
    gap: var(--sf-detail-gap);
  }
  .sf-inner-page .sf-product-detail-grid:not(.sf-product-detail-no-image) > .sf-product-detail-copy {
    position: relative;
  }
  .sf-inner-page .sf-product-detail-grid:not(.sf-product-detail-no-image) > .sf-product-detail-copy::before {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: calc(var(--sf-detail-gap) / -2);
    width: 1px;
    background: rgba(42, 45, 49, .12);
    pointer-events: none;
  }
}

/* 1.0.41 — product article: slightly narrower left image and more text breathing room. */
@media (min-width: 761px) {
  .sf-inner-page .sf-product-detail-grid:not(.sf-product-detail-no-image) > .sf-product-detail-visual {
    padding-right: 20px;
  }
  .sf-inner-page .sf-product-detail-grid:not(.sf-product-detail-no-image) > .sf-product-detail-copy {
    padding-left: 20px;
  }
}


/* 1.0.42 — optional orchard detail layout, without affecting product or home.
   Preserve processed article content for gallery plugins and Featherlight. */
@media (min-width: 761px) {
  .sf-inner-page .sf-orchard-detail .sf-product-detail-grid:not(.sf-product-detail-no-image) {
    grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
  }
  .sf-inner-page .sf-orchard-detail .sf-product-detail-visual > img {
    width: 100%;
    max-height: 390px;
    object-fit: contain;
    object-position: top center;
  }
}
.sf-inner-page .sf-orchard-detail .sf-product-detail-copy table {
  max-width: 100%;
}
@media (max-width: 760px) {
  .sf-inner-page .sf-orchard-detail .sf-product-detail-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .sf-inner-page .sf-orchard-detail .sf-product-detail-visual > img {
    max-height: 300px;
  }
  .sf-inner-page .sf-orchard-detail .sf-product-detail-copy {
    overflow-wrap: anywhere;
  }
}


/* 1.0.43 — Raleway typography trial.
   Keep the font consistent in the new site, including product and orchard pages.
   Font-family only: preserve existing sizes, colors, spacings, hover and layout. */
body.sf-page,
body.sf-page button,
body.sf-page input,
body.sf-page select,
body.sf-page textarea {
  font-family: 'Raleway', Arial, Helvetica, sans-serif;
}
body.sf-page h1,
body.sf-page h2,
body.sf-page h3,
body.sf-page h4,
body.sf-page h5,
body.sf-page h6 {
  font-family: inherit;
}


/* 1.0.44 — Montserrat headings + Raleway body; orchard grid 40/60.
   Applies to headings, including article heading elements, not brand logo artwork. */
body.sf-page h1, body.sf-page h2, body.sf-page h3,
body.sf-page h4, body.sf-page h5, body.sf-page h6 {
  font-family: 'Montserrat', Arial, Helvetica, sans-serif;
}


/* 1.0.45 — desktop orchard detail: add 20px between page title and both columns.
   Keep product pages and mobile orchard layout untouched. */
@media (min-width: 761px) {
  .sf-inner-page .sf-orchard-detail .sf-product-detail-header {
    margin-bottom: calc(clamp(20px, 2.5vw, 34px) + 20px);
  }
}


/* 1.0.46 DEV — Mobile navigation / footer design trial only.
   Retains existing opacity/blur, JS accordion, sticky header, and desktop styles. */
@media (max-width: 760px) {
  /* A sharp brand accent separates the sticky header from the menu/content.
     The line belongs to the logo row, so it does not affect scroll geometry. */
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    position: relative;
  }
  .sf-page .sf-header-inner::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 2px;
    background: #bd0024;
    pointer-events: none;
  }
  /* Red hamburger is the sole bold accent in the compact header. */
  .sf-page .sf-nav-toggle {
    background: #bd0024 !important;
    border-color: #bd0024 !important;
    color: #fff !important;
    transition: background-color .3s ease, border-color .3s ease;
  }
  .sf-page .sf-nav-toggle span { background: #fff !important; }
  .sf-page .sf-nav-toggle:hover,
  .sf-page .sf-nav-toggle:focus-visible,
  .sf-page .sf-header.nav-open .sf-nav-toggle {
    background: #a9001e !important;
    border-color: #a9001e !important;
  }
  .sf-page .sf-nav-toggle:focus-visible {
    outline: 2px solid #a9001e;
    outline-offset: 3px;
  }
  /* Preserve the existing .98 alpha while removing the all-white visual field.
     No change to blur, scroll handling, nested accordion or menu height. */
  .sf-page .sf-main-nav {
    background: rgba(247,247,247,.98) !important;
  }
  .sf-page .sf-main-nav li > ul,
  .sf-page .sf-main-nav li > ul.mod-menu,
  .sf-page .sf-main-nav li > ul.mod-list,
  .sf-page .sf-main-nav li > ul.menu,
  .sf-page .sf-main-nav li > ul.nav {
    background: rgba(237,237,236,.94) !important;
  }
  /* Old mobile footer's balanced centered rhythm, using the new content/markup. */
  .sf-footer-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    padding: 45px 22px 47px;
  }
  .sf-footer .sf-footer-column {
    width: 100%;
    text-align: center;
    padding: 0 !important;
    border: 0 !important;
  }
  .sf-footer .sf-footer-column + .sf-footer-column { margin-top: 54px; }
  .sf-footer .sf-footer-entry + .sf-footer-entry { margin-top: 24px; }
  .sf-footer .sf-footer-label { margin-bottom: 6px; }
  .sf-footer .sf-footer-bottom-inner,
  .sf-footer .sf-footer-copyright { text-align: center; }
  .sf-footer .sf-footer-bottom-inner { padding: 21px 18px; }
  /* Respect intentionally coloured certification spans in Joomla module HTML. */
  .sf-footer .sf-footer-certifications span[style*="color"],
  .sf-footer .sf-footer-certifications strong[style*="color"] {
    color: #63ff63 !important;
  }
}
@media (max-width: 370px) {
  .sf-footer .sf-footer-column + .sf-footer-column { margin-top: 46px; }
}
@media (prefers-reduced-motion: reduce) {
  .sf-page .sf-nav-toggle { transition: none !important; }
}


/* 1.0.47 DEV — restrained mobile brand controls and dark related-sites panel.
   Desktop, Aikon, accordion logic, and back-to-top behavior are unchanged. */
@media (max-width: 760px) {
  /* Glass header uses the same opacity/saturation as the desktop header. */
  .sf-page .sf-header::after,
  .sf-page .sf-header.is-scrolled::after {
    background: rgba(255,255,255,.74) !important;
    -webkit-backdrop-filter: blur(15px) saturate(1.18) !important;
    backdrop-filter: blur(15px) saturate(1.18) !important;
  }

  /* A little more room around the larger logo; keep both states identical. */
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    height: 104px !important;
    min-height: 104px !important;
    padding: 9px 16px !important;
    gap: 9px !important;
  }
  .sf-page .sf-brand img,
  .sf-page .sf-header.is-scrolled .sf-brand img {
    width: 106px !important;
    max-width: 106px !important;
    max-height: none !important;
    height: auto !important;
  }

  /* Language links: fine separator between languages, and a second
     quiet separator before the hamburger; slide/collapse on scroll. */
  .sf-page .sf-mobile-language-slot {
    max-width: 190px;
    overflow: hidden;
    padding-right: 13px !important;
    margin-right: 15px !important;
    border-right: 1px solid rgba(43,45,47,.22);
    opacity: 1;
    transform: translateX(0);
    transition: opacity .25s ease, transform .3s ease,
                max-width .32s ease, padding-right .32s ease,
                margin-right .32s ease, border-color .25s ease;
  }
  .sf-mobile-language-slot .sf-mobile-flags {
    gap: 10px !important;
    white-space: nowrap;
  }
  .sf-mobile-language-slot .sf-mobile-flags a + a {
    position: relative;
    margin-left: 7px;
  }
  .sf-mobile-language-slot .sf-mobile-flags a + a::before {
    content: "";
    position: absolute;
    left: -9px;
    top: 50%;
    transform: translateY(-50%);
    height: 17px;
    width: 1px;
    background: rgba(43,45,47,.22);
  }
  .sf-page .sf-header.is-scrolled .sf-mobile-language-slot {
    max-width: 0;
    padding-right: 0 !important;
    margin-right: 0 !important;
    border-right-color: transparent;
    opacity: 0;
    visibility: hidden;
    transform: translateX(9px);
    pointer-events: none;
  }

  /* Option B: delicate outline, pale background and three unequal lines.
     Button stays 42x42 for a comfortable touch target. */
  .sf-page .sf-nav-toggle,
  .sf-page .sf-header.nav-open .sf-nav-toggle {
    background: rgba(251,248,248,.90) !important;
    border: 1px solid rgba(185,0,37,.18) !important;
    color: #b90025 !important;
    border-radius: 7px;
    align-items: center;
    justify-content: center;
    width: 42px;
    flex: 0 0 42px;
    height: 42px;
    box-shadow: none !important;
    transition: background-color .25s ease, border-color .25s ease,
                transform .25s ease !important;
  }
  .sf-page .sf-nav-toggle span {
    background: #b90025 !important;
    align-self: center;
    transform-origin: center;
    transition: transform .32s ease, width .3s ease, opacity .2s ease !important;
  }
  .sf-page .sf-nav-toggle span:nth-child(1) { width: 100%; }
  .sf-page .sf-nav-toggle span:nth-child(2) { width: 75%; }
  .sf-page .sf-nav-toggle span:nth-child(3) { width: 88%; }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(1) {
    width: 88%;
    transform: translateY(8px) rotate(45deg);
  }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(2) { opacity: 0; }
  .sf-page .sf-header.nav-open .sf-nav-toggle span:nth-child(3) {
    width: 88%;
    transform: translateY(-8px) rotate(-45deg);
  }
  .sf-page .sf-nav-toggle:hover,
  .sf-page .sf-nav-toggle:focus-visible,
  .sf-page .sf-header.nav-open .sf-nav-toggle:hover {
    background: rgba(185,0,37,.075) !important;
    border-color: rgba(185,0,37,.30) !important;
  }

  /* Header is taller: update nav's independent scrollable panel height. */
  .sf-page .sf-main-nav {
    max-height: calc(100vh - 104px) !important;
    max-height: calc(100dvh - 104px) !important;
  }

  /* Secondary destinations are deliberately a separate charcoal band.
     Existing Joomla URLs still come from the existing related-links builder. */
  .sf-page .sf-main-nav .sf-mobile-related {
    display: block;
    margin: 18px -20px -22px !important;
    padding: 23px 29px 26px !important;
    background: #292a2e;
    border-top: 1px solid rgba(255,255,255,.07);
    color: #fff;
  }
  .sf-page .sf-mobile-related-title {
    color: #b7bac0 !important;
    letter-spacing: .13em;
  }
  .sf-page .sf-mobile-related-links a {
    color: #f1f1f2 !important;
    transition: color .25s ease, transform .25s ease !important;
  }
  .sf-page .sf-mobile-related-links a:hover,
  .sf-page .sf-mobile-related-links a:focus-visible {
    color: #ff718b !important;
    transform: translateY(-2px);
  }

  /* Entering menu items fade in quietly, without changing nested toggles. */
  .sf-page .sf-header.nav-open .sf-main-nav > ul > li,
  .sf-page .sf-header.nav-open .sf-main-nav > div > ul > li,
  .sf-page .sf-header.nav-open .sf-main-nav > nav > ul > li {
    animation: sf147-nav-item .32s ease both;
  }
  .sf-page .sf-header.nav-open .sf-main-nav > ul > li:nth-child(2),
  .sf-page .sf-header.nav-open .sf-main-nav > div > ul > li:nth-child(2),
  .sf-page .sf-header.nav-open .sf-main-nav > nav > ul > li:nth-child(2) { animation-delay: .035s; }
  .sf-page .sf-header.nav-open .sf-main-nav > ul > li:nth-child(3),
  .sf-page .sf-header.nav-open .sf-main-nav > div > ul > li:nth-child(3),
  .sf-page .sf-header.nav-open .sf-main-nav > nav > ul > li:nth-child(3) { animation-delay: .06s; }
  .sf-page .sf-header.nav-open .sf-main-nav .sf-mobile-related {
    animation: sf147-related-in .4s ease both;
  }
  @keyframes sf147-nav-item {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @keyframes sf147-related-in {
    from { opacity: 0; transform: translateY(7px); }
    to { opacity: 1; transform: translateY(0); }
  }
}
@media (max-width: 370px) {
  .sf-page .sf-header-inner,
  .sf-page .sf-header.is-scrolled .sf-header-inner {
    height: 98px !important;
    min-height: 98px !important;
    padding: 8px 12px !important;
  }
  .sf-page .sf-brand img,
  .sf-page .sf-header.is-scrolled .sf-brand img {
    width: 94px !important;
    max-width: 94px !important;
  }
  .sf-page .sf-mobile-language-slot { padding-right: 8px !important; margin-right: 9px !important; }
  .sf-page .sf-header.is-scrolled .sf-mobile-language-slot {
    padding-right: 0 !important;
    margin-right: 0 !important;
  }
  .sf-page .sf-main-nav {
    max-height: calc(100vh - 98px) !important;
    max-height: calc(100dvh - 98px) !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sf-page .sf-mobile-language-slot,
  .sf-page .sf-nav-toggle,
  .sf-page .sf-nav-toggle span,
  .sf-page .sf-header.nav-open .sf-main-nav > ul > li,
  .sf-page .sf-header.nav-open .sf-main-nav > div > ul > li,
  .sf-page .sf-header.nav-open .sf-main-nav > nav > ul > li,
  .sf-page .sf-header.nav-open .sf-main-nav .sf-mobile-related {
    animation: none !important;
    transition: none !important;
  }
}


/* 1.0.48 — MOBILE VISUAL FINESSE (desktop unchanged).
   Keep the agreed menu opacity and current accordion/scroll behavior. */
@media (max-width: 760px) {
  /* Light glass is present from page load, not only after scrolling.
     Remove any opaque foreground layers from the header. */
  body.sf-page .sf-header,
  body.sf-page .sf-header.is-scrolled {
    background: transparent !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  body.sf-page .sf-header::after,
  body.sf-page .sf-header.is-scrolled::after {
    background: rgba(255, 255, 255, .74) !important;
    -webkit-backdrop-filter: blur(15px) saturate(1.18) !important;
    backdrop-filter: blur(15px) saturate(1.18) !important;
  }
  body.sf-page .sf-header-inner,
  body.sf-page .sf-header.is-scrolled .sf-header-inner,
  body.sf-page .sf-brand,
  body.sf-page .sf-header.is-scrolled .sf-brand {
    background: transparent !important;
  }

  /* No outline, border, box or pale-red hover on the burger. */
  body.sf-page .sf-nav-toggle,
  body.sf-page .sf-header.nav-open .sf-nav-toggle,
  body.sf-page .sf-nav-toggle:hover,
  body.sf-page .sf-nav-toggle:focus-visible,
  body.sf-page .sf-header.nav-open .sf-nav-toggle:hover {
    appearance: none;
    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #b90025 !important;
  }
  body.sf-page .sf-nav-toggle:focus-visible {
    outline: 2px solid #b90025 !important;
    outline-offset: 3px !important;
  }
  body.sf-page .sf-nav-toggle span { background: #b90025 !important; }

  /* Fade/slide and collapse smoothly in both scroll directions. Keep
     visibility animatable with a delayed hide instead of hiding instantly. */
  body.sf-page .sf-mobile-language-slot {
    display: flex !important;
    width: auto;
    max-width: 190px;
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateX(0) !important;
    transition: max-width 420ms cubic-bezier(.2,.75,.2,1),
      opacity 340ms ease, transform 420ms ease,
      padding-right 420ms ease, margin-right 420ms ease,
      border-color 340ms ease !important;
  }
  body.sf-page .sf-header.is-scrolled .sf-mobile-language-slot {
    max-width: 0;
    opacity: 0 !important;
    visibility: visible !important;
    transform: translateX(12px) !important;
    pointer-events: none;
    overflow: hidden;
  }

  /* Full-bleed secondary bar: exactly counteract the 20px menu gutters. */
  body.sf-page .sf-main-nav .sf-mobile-related {
    display: block !important;
    box-sizing: border-box !important;
    width: calc(100% + 40px) !important;
    min-width: calc(100% + 40px) !important;
    max-width: none !important;
    margin: 18px 0 -22px -20px !important;
    padding: 23px 29px 26px !important;
    background: #292a2e !important;
  }

  /* All active/hover menu backgrounds neutral grey, never pale pink. */
  body.sf-page .sf-main-nav li > .sf-submenu-toggle:hover,
  body.sf-page .sf-main-nav li > .sf-submenu-toggle:focus-visible,
  body.sf-page .sf-main-nav li.sf-submenu-open > .sf-submenu-toggle,
  body.sf-page .sf-main-nav li > a:hover,
  body.sf-page .sf-main-nav li > a:focus-visible,
  body.sf-page .sf-main-nav li.active > a,
  body.sf-page .sf-main-nav li.current > a {
    background: rgba(55, 60, 65, .055) !important;
  }
  body.sf-page .sf-mobile-related-links a:hover,
  body.sf-page .sf-mobile-related-links a:focus-visible {
    color: #fff !important;
    text-decoration: underline;
    text-decoration-color: rgba(255,255,255,.65);
    text-underline-offset: 3px;
  }
}
@media (prefers-reduced-motion: reduce) {
  body.sf-page .sf-mobile-language-slot {
    transition: none !important;
  }
}


/* 1.0.49 — nested mobile menu smoothly expands its real height.
   The JS sets the measured height; keep even closed ULs in layout with height:0.
   No changes to desktop navigation or links. */
@media (max-width: 760px) {
  body.sf-page .sf-main-nav.sf-accordion-ready li > ul,
  body.sf-page .sf-main-nav.sf-accordion-ready li:hover > ul,
  body.sf-page .sf-main-nav.sf-accordion-ready li:focus-within > ul {
    display: flex !important;
    height: 0;
    min-height: 0;
    overflow: hidden !important;
    visibility: hidden;
    opacity: 0;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    animation: none !important;
    transform: none !important;
    transition: height 400ms cubic-bezier(.22,.72,.24,1),
      opacity 300ms ease, margin-bottom 400ms cubic-bezier(.22,.72,.24,1),
      visibility 0s linear 400ms !important;
  }
  body.sf-page .sf-main-nav.sf-accordion-ready li.sf-submenu-open > ul {
    display: flex !important;
    visibility: visible;
    opacity: 1;
    margin-bottom: 7px !important;
    animation: none !important;
    transition: height 400ms cubic-bezier(.22,.72,.24,1),
      opacity 310ms ease 50ms, margin-bottom 400ms cubic-bezier(.22,.72,.24,1),
      visibility 0s !important;
  }
  /* Light grey dividers for the secondary destination links, without
     adding heavier blocks or changing their URLs. */
  body.sf-page .sf-mobile-related-links {
    gap: 8px 0;
    align-items: center;
  }
  body.sf-page .sf-mobile-related-links a + a {
    border-left: 1px solid rgba(215,218,222,.42);
    padding-left: 13px;
    margin-left: 13px;
  }
}
@media (max-width: 760px) and (prefers-reduced-motion: reduce) {
  body.sf-page .sf-main-nav.sf-accordion-ready li > ul,
  body.sf-page .sf-main-nav.sf-accordion-ready li.sf-submenu-open > ul {
    transition: none !important;
  }
}


/* 1.0.50 — Back to Top is shown only after 140px of meaningful scroll. */
body.sf-page .sf-back-to-top {
  background: rgba(155, 0, 24, .90); /* darker brand red, 10% transparent */
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
  transition: opacity .28s ease, transform .28s ease, visibility 0s linear .28s,
              background-color .25s ease !important;
}
body.sf-page .sf-back-to-top.sf-back-to-top-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition: opacity .28s ease, transform .28s ease, visibility 0s,
              background-color .25s ease !important;
}
body.sf-page .sf-back-to-top.sf-back-to-top-visible:hover,
body.sf-page .sf-back-to-top.sf-back-to-top-visible:focus-visible {
  background: rgba(125, 0, 20, .94);
}
@media (prefers-reduced-motion: reduce) {
  body.sf-page .sf-back-to-top,
  body.sf-page .sf-back-to-top.sf-back-to-top-visible {
    transition: none !important;
    transform: none !important;
  }
}

/* 1.0.51 — restore glass backgrounds for both desktop dropdown levels.
   Explicit scope/specificity prevents transparent utility/mobile styles from
   leaking into desktop menus. No markup or mobile behavior changes. */
@media (min-width: 761px) {
  body.sf-page .sf-header .sf-main-nav li > ul,
  body.sf-page .sf-header .sf-main-nav li > ul.mod-menu,
  body.sf-page .sf-header .sf-main-nav li > ul.mod-list,
  body.sf-page .sf-header .sf-main-nav li > ul.menu,
  body.sf-page .sf-header .sf-main-nav li > ul.nav,
  body.sf-page .sf-header .sf-main-nav li > ul li > ul {
    background-color: rgba(250, 250, 250, .90) !important;
    -webkit-backdrop-filter: blur(19px) saturate(1.14) !important;
    backdrop-filter: blur(19px) saturate(1.14) !important;
    background-clip: padding-box;
    border: 1px solid rgba(255, 255, 255, .48) !important;
    box-shadow: 0 12px 30px rgba(18, 24, 29, .14) !important;
    opacity: 1;
    isolation: isolate;
  }
  /* The second level uses the same glass treatment but a touch more opacity
     for legibility over bright hero photography. */
  body.sf-page .sf-header .sf-main-nav li > ul li > ul {
    background-color: rgba(250, 250, 250, .94) !important;
    -webkit-backdrop-filter: blur(19px) saturate(1.14) !important;
    backdrop-filter: blur(19px) saturate(1.14) !important;
    box-shadow: 0 14px 32px rgba(18, 24, 29, .17) !important;
  }
  body.sf-page .sf-header .sf-main-nav li > ul li > a:hover,
  body.sf-page .sf-header .sf-main-nav li > ul li > a:focus-visible,
  body.sf-page .sf-header .sf-main-nav li > ul li > span:hover,
  body.sf-page .sf-header .sf-main-nav li > ul li.active > a {
    background-color: rgba(72, 78, 82, .075) !important;
    color: var(--sf-red) !important;
  }
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  @media (min-width: 761px) {
    body.sf-page .sf-header .sf-main-nav li > ul,
    body.sf-page .sf-header .sf-main-nav li > ul li > ul {
      background-color: rgba(250, 250, 250, .97) !important;
    }
  }
}

/* 1.0.53: iOS Safari rendered the Unicode north-east arrow as a blue emoji.
   Use a vector stroke that inherits the red link color on every platform. */
.sf-home .sf-product-link .sf-product-arrow {
  width:19px;
  height:19px;
  display:block;
  flex:0 0 19px;
  color:inherit;
  overflow:visible;
}
