/*!
Theme Name: idm
Author: IMD
Description: Design theme for IMD.
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: idm
This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

idm is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.
*/

@import url("https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400..700;1,400..700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Libre+Baskerville:ital,wght@0,400..700;1,400..700&display=swap");
/*===================== TABLE OF CONTENT =======================

1. Reset
2. Body Style
3. Placeholders & Highlights
4. Container & Grid
5. Headings
6. Buttons

=============================================================*/

/* ================================================================================== 
1. Reset
===================================================================================== */
*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: inherit;
  box-sizing: inherit;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary {
  display: block;
}
a,
a:active,
a:hover,
a:focus {
  outline: none;
  text-decoration: none;
}
abbr[title] {
  border-bottom: 1px dotted;
}
dfn {
  font-style: italic;
}
small {
  font-size: 80%;
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
img {
  border: 0;
  max-width: 100%;
}
svg:not(:root) {
  overflow: hidden;
}
hr {
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
  height: 0;
  margin-top: 30px;
  margin-bottom: 35px;
  border-width: 0;
  border-top: 1px solid #e1e1e1;
}
pre {
  overflow: auto;
}
code,
kbd,
pre,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}
strong {
  font-weight: 700;
}

.fancybox__button--zoo,
.fancybox__button--slideshow,
.fancybox__button--fullscreen,
.fancybox__button--thumbs,
.fancybox__button--zoom {
  display: none;
}
input[type="button"],
input[type="submit"] {
  width: auto;
  transition: all 0.4s ease-in-out;
}
button {
  font-size: inherit;
  font-family: inherit;
}
.none {
  display: none;
}
ul,
ol {
  padding-left: 4rem;
}
a {
  text-decoration: underline;
  color: inherit;
}
header a {
  text-decoration: none;
}
.image-404 img {
  display: block;
  width: 100;
  max-width: 80rem;
  height: auto;
  margin: 0 auto;
}
.image-404 {
  margin-bottom: 5rem;
}
/* FLEX GRID */
/* === Base Wrapper === */
.box-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  box-sizing: border-box;
}

/* === Base Box === */
.box {
  margin-bottom: 3rem;
}

/* === Default Desktop Widths === */
.box-2 {
  width: 48.5%;
}
.box-3 {
  width: 31.3%;
}
.box-4 {
  width: 22.4%;
}
.box-5 {
  width: 17.6%;
}
.box-6 {
  width: 14.17%;
}

/* === Mobile Adjustment === */
@media only screen and (min-width: 0em) {
  .box {
    width: 100%;
    margin-bottom: 3rem;
  }
}

/* === Progressive Media Queries === */
@media only screen and (min-width: 48.0625em) {
  /* 769px */
  .box-2 {
    width: 48.5%;
  }
  .box-3 {
    width: 48.5%;
  }
  .box-4 {
    width: 48.5%;
  }
  .box-5 {
    width: 31.3%;
  }
  .box-6 {
    width: 31.3%;
  }
}

@media only screen and (min-width: 50.0625em) {
  /* 801px */
  .box-4 {
    width: 31.3%;
  }
  .box-5 {
    width: 22.4%;
  }
  .box-6 {
    width: 22.4%;
  }
}

@media only screen and (min-width: 56.3125em) {
  /* 901px */
  .box-4 {
    width: 22.4%;
  }
  .box-5 {
    width: 17.6%;
  }
  .box-6 {
    width: 14.17%;
  }
}

@media only screen and (min-width: 61.3125em) {
  /* 981px */
  .box-3 {
    width: 31.3%;
  }
  .box-4 {
    width: 22.4%;
  }
  .box-5 {
    width: 17.6%;
  }
  .box-6 {
    width: 14.17%;
  }
}

@media only screen and (min-width: 64.0625em) {
  /* 1025px */
  .box-5 {
    width: 17.6%;
  }
  .box-6 {
    width: 14.17%;
  }
}

@media only screen and (min-width: 68.75em) {
  /* 1100px */
  .box-6 {
    width: 14.17%;
  }
}

/* ================================================================================== 
2. Body Style
===================================================================================== */
html {
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  font-size: 56.25%;
  word-wrap: break-word;
}
@media only screen and (min-width: 80.0625em) {
  /*1281px*/
  html {
    font-size: 62.5%;
  }
}
body {
  font-family: "Inter", sans-serif;
  font-weight: 400;
  line-height: 1.6;
  color: #222344;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 1.6rem;
  background-color: #f4f1ec;
  letter-spacing: -0.04em;
}
main {
  position: relative;
}
/*----cookie----*/
.cky-btn-revisit-wrapper,
.grecaptcha-badge {
  display: none !important;
}
/* ================================================================================== 
3. Placeholders & Highlights
===================================================================================== */
::-webkit-input-placeholder {
  color: inherit;
  opacity: 1 !important;
}
:-moz-placeholder {
  color: inherit;
  opacity: 1;
}
::-moz-placeholder {
  color: inherit;
  opacity: 1;
}
:-ms-input-placeholder {
  color: inherit;
}
::-moz-selection {
  background-color: #952b9e;
  color: #fff;
}
::selection {
  background-color: #952b9e;
  color: #fff;
}
/* ================================================================================== 
4. Container & Grid
===================================================================================== */
.container {
  position: relative;
  width: 100%;
  max-width: 140rem;
  margin: 0 auto;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  padding: 0 2rem;
}
.container-lg {
  max-width: 180rem;
}
.container-2xl {
  max-width: 192rem;
  padding: 0;
}
.container-fluid {
  max-width: 100%;
}
.container-md {
  max-width: calc(102.4rem - 4rem);
}
.container-sm {
  max-width: 76rem;
}
.container-xl {
  max-width: 160rem;
  padding: 0;
}
/* ================================================================================== 
5. Headings
===================================================================================== */

/* Heading Animation */
@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(30px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin-bottom: 2rem;
  font-weight: 600;
  margin-top: 1rem;
  font-family: "Libre Baskerville", serif;
  opacity: 0;
}

h1.animate,
h2.animate,
h3.animate,
h4.animate,
h5.animate,
h6.animate {
  animation: fadeInUp 1s ease-out forwards;
}

h1 {
  font-size: 4.8rem;
  line-height: 1.1;
}
h2 {
  font-size: 3.6rem;
  line-height: 1.2;
}
h3 {
  font-size: 2.8rem;
  line-height: 1.3;
}
h4 {
  font-size: 2.2rem;
  line-height: 1.4;
}
h5 {
  font-size: 1.8rem;
  line-height: 1.5;
}
h6 {
  font-size: 1.6rem;
  line-height: 1.5;
}
h1 {
  font-size: clamp(1.2rem, 2.8vw + 1rem, 3.2rem);
  line-height: 1.4;
}

h2 {
  font-size: clamp(2.4rem, 3vw + 0.8rem, 3.2rem);
  line-height: 1.2;
}

h3 {
  font-size: clamp(2rem, 2vw + 0.5rem, 2.6rem);
  line-height: 1.3;
}
.title h1,
.title h2 {
  font-size: clamp(1.2rem, 2.8vw + 1rem, 3.2rem);
}
p {
  margin-bottom: 1.6rem;
}
.title {
  margin-bottom: 4rem;
}
.title-center {
  text-align: center;
}
.intro .title h1,
.intro .title h2 {
  font-size: clamp(3.2rem, 4vw + 1rem, 5.6rem);
}
.title h4 {
  font-size: 1.8rem;
  color: #952b9e;
}
/* ================================================================================== 
6. Buttons
===================================================================================== */

.btn {
  display: inline-block;
  padding: 1rem 4rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.4s ease-in-out;
}
.btn-primary {
  background-color: #cdad7d;
  color: #222344;
}
.btn-secondary {
  background-color: #222344;
  color: #cdad7d;
  border: 2px solid #222344;
}
.btn-primary:hover {
  background-color: #222344;
  color: #cdad7d;
}
.btn-secondary:hover {
  background-color: #cdad7d;
  color: #222344;
  border: 2px solid #222344;
}
.btn-tertiary {
  background-color: transparent;
  border: 1px solid #222344;
  color: #222344;
}
.btn-tertiary:hover {
  background-color: #222344;
  color: #fff;
}

/* ================================================================================== 
7. Header
===================================================================================== */

header {
  position: sticky;
  top: 0;
  width: 100%;
  background-color: #f4f1ec;
  z-index: 9999;
  border-bottom: 1px solid rgba(0, 0, 0, 0.07);
}

.header-container {
  position: relative;
  /* max-width: 140rem; */
  margin: 0 auto;
  padding: 3rem 2rem;
}

#primary {
  z-index: 1;
}

/* Hamburger Menu Button */
.menu-toggle {
  display: none;
  background: none;
  border: none;
  cursor: pointer;
  padding: 0.5rem;
  position: absolute;
  right: 2rem;
  top: 50%;
  transform: translateY(-50%);
}

.menu-toggle span {
  display: block;
  width: 2.8rem;
  height: 0.3rem;
  background-color: #222344;
  margin: 0.5rem 0;
  transition: all 0.3s ease;
  border-radius: 2px;
}

/* Mobile Styles */
@media only screen and (max-width: 1100px) {
  /* 768px */

  .menu-toggle {
    display: block;
    z-index: 10001;
  }

  .mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 3rem;
    padding-bottom: 2rem;
    border-bottom: 1px solid rgba(48, 66, 84, 0.2);
  }

  .mobile-menu-header h2 {
    font-size: 2.2rem;
    font-weight: 600;
    color: #222344;
    margin: 0;
  }

  .close-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: none;
    font-size: 4rem;
    line-height: 1;
    color: #222344;
    cursor: pointer;
    padding: 0;
    width: 4rem;
    height: 4rem;
  }

  .main-navigation {
    position: fixed;
    top: 0;
    right: -100%;
    width: 85%;
    max-width: 42rem;
    height: 100vh;
    background-color: #f4f1ec;
    padding: 6rem 3rem 3rem;
    overflow-y: auto;
    transition: right 0.35s ease-in-out;
    z-index: 10000;
    box-shadow: -5px 0 15px rgba(0, 0, 0, 0.3);
  }

  .main-navigation.open {
    right: 0;
  }

  #primary-menu {
    display: flex;
    flex-direction: column;
    padding: 0;
    margin: 0;
    list-style: none;
  }

  #primary-menu > li {
    padding: 0;
    border-bottom: 1px solid rgba(48, 66, 84, 0.1);
  }

  #primary-menu > li > a {
    display: block;
    padding: 1.6rem 0;
    font-size: 1.4rem;
    color: #222344;

    letter-spacing: 0;
    transition: color 0.2s ease;
    text-decoration: none;
  }

  #primary-menu > li.current-menu-item > a,
  #primary-menu > li.current_page_item > a {
    font-weight: 700;
  }

  #primary-menu > li > a:hover {
    font-weight: 700;
    color: #222344;
  }

  body.menu-open {
    overflow: hidden;
  }
}

/* Desktop Styles */
@media only screen and (min-width: 48.0625em) {
  /* 769px */

  header {
    border-bottom: none;
  }

  .header-container {
    padding: 0 2rem;
  }

  #primary-menu {
    align-items: center;
    border-bottom: 1px solid rgba(0, 0, 0, 0.07);
    box-sizing: border-box;
    display: flex;
    height: 48px;
    justify-content: flex-end;
    width: 100%;
    color: #222344;

    padding: 0;
    padding-right: 2rem;
    margin: 0;
    list-style: none;
  }

  #primary-menu > li {
    padding: 12px 16px;
  }

  #primary-menu > li:last-child {
    padding-right: 0;
  }

  #primary-menu > li > a {
    letter-spacing: -0.575px;
  }

  #primary-menu
    > li:not(.current-menu-item):not(.current_page_item):not(:hover)
    > a {
    letter-spacing: 0px;
  }

  #primary-menu > li.current-menu-item > a,
  #primary-menu > li.current_page_item > a,
  #primary-menu > li:hover > a {
    font-weight: 600;
    letter-spacing: -0.35px;
  }
}

li::after {
  display: block;
  content: attr(title);
  font-weight: bold;
  height: 1px;
  color: transparent;
  overflow: hidden;
  visibility: hidden;
}

/* =============================================
   Header Submenu (Desktop + Mobile)
   - Desktop: hover dropdown + decorative arrow
   - Mobile: click on arrow toggles submenu
   ============================================= */

/* Base resets for menu lists */
.main-navigation ul,
.main-navigation .menu,
.main-navigation .sub-menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* Hide JS-injected arrow by default; shown on mobile only */
.main-navigation .submenu-toggle {
  display: none;
}

/* Desktop dropdown */
@media only screen and (min-width: 48.0625em) {
  .main-navigation .menu-item-has-children {
    position: relative;
  }

  .main-navigation .menu-item-has-children > a::after {
    content: "▾";
    display: inline-block;
    margin-left: 0.5rem;
    font-size: 0.85em;
    line-height: 1;
  }

  .main-navigation .menu-item-has-children > .sub-menu {
    display: none;
    position: absolute;
    top: calc(100% + 1px);
    left: 0;
    min-width: 220px;
    background-color: #f4f1ec;
    border: 1px solid rgba(0, 0, 0, 0.07);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
    padding: 0.6rem 0;
    z-index: 10001;
  }

  .main-navigation .menu-item-has-children:hover > .sub-menu,
  .main-navigation .menu-item-has-children.focus > .sub-menu {
    display: block;
  }

  .main-navigation .sub-menu > li > a {
    display: block;
    padding: 0.8rem 1.2rem;
    white-space: nowrap;
    text-decoration: none;
    color: #222344;
  }

  .main-navigation .sub-menu > li > a:hover {
    background: rgba(201, 168, 112, 0.15);
  }
}

/* Mobile submenu: toggled by arrow button injected via JS */
@media only screen and (max-width: 48em) {
  .main-navigation .menu-item-has-children {
    position: relative;
  }

  .main-navigation .menu-item-has-children > .sub-menu {
    display: none;
    padding-left: 1rem;
    border-left: 1px solid rgba(48, 66, 84, 0.1);
  }

  .main-navigation .menu-item-has-children.open > .sub-menu {
    display: block;
  }

  .main-navigation .submenu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.8rem;
    height: 2.8rem;
    margin-left: 0.8rem;
    border: 1px solid rgba(48, 66, 84, 0.2);
    border-radius: 4px;
    background: transparent;
    color: #222344;
    cursor: pointer;
  }

  .main-navigation .submenu-toggle::before {
    content: "▾";
    display: block;
    transform: rotate(0deg);
    transition: transform 0.2s ease;
  }

  .main-navigation .menu-item-has-children.open > .submenu-toggle::before {
    transform: rotate(180deg);
  }
}

/* ================================================================================== 
8. Footer
===================================================================================== */

footer {
  background-color: #f4f1ec;
  padding: 6rem 0rem 4rem;
  color: #222344;
}

footer .container {
  max-width: 140rem;
  margin: 0 auto;
}

/* Footer Logo */
footer > a {
  display: block;
  margin-bottom: 4rem;
  text-decoration: none;
}

footer > a img {
  max-width: 20rem;
  height: auto;
}

/* Contact Information */
footer .contact-info {
  display: flex;
  flex-direction: column;
  gap: 0rem;
  margin-bottom: 2rem;
}

footer .contact-item {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  font-size: 1.4rem;
  line-height: 1.6;
}

footer .contact-item svg,
footer .contact-item img {
  width: 4rem;
  height: 4rem;
  flex-shrink: 0;
  object-fit: contain;
}

footer .contact-item a {
  color: #222344;
  text-decoration: none;
  transition: color 0.3s ease;
}

footer .contact-item a:hover {
  color: #222344;
}

/* Working Hours */
footer .working-hours {
  margin-bottom: 2rem;
}

footer .working-hours h3 {
  font-size: 3.6rem;
  font-weight: 400;
  color: #222344;
  margin-bottom: 2rem;
  font-family: "Playfair Display", serif;
}

footer .working-hours .hours-item {
  margin-bottom: 0.5rem;
}

footer .working-hours .day {
  font-size: 1.5rem;
  color: #c9a870;
  margin-bottom: 0.5rem;
}

footer .working-hours .time {
  font-size: 1.5rem;
  color: #222344;
}

/* Social Section */
footer .social-section {
  margin-bottom: 4rem;
}

footer .social-section h3 {
  font-size: 2.4rem;
  font-weight: 400;
  color: #222344;
  margin-bottom: 1.5rem;
  font-family: "Playfair Display", serif;
}

footer .social-links {
  display: flex;
  gap: 1.5rem;
  margin-bottom: 2rem;
  justify-content: start;
}

footer .social-links a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5rem;
  height: 5rem;
  border: 1px solid #c9a870;
  border-radius: 50%;
  transition: all 0.3s ease;
  text-decoration: none;
}

footer .social-links a:hover {
  background-color: #c9a870;
  border-color: #c9a870;
}

footer .social-links svg,
footer .social-links img {
  width: 2.4rem;
  height: 2.4rem;
  color: #c9a870;
}

footer .social-links a:hover svg,
footer .social-links a:hover img {
  color: #fff;
  filter: brightness(0) invert(1);
}

footer .social-description {
  font-size: 1.6rem;
  line-height: 1.6;
  color: #222344;
  max-width: 50rem;
  margin-bottom: 3rem;
}

/* Footer Image */
footer .footer-image {
  margin-bottom: 3rem;
  height: 50vh;
}

footer .footer-image img {
  width: 100%;
  height: 100%;
  max-width: 60rem;
  border-radius: 0.5rem;
  object-fit: cover;
}

/* Footer Bottom */
footer .footer-bottom {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2rem;
  padding-top: 3rem;
  border-top: 1px solid rgba(48, 66, 84, 0.1);
}

footer .footer-logo-bottom img {
  max-width: 18rem;
  height: auto;
}

footer .privacy-link {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  font-size: 1.4rem;
  color: #222344;
  text-decoration: none;
  transition: color 0.3s ease;
}

footer .privacy-link:hover {
  color: #222344;
}

footer .privacy-link svg {
  width: 1.6rem;
  height: 1.6rem;
}

/* Footer Navigation */
footer nav#primary {
  display: none;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */

  footer {
    text-align: center;
  }

  footer .contact-item {
    justify-content: center;
  }

  footer .social-description {
    width: 50%;
    margin-left: 25%;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  footer {
    padding: 8rem 2rem 6rem;
  }

  footer .footer-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0rem;
    align-items: start;
  }

  footer .footer-left {
    max-width: 60rem;
    text-align: left;
  }

  footer .footer-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }

  footer > a {
    margin-bottom: 5rem;
  }

  footer > a img {
    max-width: 25rem;
  }

  footer .contact-info {
    gap: 1rem;
    margin-bottom: 5rem;
    align-items: flex-start;
  }

  footer .working-hours {
    margin-bottom: 5rem;
  }

  footer .working-hours h3,
  footer .social-section h3 {
    font-size: 2.8rem;
  }

  footer .footer-image {
    text-align: right;
  }

  footer .footer-image img {
    max-width: 100%;
  }

  footer .footer-bottom {
    flex-direction: row;
    justify-content: space-between;
    padding-top: 4rem;
    margin-top: 6rem;
  }

  footer .social-description {
    width: 70%;
    margin-left: 0%;
  }

  footer .footer-image {
    height: 70vh;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
  footer .footer-image {
    height: 70vh;
  }
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  footer .footer-image {
    height: 50vh;
  }
}

/* ================================================================================== 
9. Kontakt - Hero Section
===================================================================================== */

.hero {
  background: linear-gradient(135deg, #131e3d 0%, #183f69 50%, #1b5a8f 100%);
  padding: 6rem 2rem;
  color: #fff;
  height: auto;
  display: flex;
  align-items: center;
}

.hero .container {
  max-width: 140rem;
  margin: 0 auto;
}

.hero-content {
  display: flex;
  flex-direction: column;
  gap: 4rem;
}

.hero-left,
.hero-right {
  width: 100%;
}

.center {
  text-align: center;
}

.kontakt-ht {
  font-size: 3rem;
  color: #cdad7d;
}

.kontakt-logo {
  height: auto;
  transform: scale(1.2);
}

.kontakt-cjenik-tekst {
  font-size: 1rem;
  line-height: 1.6;
  text-align: center;
  color: #cdad7d;
  width: 100%;
}
.form-jot-wrapper {
  /* width: 100%;
  overflow-y: scroll;
  overflow-x: hidden;
  max-height: 60vh; */
}

.form-jot-wrapper > iframe {
  width: 100%;
  height: auto;
  border: none;
  padding: 2rem;
  border-radius: 2rem;
}

.form-jot-wrapper input* {
  width: 100%;
}

.form-jot-wrapper::-webkit-scrollbar {
  width: 2px;
}

.form-section {
  padding: 1rem !important;
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  .hero {
    padding: 8rem 2rem;
  }

  .hero-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8rem;
    align-items: start;
  }

  .fr1 {
    grid-template-columns: 1fr;
  }

  .hero-left {
    max-width: 60rem;
  }

  .hero-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }

  .kontakt-ht {
    font-size: 3.6rem;
  }

  .kontakt-cjenik-tekst {
    font-size: 1.1rem;
    line-height: 1.6;
  }
}

/* ================================================================================== 
9. B2B - Hero Section
===================================================================================== */
.hero-b2b {
  background: #ffffff;
  display: contents;
}

.b2b-video-wrapper {
  position: absolute;
  width: 100%;
  height: auto;
  z-index: 0;
}

.b2b-video-wrapper video {
  width: 100%;
  max-height: 100%;
}

.b2b-logo {
  position: relative;
  height: auto;
  object-fit: contain;
  width: 15rem;
  left: -3rem;
}

.hero-ht {
  font-size: 2rem;
  color: #cdad7d;
  margin: 0;
}

.b2b-st {
  font-size: 1rem;
  margin: 0.5rem 0;
  font-family: "Libre Baskerville", serif;
}

.b2b-st p {
  font-size: 1rem;
  margin: 0.5rem 0;
  font-family: "Libre Baskerville", serif;
}

.b2b-hashtags {
  width: 50%;
}

.b2b-hashtags p {
  font-size: 1rem;
  color: #eeead6;
  font-weight: 700;
  padding: 0;
  margin: 0;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .b2b-logo {
    width: 32rem;
    left: -1rem;
  }
  .hero-ht {
    font-size: 4.6rem;
    margin: 0 0 1rem 5rem;
  }
  .b2b-st {
    font-size: 1.8rem;
    margin: 0.5rem 5rem;
  }

  .b2b-hashtags {
    margin-top: 4rem;
  }

  .b2b-hashtags p {
    font-size: 1.6rem;
    margin: 0;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  .hero-b2b {
    padding: 0;
  }

  .b2b-video-wrapper video {
    width: 100%;
    height: 100vh;
  }

  .b2b-hero-left {
    max-width: 105rem;
    padding-left: 8rem;
  }

  .b2b-logo {
    position: relative;
    height: auto;
    object-fit: contain;
    width: 54rem;
    left: -10rem;
  }

  .hero-ht {
    font-size: 7rem;
    margin: 0;
  }

  .b2b-st {
    font-size: 2.2rem;
    margin: 4rem 0;
    font-weight: 700;
  }

  .b2b-hashtags {
    width: 50%;
  }

  .b2b-hashtags p {
    font-size: 2.6rem;
    padding: 0;
    margin: 0;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */

  .hero-b2b {
    padding: 0;
  }

  .b2b-video-wrapper video {
    width: 100%;
    height: 70vh;
  }

  .b2b-hero-left {
    max-width: 75rem;
    padding-left: 10rem;
  }

  .b2b-logo {
    position: relative;
    height: auto;
    object-fit: contain;
    width: 50rem;
    left: -10rem;
  }

  .hero-ht {
    font-size: 6rem;
  }

  .b2b-st {
    font-size: 2.3rem;
    font-weight: 700;
    margin: 6rem 0;
  }

  .b2b-hashtags {
    width: 80%;
  }

  .b2b-hashtags p {
    font-size: 2.6rem;
    padding: 0;
    margin: 0;
  }
}

/* ================================================================================== 
10. B2B Why Choose Section
===================================================================================== */
.container-small {
  max-width: 120rem;
  margin: 0 auto;
}

.b2b-why-section {
  padding: 6rem 0rem;
  background-color: #f4f1ec;
}

.b2b-why-section-top-margin {
  margin-top: 0rem;
}

.b2b-content-layout {
  display: flex;
  flex-direction: column;
  gap: 4rem;
  align-items: center;
}

.b2b-content-layout__centered {
  align-items: center;
  justify-content: center;
}

.b2b-content-layout__centered .b2b-content p {
  text-align: center;
}

.b2b-content-layout {
  gap: 1rem;
}

.b2b-content-left,
.b2b-content-right {
  width: 100%;
}

.b2b-right-2 h2,
.b2b-right-2 p {
  width: 100%;
  margin-left: 0%;
  text-align: center;
}

.b2b-content-right ul {
  margin-bottom: 30px;
}
.b2b-content-right ul li {
  color: #fff;
}

.b2b-section-title {
  font-size: 3.7rem;
  font-weight: 400;
  line-height: 1.2;
  margin-bottom: 2rem;
  color: #222344;
}

.b2b-section-title sub {
  font-size: 0.6em;
  vertical-align: baseline;
  position: relative;
  bottom: -0.3em;
}

.b2b-text {
  font-size: 1.8rem;
  text-align: left;
  line-height: 1.5;
  color: #222344;
  margin-bottom: 1.5rem;
}

.b2b-text strong {
  font-weight: 800;
}

.b2b-image {
  width: 100%;
  height: 60vh;
  object-fit: cover;
  object-position: 27% 20%;
}

.b2b-image-bigger {
  height: 70vh;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .b2b-text {
    text-align: center;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  .b2b-why-section {
    padding: 8rem 2rem;
    background-color: #f4f1ec;
  }

  .b2b-why-section-top-margin {
    margin-top: 4rem;
  }

  .b2b-content-layout {
    flex-direction: row;
    gap: 15rem;
  }

  .b2b-content-layout {
    gap: 12rem;
  }

  .b2b-text {
    text-align: left;
    font-size: 2rem;
  }

  .b2b-right-2 h2,
  .b2b-right-2 p {
    margin-left: 0%;
    text-align: center;
  }

  .b2b-right-2 h2 {
    margin-left: 0%;
    width: 100%;
    text-align: center;
  }

  .b2b-section-title {
    font-size: 4.6rem;
    line-height: 1.2;
    margin-bottom: 4rem;
  }

  .b2b-image {
    width: 100%;
    height: 80vh;
    object-fit: cover;
    object-position: 27% 20%;
  }

  .b2b-image-bigger {
    height: 80vh;
  }

  .b2b-image-bigger-XL {
    height: 135vh;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */

  .b2b-why-section-top-margin {
    margin-top: 12rem;
  }

  .b2b-image-bigger-XL {
    height: 115vh;
  }
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */

  .b2b-image {
    width: 100%;
    height: 60vh;
  }

  .b2b-image-bigger {
    height: 80vh;
  }
}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
  .b2b-image-bigger-XL {
    height: 100vh;
  }
}

/* ================================================================================== 
10. B2B Programs Section
===================================================================================== */

.b2b-programs-section {
  padding: 8rem 2rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #cdad7d;
}

.b2b-programs-title {
  font-size: 4rem;
  font-weight: 400;
  text-align: center;
  margin-bottom: 0;
}

.b2b-programs-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 3rem;
  max-width: 140rem;
  margin: 0 auto;
  text-align: center;
  margin-bottom: 4rem;
}

.b2b-program-card > div {
  background-color: transparent;
  border: 4px solid #cdad7d;
  padding: 3rem 2.5rem;
  text-align: center;
  transition: all 0.3s ease;
  color: #ffffff;
  height: 30rem;
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: center;
  width: 80%;
  margin-left: 10%;
}

.b2b-program-card > h3 {
  font-size: 2.1rem;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 1rem;
  min-height: 7rem;
}

.b2b-program-card > div > p {
  font-size: 1.6rem;

  line-height: 1.6;
  margin-bottom: 0;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .b2b-programs-section {
    padding: 8rem;
  }

  .b2b-programs-grid {
    grid-template-columns: 1fr 1fr;
    gap: 3rem;
  }

  .b2b-program-card > div {
    width: 100%;
    margin-left: 0%;
  }

  .b2b-programs-title {
    font-size: 5rem;
  }

  .b2b-program-card > h3 {
    font-size: 2.4rem;
  }

  .b2b-program-card > div > p {
    font-size: 1.8rem;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  .b2b-programs-title {
    font-size: 5rem;
    text-align: center;
    margin-bottom: 5rem;
  }

  .b2b-program-card > div {
    height: 34rem;
    width: 100%;
    margin-left: 0%;
  }

  .b2b-program-card > h3 {
    font-size: 2.4rem;
    margin-bottom: 2rem;
    min-height: 7rem;
  }

  .b2b-program-card > div > p {
    font-size: 1.8rem;
  }
}
/* ================================================================================== 
10. B2B Differentiators Section
===================================================================================== */

.b2b-differentiators-section {
  padding: 10rem 0rem 0rem 0rem;
}

.b2b-differentiators-section > .container {
  max-width: 120rem;
}

.b2b-diff-title {
  font-size: 3.4rem;
  font-weight: 400;
  line-height: 1.3;
  margin-bottom: 4rem;
  color: #222344;
}

.b2b-diff-title sub {
  font-size: 0.6em;
  vertical-align: baseline;
  position: relative;
  bottom: -0.3em;
}

.b2b-diff-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin: 0 auto;
}

.b2b-diff-card {
  padding: 4rem 5rem;
  text-align: left;
}

.b2b-diff-card:nth-child(1) {
  background-color: #e8d1ae;
}

.b2b-diff-card:nth-child(2) {
  background-color: #dbbf94;
}

.b2b-diff-card:nth-child(3) {
  background-color: #cdad7d;
}

.b2b-diff-card > h3 {
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 1;
  margin-bottom: 1.5rem;
}

.b2b-diff-card > p {
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 1.6;
  margin-bottom: 0;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .b2b-differentiators-section {
    padding: 10rem 4rem;
  }

  .b2b-diff-title {
    font-size: 4rem;
    font-weight: 400;
    line-height: 1.3;
    margin-bottom: 4rem;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */

  .b2b-differentiators-section {
    padding: 8rem 2rem 0rem 2rem;
  }

  .b2b-diff-grid {
    gap: 0rem;
  }

  .b2b-diff-title {
    font-size: 4rem;
    margin-bottom: 10rem;
  }

  .b2b-diff-card > h3 {
    font-size: 2.4rem;
    margin-bottom: 1.5rem;
  }

  .b2b-diff-card > p {
    line-height: 1.8;
  }
}
/* ================================================================================== 
10. CTA Section
===================================================================================== */
.cta-section {
  padding: 8rem 2rem 0rem 2rem;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  min-height: 60vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.cta-content {
  max-width: 120rem;
  margin: 0 auto;
  text-align: center;
}

.cta-image {
  display: none;
}

.cta-button-wrapper {
  display: flex;
  justify-content: center;
}

.cta-button {
  font-size: 2rem;
  text-transform: uppercase;
  padding: 1.4rem 5rem;
}

/* Desktop Responsive Styles */
@media only screen and (min-width: 48.0625em) {
  /* 769px */

  .b2b-hero-hashtags {
    flex-direction: row;
    justify-content: center;
    gap: 2rem;
  }

  .b2b-content-layout.b2b-reverse {
    flex-direction: row-reverse;
  }

  .b2b-content-left,
  .b2b-content-right {
    width: 50%;
  }

  .b2b-programs-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 3rem;
  }

  .b2b-diff-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 0rem;
  }
}

@media only screen and (min-width: 64em) {
  /* 1024px */

  .cta-button {
    font-size: 2.4rem;
    text-transform: uppercase;
    padding: 1.4rem 5rem;
  }

  .b2b-hero {
    padding: 12rem 2rem;
  }

  .b2b-programs-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================================== 
10. NOVI PAGE: amabilia-o2iv
===================================================================================== */

.fullwidth-video-wrapper {
  width: 100%; /* full viewport width */
  margin-left: 50%; /* move start to center */
  transform: translateX(-50%); /* pull it back to align with viewport */
}

.fullwidth-video-wrapper video {
  display: block;
  width: 100%; /* fill the wrapper (which is now 100vw) */
  height: 85vh; /* 70% of viewport height */
  object-fit: cover; /* crop instead of letterboxing */
}

.o2iv-hero-container {
  min-height: 85vh;
}

.o2iv-hero-container > div > div > img {
  width: 100%;
  left: 0rem;
}

.o2iv-hero-container > div > div > .hero-ht {
  font-size: 6rem;
}

.o2iv-hero-container > div > div > .b2b-st {
  font-size: 6rem;
  font-size: 2rem;
  text-align: center;
}

.neuro-st {
  font-size: 1.6rem !important;
}

.o2iv-hero-container > div > div > .b2b-hashtags {
  width: 100%;
}

.o2iv-hero-container > div > div > .b2b-hashtags p {
  font-size: 2.6rem;
}

.o2iv-text {
  font-size: 1.8rem;
  text-align: center;
}

.o2iv-image-2 {
  height: 60vh;
}

.o2iv-profile-section {
  background-image: linear-gradient(
      rgba(34, 35, 68, 0.85),
      rgba(34, 35, 68, 0.85)
    ),
    url("images/o2iv-image-3.jpg");
}

.o2iv-cta-section {
  background-image: none;
  align-items: flex-start;
  margin-bottom: 0;
}

.o2iv-cta-content {
  background-color: rgba(218, 215, 203, 0.6);
  padding: 1rem;
  margin-top: -6rem;
  border-radius: 2rem;
}

.o2iv-cta-content h3 {
  font-size: 2.2rem;
}

.o-nama-zasto-section {
  display: block;
  padding: 0;
  min-height: 0;
  overflow: hidden;
  margin-bottom: 0px !important;
}

.o-nama-zasto-section img {
  display: block;
  width: 100%;
  height: 700px;
  object-fit: cover;
}

.o-nama-zasto-section .o2iv-video-wrapper {
  position: relative;
}

.o-nama-zasto-section .container {
  position: absolute;
  top: 40px;
  left: 0;
  right: 0;
}

.o-nama-zasto-section .o2iv-cta-content {
  margin-top: 0;
}

.o2iv-video-wrapper video {
  width: 100%; /* fill the wrapper (which is now 100vw) */
  height: 100vh; /* 70% of viewport height */
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .fullwidth-video-wrapper video {
    height: 65vh; /* 70% of viewport height */
  }

  .o2iv-hero-container {
    min-height: 65vh;
  }

  .o2iv-hero-container > div > div > img {
    width: 60%;
    left: 0rem;
  }

  .o2iv-hero-container > div > div > .hero-ht {
    font-size: 7rem;
  }

  .o2iv-hero-container > div > div > .b2b-st {
    font-size: 2.8rem;
    text-align: left;
  }

  .o2iv-hero-container > div > div > .b2b-hashtags {
    width: 75%;
  }

  .o2iv-hero-container > div > div > .b2b-hashtags p {
    font-size: 3.4rem;
  }

  .o2iv-text {
    font-size: 2rem;
    text-align: center;
    width: 80%;
    margin-left: 10%;
  }

  .b2b-right-2 p {
    width: 80%;
    margin-left: 10%;
    text-align: center;
    font-size: 2rem;
  }

  .o2iv-cta-section {
    margin-bottom: 0vh;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .fullwidth-video-wrapper video {
    height: 100vh; /* 70% of viewport height */
  }

  .o2iv-hero-container {
    min-height: 100vh;
  }

  .o2iv-hero-container > div > div > img {
    left: -10rem;
  }

  .o2iv-hero-container > div > div > .b2b-hashtags {
    width: 60%;
  }

  .b2b-why-section-top-margin {
    margin-top: 0rem;
  }

  .margin-top-small {
    margin-top: 8rem;
  }

  .minus-margin-top {
    margin-top: -8rem;
    padding-top: 8.3rem;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
  .o2iv-cta-section {
    margin-bottom: 8rem;
  }
   .fullwidth-video-wrapper video {
    height: 75vh; /* 70% of viewport height */
  }

}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  .fullwidth-video-wrapper video {
    height: 75vh; /* 70% of viewport height */
  }

  .o2iv-hero-container {
    min-height: 70vh;
  }

  .o2iv-image-2 {
    height: 60vh;
  }

  .o2iv-hero-container > div > div > .b2b-hashtags {
    width: 90%;
  }

  .o2iv-profile-section {
    background-image: linear-gradient(
        rgba(34, 35, 68, 0.85),
        rgba(34, 35, 68, 0.85)
      ),
      url("images/o2iv-image-3.jpg");
  }

  .o2iv-cta-section {
    background-image: none;
    align-items: flex-start;
  }

  .o2iv-cta-content {
    background-color: rgba(218, 215, 203, 0.6);
    padding: 1rem;
    margin-top: -6rem;
    border-radius: 2rem;
  }

  .o2iv-cta-content h3 {
    font-size: 2.45rem;
  }

}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
  .fullwidth-video-wrapper video {
    height: 70vh; /* 70% of viewport height */
  }
}

/* ================================================================================== 
NEUROLOGIJA 
===================================================================================== */
.neurologija-cta-section {
}

.neurologija-ht {
  font-size: 4rem !important;
  margin-bottom: 2rem;
}

.blue-bg-section {
  background: linear-gradient(135deg, #131e3d 0%, #183f69 50%, #1b5a8f 100%);
}

.blue-bg-section h2,
.blue-bg-section p {
  color: #cdad7d;
}

.neurologija-image-bg h2,
.neurologija-image-bg h3,
.neurologija-image-bg ul {
  color: #cdad7d;
}

.b2b-small-gap {
  gap: 0rem;
}

.p-ispod-slike {
  text-align: center;
}

.neurologija-lista {
  list-style: none;
  font-size: 2.8rem;
  text-align: center;
  padding-left: 0rem;
}

.neurologija-lista li::before {
  content: "- ";
}

.neurologija-image-bg {
  object-fit: cover;
  background-size: cover;
  background-position: center;
  height: 80vh;
}

.neurologija-video {
  height: 95vh;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .neurologija-image-bg {
    background-image: linear-gradient(rgba(0, 0, 0, 0.25), rgba(0, 0, 0, 0.25)),
      url("images/neurologija-img-2.jpg");
    height: 70vh;
  }

  .neurologija-lista {
    font-size: 3.4rem;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .neurologija-ht {
    font-size: 5rem !important;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  .b2b-st {
    font-size: 2rem !important;
    margin: 2rem 0;
  }
}
/* ================================================================================== 
ORTOPEDIJA 
===================================================================================== */
.ortopedija-cta-section {
}

.big-hero-left {
  max-width: 100rem;
}

.ortopedija-st {
  width: 100%;
  font-size: 1.4rem;
}

.ortopedija-image-bg {
  object-fit: cover;
  background-size: cover;
  background-position: center;
  height: auto;
}

.ortopedija-image-bg .b2b-content-left {
  width: 100%;
}

.ortopedija-image-bg h2 {
  color: #cdad7d;
}

.ortopedija-image-bg p {
  color: #ffffff;
}

.ortopedija-3-image {
  width: 90%;
  height: auto;
  object-fit: contain;
  object-position: 27% 20%;
  transform: rotate(325deg);
  margin-bottom: 8rem;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .ortopedija-st {
    text-align: left;
    width: 60%;
  }
  .ortopedija .b2b-hashtags {
    width: 65%;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .ortopedija-st {
    text-align: center;
    width: 87%;
  }
  .ortopedija-margin-top {
    margin-top: 8.8rem;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */

  .ortopedija .hero-ht {
    font-size: 6rem;
  }

  .ortopedija-st {
    text-align: left;
    width: 87%;
  }
  .ortopedija .b2b-hashtags {
    width: 60%;
  }
  .ortopedija-video {
    height: 90vh !important;
  }
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  .ortopedija-video {
    height: 70vh !important;
  }
}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
  .ortopedija-video {
    height: 70.3vh !important;
  }
}

/* ================================================================================== 
POČETNA 
===================================================================================== */
.pocetna-section {
  background-image: linear-gradient(
      rgba(34, 35, 68, 0.85),
      rgba(34, 35, 68, 0.85)
    ),
    url("images/pocetna-slika-3.jpg");
}

.pocetna-ht {
  font-size: 8rem;
  font-weight: 400;
  line-height: 1.2;
  color: #131e3d;
  margin-bottom: 4rem;
}

.pocetna-razlika-section {
  padding: 2rem 0rem;
}

.pocetna-razlika-section .b2b-diff-card:nth-child(1) {
  background-color: #efdec5;
}

.pocetna-razlika-section .b2b-diff-card:nth-child(2) {
  background-color: #e8d1ae;
}

.pocetna-razlika-section .b2b-diff-card:nth-child(3) {
  background-color: #dbbf94;
}

.pocetna-razlika-section .b2b-diff-card:nth-child(4) {
  background-color: #cdad7d;
}

.pocetna-razlika-section .b2b-diff-card-text {
  margin-bottom: 2rem;
}

.pocetna-razlika-section .b2b-diff-card {
  text-align: center;
  height: 40rem;
}

.usluge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.usluga {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-around;
  padding-bottom: 4rem;
}

.usluga img {
  width: auto;
  height: 7rem;
}

.usluga a {
  font-weight: 700;
  font-size: 2rem;
}

.iskustva-subtitle {
  font-size: 2.2rem;
  font-weight: 400;
  margin-bottom: 4rem;
  text-align: center;
  margin: 2rem auto;
}

.pocetna-section .b2b-program-card > div {
  height: auto;
  width: 100%;
  margin: 0;
}

.pocetna-section-zasto .btn {
  margin-bottom: 4rem;
}

.pocetna-usluge-section .b2b-content-layout {
  gap: 4rem;
}

.pocetna-section .b2b-program-card h3 {
  color: #cdad7d;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .hero-button-wrapper {
    padding-left: 10rem;
  }

  .pocetna-ht {
    padding-left: 4rem;
  }

  .pocetna-section-zasto .b2b-section-title {
    text-align: center;
  }

  .pocetna-razlika-section .b2b-diff-title {
    font-size: 3.9rem;
  }

  .pocetna-razlika-section .b2b-diff-card {
    height: auto;
  }

  .pocetna-razlika-section .b2b-diff-grid {
    grid-template-columns: 1fr 1fr;
  }

  .usluga {
    justify-content: space-evenly;
  }

  .usluga img {
    height: 10rem;
  }

  .usluga a {
    font-size: 2.6rem;
  }

  .iskustva-subtitle {
    margin: 4rem auto;
  }

  .pocetna-section .b2b-programs-grid {
    grid-template-columns: 1fr;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .hero-button-wrapper {
    padding-left: 3rem;
  }
  .pocetna-ht {
    padding-left: 3rem;
  }

  .pocetna-razlika-section .b2b-diff-grid {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    width: 119%;
    margin-left: -10%;
  }

  .pocetna-razlika-section .b2b-diff-card {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
  }

  .usluga {
    justify-content: center;
    padding-bottom: 3rem;
  }

  .usluga img {
    height: 7rem;
    padding-right: 3rem;
  }

  .usluga a {
    font-size: 2rem;
  }

  .pocetna-section .b2b-programs-grid {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .pocetna-section .b2b-program-card > div {
    min-height: 70vh;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  .pocetna-ht {
    padding-left: 0;
    margin-left: -2rem;
  }
  .hero-button-wrapper {
    padding-left: 0rem;
    margin-left: -2rem;
  }

  .pocetna-section .b2b-program-card > div {
    min-height: 50vh;
  }
}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
}

/* ================================================================================== 
HIPERBARIČNA OKSIGENACIJA 
===================================================================================== */
.ho-hero .b2b-hashtags > p {
  color: #cdad7d;
}

.ho-st {
  color: #efdec5;
  font-weight: bold;
  line-height: 1;
  margin-bottom: 2rem;
}

.ho-stres-section {
  background-image: url("images/ho-slika-1.jpg");
  object-fit: cover;
  background-size: cover;
  background-position: center;
  height: auto;
}

.no-top-padding {
  padding-top: 0;
}

.ho-stres-section h2,
.ho-stres-section p {
  color: #131e3d;
}

.zasto-odabrati-amabiliu-section {
  background-image: linear-gradient(
      rgba(34, 35, 68, 0.85),
      rgba(34, 35, 68, 0.85)
    ),
    url("images/ho-slika-3.jpg");
}

.ho-text {
  margin-bottom: 3rem;
}

.ho-cta-section {
  margin-bottom: 0;
  padding-bottom: 0;
  min-height: 100vh;
  color: #cdad7d;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 4rem;
}

.ho-cta-section .container {
  padding: 0;
}

.ho-cta-section .cta-content {
  background-color: #131e3d;
  margin: 0;
}

.ho-cta-section h3 {
  font-family: "Inter", sans-serif;
  font-size: 1.8rem;
  font-weight: 400;
  padding: 1rem;
}

.ho-section video {
  height: 100vh;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .ho-stres-section {
    height: 60vh;
  }

  .ho-blue-section .b2b-section-title {
    text-align: center;
  }

  .ho-cta-section h3 {
    font-size: 2.8rem;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .ho-stres-section {
    height: auto;
  }

  .ho-blue-section {
    padding-top: 4rem;
  }

  .ho-cta-section {
    align-items: flex-start;
    width: 60%;
  }

  .ho-cta-section h3 {
    font-size: 2.4rem;
  }

  .ho-hashtags {
    margin-top: 2rem;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */

  .ho-why-section {
    margin-top: 0;
  }
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
  .ho-section video {
    height: 80vh;
  }
  .ho-cta-section,
  .ho-section {
    height: 80vh;
    min-height: 80vh;
  }

  .ho-cta-section {
    color: #cdad7d;
    max-width: 140rem;
    margin: 0 auto;
  }

  .ho-cta-section .cta-content {
    width: 70%;
  }
}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
  .ho-stres-section {
    height: 80vh;
  }
}

/* ================================================================================== 
longevity 
===================================================================================== */
.long-hero video {
  background: linear-gradient(rgba(0, 0, 0, 1), rgba(0, 0, 0, 1));
}

.longevity-hero-left {
  max-width: 100%;
  padding: 0px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
}
.hero-flex {
  display: flex;
  align-items: center;
  justify-content: space-between;
  text-align: center;
  flex-direction: column;
}

.hero-flex img {
  left: 0rem;
}

.longevity-hero-text {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 4rem;
}

.longevity-hero-text p {
  text-align: center;
  font-size: 1.6rem;
  margin-bottom: 4rem;
}

.longevity-hashtags {
  width: 100%;
  text-align: center;
}

.longevity-hashtags p {
  font-size: 2rem;
}

.longevity-image-bg {
  object-fit: cover;
  background-size: cover;
  background-position: center;
  height: auto;
}

.longevity-content-layout {
  flex-direction: row-reverse;
}

.longevity-content-layout h2 {
  text-align: left;
  color: #cdad7d;
}

.longevity-cta-section {
  padding-bottom: 4rem;
}

.longevity-cta-section h2 {
  text-align: left;
  color: #cdad7d;
}

.longevity-cta-section p {
  text-align: left;
  color: #ffffff;
  margin-bottom: 4rem;
}

.longevity-cta-section .b2b-content-layout__centered p {
  text-align: center;
}

.longevity-cta-button-wrapper {
  justify-content: center;
}
.vitaminske-cta-wrapper {
  justify-content: flex-end;
}


.longevity-why-content-layout {
  gap: 40px;
}

.reverse {
  flex-direction: column-reverse;
}

.longevity-why-content-layout h2,
.longevity-why-content-layout h3 {
  color: #cdad7d;
}

.longevity-why-content-right p {
  width: 100%;
  margin-left: 0px;
  text-align: left;
}

.longevity-video-why {
  object-position: unset;
}

.longevity-small-gap {
  gap: 40px;
}

/* TABLET */
@media only screen and (min-width: 48em) {
  /* 768px  */
  .longevity-image-bg {
    height: 60vh;
  }
  .longevity-image-bg p,
  .longevity-cta-section p {
    font-size: 1.8rem;
  }

  .longevity-cta-section {
    min-height: 60vh;
    padding-bottom: 8rem;
  }

  .longevity-hero-text {
    font-size: 2rem;
    width: 80%;
    margin-bottom: 4rem;
  }

  .hero-flex-down {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}

/* Desktop Layout */
@media only screen and (min-width: 64em) {
  /* 1024px */
  .hero-flex {
    flex-direction: row-reverse;
  }

  .longevity-why-section .b2b-image-bigger {
    height: 100vh;
  }

  .longevity-video-why {
    height: 100vh;
  }

  .longevity-why-content-right p {
    font-size: 1.8rem;
  }

  .longevity-why-content-right .cta-content {
    margin-top: 4rem;
  }

  .longevity-image-bg {
    height: auto;
  }

  .longevity-content-layout {
    flex-direction: row;
  }

  .reverse {
    flex-direction: row;
  }
}

/* Desktop Layout L */
@media only screen and (min-width: 80em) {
  /* 1280px */
}

/* Desktop Layout XL */
@media only screen and (min-width: 91em) {
  /* 1440px+ */
}

/* Desktop Layout XXL */
/* 1920px+ */
@media only screen and (min-width: 120em) {
  .longevity-why-section .b2b-image-bigger {
    height: 80vh;
  }

  .longevity-video-why {
    height: 80vh;
  }
}

/* FORM CF7 */
/* FORM CF7 */
/* Wrapper */
.amabilia-form {
  background: #ffffff;
  border-radius: 24px;
  padding: 4rem;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
  color: #2c3345;
  font-size: 16px;
}

.amabilia-form-row {
  margin-bottom: 15px;
}

.amabilia-group-label {
  display: block;
  font-weight: 600;
  margin-bottom: 8px;
  color: #2c3345;
}

.required {
  color: #e53935;
}

/* Dvije kolone (ime/prezime, tel) */
.amabilia-two-cols {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

@media (max-width: 640px) {
  .amabilia-two-cols {
    grid-template-columns: 1fr;
  }

  .amabilia-form {
  padding: 1.7rem;
}
}

.amabilia-form-group {
  position: relative;
}

.amabilia-sub-label {
  display: block;
  margin-top: 6px;
  font-size: 13px;
  color: #7b8195;
}

/* Polja input/textarea */
.amabilia-form .wpcf7-form-control.wpcf7-text,
.amabilia-form .wpcf7-form-control.wpcf7-email,
.amabilia-form .wpcf7-form-control.wpcf7-tel,
.amabilia-form .wpcf7-form-control.wpcf7-date,
.amabilia-form .wpcf7-form-control.wpcf7-textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 10px 12px;
  border-radius: 6px;
  border: 1px solid #2c3345;
  background: #ffffff;
  color: #2c3345;
  font-size: 16px;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.amabilia-form .wpcf7-form-control.wpcf7-textarea {
  min-height: 110px;
  resize: vertical;
}

.amabilia-form .wpcf7-form-control:focus {
  border-color: #0a1551;
  box-shadow: 0 0 0 2px rgba(10, 21, 81, 0.15);
}

/* Email ikonica u polju */
.amabilia-has-icon {
  position: relative;
}

.amabilia-has-icon .wpcf7-form-control {
  padding-left: 44px;
}

.amabilia-icon-mail {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: #2c3345;
  pointer-events: none;
}

.amabilia-icon-mail::before {
  content: "";
  position: absolute;
  inset: 4px;
  border-radius: 2px;
  border: 2px solid #ffffff;
  border-top: none;
  box-sizing: border-box;
}

/* Helper tekst za timezone */
.amabilia-form-helper {
  font-size: 13px;
  color: #7b8195;
  margin: 4px 0 8px;
}

/* Time slotovi kao gumbi – checkbox* exclusive */
.amabilia-time-grid .wpcf7-checkbox {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 16px;
}

@media (min-width: 768px) {
  .amabilia-time-grid .wpcf7-checkbox {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.amabilia-time-grid .wpcf7-list-item {
  margin: 0;
}

/* label samo služi kao klik zona */
.amabilia-time-grid .wpcf7-list-item label {
  display: block;
  cursor: pointer;
}

/* OVO je pravi “gumb” */
.amabilia-time-grid .wpcf7-list-item .wpcf7-list-item-label {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 12px 16px;
  border-radius: 6px;
  border: 1px solid #2c3345;
  background: #ffffff;
  font-weight: 600;
  color: #2c3345;
  font-size: 14px;
  transition: border-color 0.15s ease, background 0.15s ease, color 0.15s ease,
    box-shadow 0.15s ease, transform 0.15s ease;
}

/* hover efekt */
.amabilia-time-grid .wpcf7-list-item label:hover .wpcf7-list-item-label {
  border-color: #0a1551;
  box-shadow: 0 0 0 2px rgba(10, 21, 81, 0.12);
  transform: translateY(-1px);
}

/* sakrij checkbox input – label glumi gumb */
.amabilia-time-grid .wpcf7-list-item input[type="checkbox"] {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

/* aktivni slot (checked) – cijeli gumb ispunjen */
.amabilia-time-grid
  .wpcf7-list-item
  input[type="checkbox"]:checked
  + .wpcf7-list-item-label {
  border-color: #0a1551;
  background: linear-gradient(90deg, #253692, #0a1551);
  color: #ffffff;
  box-shadow: 0 8px 18px rgba(10, 21, 81, 0.25);
}

/* Submit gumb */
.amabilia-submit-row {
  margin-top: 16px;
}

.amabilia-form .wpcf7-submit {
  border: 1px solid #0a1551;
  background: linear-gradient(90deg, #253692, #0a1551);
  color: #ffffff;
  padding: 12px 32px;
  border-radius: 999px;
  font-weight: 600;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(10, 21, 81, 0.3);
  transition: transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
}

.amabilia-form .wpcf7-submit:hover {
  opacity: 0.93;
  transform: translateY(-1px);
  box-shadow: 0 10px 24px rgba(10, 21, 81, 0.35);
}

.amabilia-form .wpcf7-submit:disabled {
  opacity: 0.6;
  cursor: not-allowed;
  box-shadow: none;
}

.single-novosti{
  padding: 40px 0;
}

.single-novosti .entry-thumbnail img{
  /* width: 100%; */
  height: auto;
}

/* Archive novosti */

.novosti-archive {
  display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding-top: 60px;
    gap:20px;
}

@media screen and (max-width: 800px) { 
    .novosti-archive {
    grid-template-columns: repeat(2, 1fr);
}
}

@media screen and (max-width: 480px) { 
    .novosti-archive {
    grid-template-columns: repeat(1, 1fr);
}
}

.novosti-thumb img {
  display: block;
    margin-bottom: 20px;
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* Single Novost table styles */
.single-novost table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid #e5e7eb; /* subtle border */
  background-color: #fff;
}

.single-novost table td,
.single-novost table th {
  padding: 12px 14px;
  border-top: 1px solid #e5e7eb; /* inner separators */
  text-align: left;
  vertical-align: top;
}

/* First row acts like a header in provided markup */
.single-novost table tr:first-child td,
.single-novost table tr:first-child th {
  background-color: #f9fafb;
  font-weight: 600;
}

/* Light zebra striping for readability (excluding header row) */
.single-novost table tr:nth-child(even):not(:first-child) {
  background-color: #fbfbfc;
}

.menu-item-has-children {
  display: flex;
  justify-content: space-between;
  align-items: center;
}


@media (min-width:1152px) and (max-width:1320px) {
  #primary-menu > li {
      padding: 12px 12px;
    }
}

@media (min-width:1052px) and (max-width:1151px) {
  #primary-menu > li {
      padding: 12px 6px;
    }
}
    
.page-template-template-hiperbaricna-oksigenacija h3 {
  color: #cdad7d;
}

/* ==================================================================================
O NAMA PAGE
===================================================================================== */

/* Uvodni tekst + Medicina koja vidi širu sliku — fullwidth tekstualne sekcije */
.o-nama-text-fullwidth-section .b2b-content-layout {
  justify-content: center;
}

.o-nama-text-fullwidth-section .o-nama-text-fullwidth-content {
  width: 100%;
  max-width: 100%;
  text-align: center;
}

.o-nama-text-fullwidth-section .b2b-text,
.o-nama-text-fullwidth-section p {
  text-align: center;
}

/* Područja našeg rada — 5 kolona na desktopu, scoped samo na O nama */
@media only screen and (min-width: 64em) {
  .o-nama-podrucja-section .b2b-programs-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 2rem;
  }

  .o-nama-podrucja-section .b2b-program-card > div {
    min-height: 38rem;
    height: auto;
    padding: 2.5rem 2rem;
  }

  .o-nama-podrucja-section .b2b-program-card > div,
  .o-nama-podrucja-section .b2b-program-card > div p {
    font-size: 1.35rem;
    line-height: 1.5;
  }

  .o-nama-podrucja-section .b2b-program-card > h3 {
    font-size: 2rem;
    min-height: 8rem;
  }
}

.doktor-text,
.zglobovi-text {

  text-align: left;
  margin-left: 0px;
  width: 100%;
}

.doktor-titula {
  text-align: center;
}

.b2b-why-section-repeater:nth-child(odd) .b2b-content-layout-repeater {
  flex-direction: row-reverse;
}

@media (max-width: 768px) {

  .b2b-why-section-repeater:nth-child(odd) .b2b-content-layout-repeater {
    flex-direction: column;
  }

  .b2b-program-card > div {
    height: auto;
  }

}