/*!*****************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/normalize.css ***!
  \*****************************************************************************************************************/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

 html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }
  
  /* Sections
     ========================================================================== */
  
  /**
   * Remove the margin in all browsers.
   */
  
  body {
    margin: 0;
  }
  
  /**
   * Render the `main` element consistently in IE.
   */
  
  main {
    display: block;
  }
  
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  
  /* Grouping content
     ========================================================================== */
  
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
  
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /* Text-level semantics
     ========================================================================== */
  
  /**
   * Remove the gray background on active links in IE 10.
   */
  
  a {
    background-color: transparent;
  }
  
  /**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
  
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  
  b,
  strong {
    font-weight: bolder;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /**
   * Add the correct font size in all browsers.
   */
  
  small {
    font-size: 80%;
  }
  
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  
  sub {
    bottom: -0.25em;
  }
  
  sup {
    top: -0.5em;
  }
  
  /* Embedded content
     ========================================================================== */
  
  /**
   * Remove the border on images inside links in IE 10.
   */
  
  img {
    border-style: none;
  }
  
  /* Forms
     ========================================================================== */
  
  /**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
  
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  
  /**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
  
  button,
  input { /* 1 */
    overflow: visible;
  }
  
  /**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  
  button,
  select { /* 1 */
    text-transform: none;
  }
  
  /**
   * Correct the inability to style clickable types in iOS and Safari.
   */
  
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  
  /**
   * Remove the inner border and padding in Firefox.
   */
  
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  
  /**
   * Restore the focus styles unset by the previous rule.
   */
  
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  
  /**
   * Correct the padding in Firefox.
   */
  
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  
  /**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
  
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  
  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  
  progress {
    vertical-align: baseline;
  }
  
  /**
   * Remove the default vertical scrollbar in IE 10+.
   */
  
  textarea {
    overflow: auto;
  }
  
  /**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */
  
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  
  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */
  
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  
  /* Interactive
     ========================================================================== */
  
  /*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */
  
  details {
    display: block;
  }
  
  /*
   * Add the correct display in all browsers.
   */
  
  summary {
    display: list-item;
  }
  
  /* Misc
     ========================================================================== */
  
  /**
   * Add the correct display in IE 10+.
   */
  
  template {
    display: none;
  }
  
  /**
   * Add the correct display in IE 10.
   */
  
  [hidden] {
    display: none;
  }
/*!************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/base.css ***!
  \************************************************************************************************************/
/*-----------------------------------*\
* BASIC SETTINGS OF THE PAGE
\*-----------------------------------*/

:root {
    --primary-color:        #011217; /* dark blue -almost black */
    --primary-color-rgb:    1, 18, 23;
    --secondary-color:      #FFFFFF; /* white */
    --secondary-color-rgb:  255, 255, 255;
    --brand-color:          #5789a2; 
    --brand-color-rgb:      87, 137, 162;
    --background-color:     #F4F3F5; /* light grey*/
    --tertiary-color:       #FEEECA; /* light yellow */
    --tertiary-color-rgb:   254, 238, 202;
    --font-size-regular:    clamp(1rem, .9vw + .8rem, 1.25rem);
    --line-height-regular:  clamp(1.5rem, 1.9vw + 1rem, 1.875rem);
    --hero-title:           clamp(1.25rem, 2.5641vw + 0.673rem, 3.75rem);
    --font-size-big:        calc(var(--font-size-regular) * 1.8);
    --line-height-big:      calc(var(--line-height-regular) * 1.66);
    --font-size-small:      0.875rem;
    --line-height-small:    1.1rem;
    --header-height:        clamp(3.5rem, 5vw + 2rem, 6rem);
    --hero-height:          calc(100dvh - var(--header-height));  
    --footer-height:        7.5rem; 
} 

/* normalize CSS */

* {
    margin:     0;
    padding:    0;
    box-sizing: border-box;
}

  
  html, body {
    width:      100%;
    overflow-x: hidden;
  }


   body {
    background-color: var(--secondary-color);
   }

/*** TYPOGRAPHY ***/

html {
  font-size:        16px;
  color:            var(--primary-color);
}

  
  body {
    width:       100vw;
    font-family: "Noto Sans", sans-serif;
    font-weight: 400;
    text-align:  left;
    font-size:   var(--font-size-regular);
    line-height: var(--line-height-regular);
  }


    a {
      text-decoration: none;
    }

/*Title*/

    .title {
      font-family:   'Montserrat', sans-serif;
      font-weight:    bold;
      font-size:      calc(var(--font-size-regular) * 1.5);
      line-height:    calc(var(--line-height-regular) * 1.5);
      margin:         0;
      margin-bottom:  .5rem;
    }
     
      
      .title__hero {
        font-size:      var(--hero-title);
        line-height:    calc(var(--hero-title) * 1.5);
        font-weight:    600;
        text-align:     center;
      }

      


    .title__center {
      text-align: center;
    }

    

    
/*Text*/


    .text__hero {
      text-align:  center;
    }

    
    .text__small {
      font-size:   var(--font-size-small);
      line-height: var(--line-height-small);
    }

    .text__logo {
      font-family: Arizonia, cursive;
      font-size:   clamp(1.5rem, 1.5vw + 1rem, 2rem);
      
      line-height: var(--header-height);
      color:       var(--secondary-color);
    }

    .text__nav {
      font-family:    'Montserrat', sans-serif;
      font-size:      var(--font-size-small);
      line-height:    var(--line-height-small);
      color:          var(--secondary-color);
      font-weight:    500;
    }

    .text__brand {
      color: var(--brand-color);
    }
     

    .text__bold {
      font-weight: 600;
    }

    .text__50 {
      width: min(420px, 90%);
      margin:  0 auto;
    }

      @media (min-width: 601px) {
        .text__50 {
          width:   50%;
        }
      }   

@media (min-width: 1440px) {
  .text__nav {
    font-size:     1rem;
  }
  .text__hero {
    font-size:     1.5rem;
  }
} 
   

  


/*!**************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/layout.css ***!
  \**************************************************************************************************************/
/*--------------------------------*\
* LAYOUT 

*Container............overall layout of the page
*
*Main.................over layout of the content
*
\*--------------------------------*/


/*--------------------------------*\
* OVERALL LAYOUT OF THE PAGE
\*--------------------------------*/

.container {
    display:        flex;
    flex-flow:      column nowrap;
    align-items:    center;
    min-height:     100vh;
    max-width:      1440px;
    margin:         0 auto;
    position:       relative;
}
  
  
  
  
  
  /*--------------------------------*\
  * CONTENT LAYOUT
  \*--------------------------------*/

  main {
    display:         flex;
    flex-flow:       column nowrap;      
    justify-content: flex-start;
    align-items:     center;
    flex-grow:       1;
    width:           100%;
    margin-top:      var(--header-height);
    
  }

  .section {
    display:         flex;
    flex-flow:       column nowrap;
    justify-content: flex-start;
    align-items:     center;
    gap:             2rem;
    padding:         1rem;
  }

  @media (min-width: 400px) {
    .section {
      padding-left: 5%;
      padding-right: 5%;
    }
  }

  @media (min-width: 768px) {
    .section {
      padding-left:  10%;
      padding-right: 10%;
      gap:           3rem;
      padding-top:   3rem;
    }
  }

  @media (min-width: 1440px) {
  
    body {
     background-color: rgba(var(--brand-color-rgb), 0.1);
    }
    .section {
      background-color: var(--secondary-color);
    }
    
  }
  

 
/*!***************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/buttons.css ***!
  \***************************************************************************************************************/
.btn {
      
    display:        inline-block;
    width:          clamp(11.9248rem, 90%, 15rem);
    border:         0.125rem solid;
    opacity:        1;
    padding:        .5rem;
    font-size:      var(--font-size-small);
    line-height:    var(--line-height-small);
    font-weight:    500;
    text-align:     center;
    text-transform: uppercase;
    align-self:     center;
  }
  
  .btn:hover {
    transition:       0.3s;
  }
  
    .btn__primary {
      background:   var(--brand-color) 0% 0% no-repeat padding-box;
      border-color: var(--brand-color);
      color:        var(--secondary-color);
    }

    .btn__primary:hover {
      background:   transparent;
      border-color: var(--brand-color);
      color:        var(--brand-color);
    }

    .btn__hollow {
      background:   transparent;
      border-color: var(--brand-color);
      color:        var(--brand-color);
    }

    .btn__hollow:hover {
      background:   var(--brand-color);
      border-color: var(--brand-color);
      color:        var(--secondary-color);
    }

    .btn__hero {
      background:   var(--brand-color) 0% 0% no-repeat padding-box;
      border-color: var(--brand-color);
      color:        var(--secondary-color);
    }

    .btn__hero:hover {
      background:   transparent;
      border-color: var(--secondary-color);
      color:        var(--secondary-color);
    }

    .btn__hero__hollow {
      background:   transparent;
      border-color: var(--brand-color);
      color:        var(--secondary-color);
    }

    .btn__hero__hollow:hover {
      background:   var(--brand-color) 0% 0% no-repeat padding-box;
      border-color: var(--brand-color);
      
    }

    .buttons--wrapper {
      display:         flex;
      flex-flow:       column nowrap;
      justify-content: space-between;
      width:           100%;
      gap:             1.4rem;
    
    }

 
@media (min-width: 568px) {
  .buttons--wrapper {
    flex-flow:       row nowrap;
    justify-content: center;
    gap:             1rem;
  }
}
@media (min-width: 768px) {
  .buttons__hero--wrapper {
    justify-content: flex-start;
    gap:             1.4rem;
    width:           60%;
  }
}

@media (min-width: 1920px) {
  .btn {
    font-size: 1rem;
  }
}




    /* On tablet and mobile there is no hover effect */

    /*@media (max-width: 923px) {
      .btn__primary:hover {
        background:   var(--brand-color) 0% 0% no-repeat padding-box;
        border-color: var(--brand-color);
        color:        var(--secondary-color);
      } 
      .btn__hollow:hover {
        background:   transparent;
        border-color: var(--secondary-color);
        color:        var(--secondary-color); 
      }
    }
  */
    

/*!**************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/header.css ***!
  \**************************************************************************************************************/
/*
*Header...............main layout, color,  navbar
*
*Header - Navbar..... main layout typography and color, typography,
*                              and hover effect
*Desktop version......sandvich menu hidden, underline shown on hover
*/

/*Sticky header*/

header {
  width:            100%;
  display:          flex;
  flex-flow:        row nowrap;
  justify-content:  space-between;  
  align-items:      center;
  align-self:       flex-start;
  background:       var(--brand-color) 0% 0% no-repeat padding-box;
  opacity:          1;
  padding-left:     10%;
  padding-right:    10%;
  position:         fixed;
  z-index:          100; 
 
  
}

  
  /* Navbar */
 
  .js-nav--wrapper {
  display: flex;
  width:   100%;
  position: fixed;
  top:     var(--header-height);
  left:    0;
}

  .js-nav--wrapper > * {
    width: 100%;
  }
    .nav {
      max-height:       0;
      display:          flex;
      width:            100%;
      gap:              0;
      margin-left:      0; 
      flex-flow:        column nowrap;
      justify-content:  flex-start;
      align-items:      center;
      background-color: var(--brand-color);
      overflow:         hidden;
      transition:       max-height 0.5s ease-out;
    }
    
      .js-nav--wrapper.js-is-open .nav {
        max-height: 100%;
      }
    
        .nav > * { 
          border-bottom:   1px solid rgba(var(--secondary-color-rgb), 0.65); /*[1]*/
          padding-top:     1px;
          width:           100%;
          height:          2rem;
          z-index:         100;
          display:         flex;
          justify-content: center;
          align-items:     center;
         
        }

        .js-nav--wrapper.js-is-open .nav .nav--item__last { /*[1]*/
          border-bottom: none;
        }
    
        /* Ez kell? */    
       /* .js-nav--wrapper.js-is-open .nav > .js-nav--item:hover::after {  [2] 
          display: none;
        }*/
         
      
    .js-nav--menu {
      display:          block;
      color:        var(--secondary-color);
    }
    
    
    
      .js-nav--menu.js-highlight {
        opacity:          1;
      }

    /*Active link is highlighted*/
    
    .js-nav--item__active {
      font-weight:     bold;
      
    }



    /*--------------------------------*/
    /*DESKTOP LAYOUT*/
    /*--------------------------------*/
    

    @media (min-width: 1200px) {
      header {
        max-width:     1440px;
        padding-left:  5%;
        padding-right: 5%;
        
      }
      .js-nav--wrapper {
        display: flex;
        width:   80%;
        position: unset;
      }
  
      .js-nav--wrapper > * {
        width: 100%;
      }  
    .nav {
      width:           100%;
      display:         flex;
      max-height:      100%;
      flex-flow:       row nowrap;
      justify-content: space-between;
      align-items:     center;
      gap:             .5rem;
    }

      .nav > * {
        border-bottom: none;
      }
    
      .js-nav--item, .js-nav--item__logo {
        position:        relative; /* to position the underline */
        display:         flex;
        justify-content: center;
        align-items:     center;
        padding:         0;
        height:          var(--header-height);
      }
    
      /*in case of hover, underline is shown at the bottom of the navbar*/
    
        .js-nav--item:hover::after {
          content:          "";
          display:          block;
          width:            100%;
          height:           0.2rem;
          background-color: var(--secondary-color);
          position:         absolute;
          bottom:           0;
          left:             0;
         
        }
      
    
        .js-nav--item:hover, .js-nav--menu:hover {
          
          transition:       0.3s;
        }
  
        .js-nav--item__logo:hover::after {
          content:          "";
          display:          block;
          width:            100%;
          height:           0.2rem;
          background-color: var(--secondary-color);
          position:         absolute;
          bottom:           0;
          left:             0;
          
        
        }
  
      /*Active link is highlighted*/
    
        .js-nav--item__active {
          font-weight:     bold;
        }
    
  
    /*Sandvich menu is not shown on desktop */
    
    
    .js-nav--menu {
      display:         none;
      color:           var(--secondary-color);
      
         
    }
  }
    


    
/*!****************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/contacts.css ***!
  \****************************************************************************************************************/
.contacts--wrapper {
  gap:             2.5rem;
  padding:         3rem 2rem 3rem 2rem;
 
  
}

  .article__contacts {
    display:         flex;
    flex-flow:       column nowrap;
    justify-content: flex-start;
    align-items:     center;
    gap:             1rem;
    width:           min(18.416rem,100%);
  }

    .article__contacts--title {
      margin-bottom: 0;
    }

    .contact--link {
      color:           var(--primary-color);
      text-decoration: none;
      display:         block;
      line-height:     1.5rem;
    }

    

      .contact--icon {
        padding-right: .5rem;
        color:         var(--primary-color);
     
      }

    .icon-link--wrapper {
      display: flex;
      justify-content: flex-start; 
      align-items: baseline;
      gap:          .5rem; 
    }

      .contact--map {
        width:        100%;
        aspect-ratio: 1/1;
        border:       none;
      }


      .free-consult, .prices {
        text-align: center;
      }

      .prices {
        margin-bottom: 1.5rem;
      }

/*********************************/
/*TABLET AND DESKTOP LAYOUT */
/*********************************/

@media (min-width: 768px) {
  .contacts--wrapper {
    flex-flow:       row nowrap;
    justify-content: center;
    align-items:     flex-start;
    padding-left:    10%;
    padding-right:   10%;
    gap:             10%;   
  }
  .article__contacts {
    box-sizing: content-box;
    height: 50%;
    
    width:  min(20rem,100%);
   
  }
  
  .free-consult, .prices {
    text-align: left;
  }
.prices {
  margin-bottom: 2rem;
}
.free-consult {
 padding-left: 1.9rem;
  
}
}
@media (min-width: 1024px) {
  .contact--link:hover {
    text-decoration: underline;
  }
}

@media (min-width: 1500px) {
  .contacts--wrapper {
    gap: 5%;
  }
  .article__contacts {
    padding: 2rem 3rem 2rem 3rem;
    background-color: var(--secondary-color);
  }
}

@media (min-width: 1500px) and (min-height: 960px) {
  .article__contacts {
    height:  50vh;
    margin: auto 0 auto 0;
  }
}
/*!************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/hero.css ***!
  \************************************************************************************************************/
/*********************************************************************\
HERO SECTION
\********************************************************************/
/*
*Hero background and color.................mobile view
*
*Hero layout and background changes........for bigger screens
*/


/* Hero background and color */

.hero--main {
  background:  url('/images/photos/Mobile_woman-relaxing.jpg') no-repeat center / cover;
  background:  url('/images/photos/Mobile_woman-relaxing.webp') no-repeat center / cover;
  min-height:         var(--hero-height);
  width:              100%;
  
  display:            flex;
  flex-flow:          column nowrap;
  justify-content:    space-between;
  align-items:        center;
  color:              var(--secondary-color);
  padding:            10vh 1rem calc(var(--line-height-small) + 1rem) 1rem;
} 

.hero-text--wrapper {
  display:         flex;
  flex-flow:       column nowrap;
  justify-content: center;
  align-items:     center; 
  width:           100%;
 

}

  

/*Hero background and layout for bigger screens*/
@media (min-width: 471px) {
  .hero--main {
    background:  url('/images/photos/Tablet_woman-relaxing.jpg') no-repeat center / cover;
  }
}
@media (max-height: 539px) {
  .hero--main {
    padding-top: 6vh;
  }
  .title__hero {
    line-height: calc(var(--hero-title) * 1.2);
  }
}
@media (min-width:768px) {
  .hero--main {
    padding-top: 7vh;
  }
}
@media (min-width: 986px) {
  .hero--main {
    background:  url('/images/photos/Desktop_woman-relaxing.jpg') no-repeat center / cover;
    justify-content: flex-start;
    align-items:     flex-start;
    gap:             2rem;
    padding:         10% 0 0 10%;
  }
  .hero-text--wrapper {
    align-items: flex-start;
    width:       max(39.66rem, 50%);
   
  }
  .title__hero, .text__hero {
    text-align: left;
  }
  .btn__hero__hollow {
    border-color: var(--secondary-color);
  }
}

/*!***************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/content.css ***!
  \***************************************************************************************************************/


/*--------------------------------*/
/* MOBILE LAYOUT FOR THE MAIN PAGE */
/*--------------------------------*/


.article {
  display:         flex;
  flex-flow:       column nowrap;
  justify-content: flex-start;
  align-items:     center;
  width:           min(55.1015625rem, 100%);
  width:           min(58rem, 100%);
} 

.article__last {
  margin-bottom: 5vw;
}

.article--title {
  margin-top:    1rem;
  margin-bottom: 1rem;
}

.article--img {
  width:         min(26.879875rem, 100%);
  object-fit:    cover;
  margin-bottom: 1rem;
}

.article--content {
  display:         flex;
  flex-flow:       column nowrap;
  justify-content: flex-start;
  align-items:     center;
  width:           min(26.879875rem, 100%);
  gap:             1.5rem;
  
}

.align-left {
  align-self: flex-start;
}

  

  .article--list li {
    list-style-position: inside;
    display:             flex;
    align-items:         flex-start;
    
  }

  .article--list {
    padding-left: 0;
  }
  
  
  
  .article--list li:before {
    content:      "•"; 
    margin-right: 0.5rem; /* A bullet point távolsága a szövegtől */
    font-size:    1.5rem;
  }


 



  /*--------------------------------*/
  /*MOBILE LAYOUT FOR THE SUBPAGES*/
  /*--------------------------------*/

  .img-background {
    width:           100%;
    max-height:      50vh;
    display:         flex;
    justify-content: center;
    align-items:     center;
    margin-bottom:   0;
    
  }
  .img__fullwidth {
    width:           100%;
    max-height:      50vh;
    object-fit:      cover;
    object-position: top;
    margin-bottom:   0;
  }
    .crop-top {
      object-position: bottom;
    }
    .crop-center {
      object-position: 50% 85%;
    }
    
  .article--wrapper {
    gap:              1rem;
    width:            100%;
    background-color: var(--secondary-color);
    
  }

    .article__detailed {
      display:         flex;
      flex-flow:       column nowrap;
      justify-content: flex-start;
      align-items:     center;
      width:           min(45rem,100%);
      gap:             1rem;
      margin-top:      1rem;
      margin-bottom:   2rem;
    }
 
     
    .article__detailed--content {
      display:         flex;
      flex-flow:       column nowrap;
      justify-content: flex-start;
      align-items:     center;
      width:           100%;
      gap:             1rem;
      margin-bottom:   2rem;
     
    }

   #mikor-fordulj-hozzam { 
      scroll-margin-top: calc(var(--header-height) + 1rem); 
    }

  



/*--------------------------------*/
/* TABLET AND DESKTOP FOR MAIN PAGE */
/*--------------------------------*/

@media (min-width: 400px) {
  .article--title {
    margin-bottom: 1.5rem;
  }
}

@media (min-width: 992px) {
  .article {
    display:               grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows:    auto;
    grid-template-areas:
      "img title"
      "img content";
    column-gap:            1.5rem;
    row-gap:               0;
    margin-top:            5vw;
  }
  .article--title {
    grid-area:  title; 
    align-self: flex-end;
    margin-top: 0; 
    text-align: left;
  }
  .article--img {
    grid-area:     img; 
    align-self:    stretch;
    justify-self:  center; 
    margin-bottom: 0;
  }
  .article--content {
    grid-area:    content;
    align-self:   start;
    justify-self: center; 
  }
  .article__middle {
    grid-template-areas:
    "title img"
    "content img";
  }
  .article--content > .btn {
    align-self: flex-start;
  }
}

@media (min-width: 1200px) {
  .article {
    column-gap:    4rem;
  }
}




/*--------------------------------*/
/* TABLET AND DESKTOP FOR SUBPAGES */
/*--------------------------------*/
@media (min-width: 400px) {
  .article__detailed {
    margin-top: 2rem;
  }
}
  
@media (min-width: 768px) {
 .article__detailed--title {
  margin-bottom: 1rem;
  }
  .article__detailed--content {
    gap:           1.5rem;
    margin-bottom: 3rem;
  }
}






/*!***************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/privacy.css ***!
  \***************************************************************************************************************/
.privacy--wrapper {
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: min(600px, 90%);
  gap: 1rem;
  padding-top: 2rem;
  padding-bottom: 2rem;
  
}

.privacy--wrapper h2 {
  font-size: var(--font-size-regular);
  line-height: var(--line-height-regular);
}

.last-p {
  margin-bottom: 2rem;;
}

/*  LISTS  */

.privacy--wrapper li {
  list-style-position: inside;
  display:             flex;
  align-items:         flex-start;
  
}

.privacy--wrapper ul {
  padding-left: 0;
}



.privacy--wrapper ul li:before {
  content:      "•"; 
  margin-right: 0.5rem; /* A bullet point távolsága a szövegtől */
  font-size:    1.5rem;
}




/* LINKS */

.privacy--link {
  color: var(--brand-color);
}

.privacy--link:hover {
  text-decoration: underline;
}

@media (min-width: 600px) {
  .privacy--wrapper {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }
  .privacy--wrapper h1 {
    margin-bottom: 1rem;
  }
} 
/*!*****************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/impressum.css ***!
  \*****************************************************************************************************************/
.impressum--wrapper {
  display:         flex;
  flex-flow:       column nowrap;
  justify-content: flex-start;
  align-items:     flex-start;
  max-width:       47rem;
  padding-top:     2rem;
  padding-bottom:  2rem;
  
}

  .impressum--subwrapper {
    margin-top:    2rem;
    margin-bottom: 2rem;
  }

  .impressum--wrapper h2 {
    margin-bottom: 1rem;
  }
/*!**************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/footer.css ***!
  \**************************************************************************************************************/
footer {
    height:           var(--footer-height);
    width:            100%;
    display:          flex;
    flex-flow:        column nowrap;
    justify-content:  center;  
    align-items:      center;
    gap:              calc(var(--line-height-small) / 2);
    background:       var(--primary-color) 0% 0% no-repeat padding-box;
    opacity:          1;
    
  }

  .links--wrapper {
    display:         flex;
    flex-flow:       column nowrap;
    justify-content: center;
    align-items:     center;
    gap:             0;
  }
  
    .footer--text {
      width:           69.375rem;
      text-align:      center;
      letter-spacing:  0.15rem;
      text-transform:  uppercase;
      color:           var(--brand-color);
    }

    .footer--text__link {
      color:           var(--secondary-color);
      opacity:         .8;
      
    }

    .footer--text__link:hover {
      text-decoration: underline;
    }
  

    
/*!*************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./public/css/partials/icons.css ***!
  \*************************************************************************************************************/
/* Contact icons */

.icons--wrapper {
    height:          2rem;
    display:         flex;
    justify-content: flex-start;
    gap:             .625rem;

  }

    .icons {
      display:          flex;
      flex-flow:        row nowrap;
      justify-content:  center;
      align-items:      center;
      width:            2rem;
      height:           2rem;
      background-color: var(--brand-color);
      color:            var(--primary-color);
      opacity:          .8;
      border-radius:    50%;
    }

    .icons:hover {
      background-color: transparent;
      color:            var(--brand-color);
      border:           .125rem solid var(--brand-color);
    }  


    .icons__light {
      background-color: var(--tertiary-color);
      color:            var(--primary-color);
    }

    .icons__light:hover {
        background-color: transparent;
        color:            var(--tertiary-color);
        border:           .125rem solid var(--tertiary-color);
      }  

/*!**************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[1].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[1].use[2]!./public/css/style.css ***!
  \**************************************************************************************************************************************************************************/






/*# sourceMappingURL=style.css.map*/