@import url(https://fonts.bunny.net/css?family=cormorant-garamond:400,500,600|inter:300,400,500,600);

:root{

    /* Colors */

    --background:#F7F4EE;
    --background-soft:#EFE7DB;

    --text:#2F312D;
    --text-light:#66665E;

    --accent:#CDAE82;
    --accent-dark:#B18E61;

    --charette:#536A7A;

    --border:#DDD2C2;

    /* Layout */

    --container:1280px;

    --radius:18px;

    --shadow:0 20px 50px rgba(0,0,0,.06);

}

html:focus-within {
    scroll-behavior: smooth;
}

h1,h2,h3{
    font-family:"Cormorant Garamond", serif;
    font-size: clamp(2rem, 5vw, 3rem);
    line-height: 1.05;
    font-weight: 500;
}

h3 {
    font-weight: 600;
}

body{
    font-family:"Inter", sans-serif;
    font-size: 1.125rem;
    line-height:1.85;
    font-weight: 400;
    background-color: var(--background);
    color: var(--text);
}

.site-header {
  position: fixed;
  top: 0;
  left: 0;

  width: 100%;
  z-index: 1000;

  color: #fff;

  transition:
    background .4s ease,
    color .4s ease;
}

.site-header.scrolled {
  background: rgba(250, 248, 243, .96);
  color: #292820;

  backdrop-filter: blur(12px);

  box-shadow:
    0 1px 0 rgba(0,0,0,.08);
}


.header-inner {
  width: min(1400px, calc(100% - 80px));
  height: 90px;

  margin: auto;

  display: flex;
  align-items: center;
}


/* LOGO */

.logo {
  display: flex;
  flex-direction: column;

  flex-shrink: 0;
}

.logo-main {
  font-family: "Cormorant Garamond", serif;

  font-size: 23px;
  line-height: 1;

  letter-spacing: .08em;
}

.logo-sub {
  margin-top: 6px;

  font-size: 8px;
  letter-spacing: .25em;
}


/* NAV */

.desktop-nav {
  display: flex;

  gap: 32px;

  margin-left: auto;
  margin-right: 35px;
}

.nav-link {
  position: relative;

  padding: 10px 0;

  color: inherit;

  font-size: 10px;
  font-weight: 500;

  letter-spacing: .14em;
  text-transform: uppercase;
}

.nav-link::after {
  content: "";

  position: absolute;

  left: 0;
  bottom: 3px;

  width: 0;
  height: 1px;

  background: currentColor;

  transition: width .3s ease;
}

.nav-link:hover::after {
  width: 100%;
}


/* CTA */

.reservation-button {
  display: flex;
  align-items: center;
  justify-content: center;

  min-height: 43px;

  padding: 0 20px;

  border: 1px solid currentColor;

  font-size: 9px;
  letter-spacing: .14em;

  text-transform: uppercase;

  white-space: nowrap;

  transition: all .3s ease;
}

.reservation-button:hover {
  background: #292820;
  color: #fff;
}


/* ANCRAGE DES SECTIONS */

section[id] {
  scroll-margin-top: 90px;
}

.mobile-menu {
  display: none;
}

.mobile-menu-button {
  display: none;

  margin-left: auto;

  width: 42px;
  height: 42px;

  border: 0;
  background: transparent;

  color: inherit;
}


@media (max-width: 900px) {

  section[id] {
    scroll-margin-top: 70px;
  }

  .header-inner {
    width: calc(100% - 40px);
    height: 75px;
  }

  .desktop-nav,
  .reservation-button {
    display: none;
  }

  .mobile-menu-button {
    display: block;
  }


  .mobile-menu {
    display: block;
    position: fixed;

    top: 75px;
    left: 0;

    width: 100%;
    height: calc(100vh - 75px);

    background: #faf8f3;
    color: #292820;

    overflow-y: auto;

    opacity: 0;
    visibility: hidden;

    transform: translateY(-10px);

    transition: all .3s ease;
  }


  .mobile-menu.open {
    opacity: 1;
    visibility: visible;

    transform: translateY(0);
  }


  .mobile-menu-inner {
    padding: 20px 25px 100px;
  }


  .mobile-menu-inner > a {
    display: block;

    padding: 20px 0;

    border-bottom: 1px solid rgba(41,40,32,.15);

    font-family: "Cormorant Garamond", serif;

    font-size: 28px;
  }


  .mobile-menu-inner
  .mobile-reservation {
    margin-top: 30px;

    padding: 18px;

    background: #292820;

    color: white;

    border: 0;

    font-family: Inter, sans-serif;

    font-size: 10px;

    letter-spacing: .15em;

    text-align: center;

    text-transform: uppercase;
  }

}


/* ========================================
   BOUTON MENU SANDWICH
======================================== */

.mobile-menu-button {
  display: none;

  position: relative;

  width: 44px;
  height: 44px;

  margin-left: auto;
  padding: 0;

  border: 0;
  background: transparent;

  color: inherit;

  cursor: pointer;

  -webkit-tap-highlight-color: transparent;
}


/* Les deux lignes */

.mobile-menu-button span {
  position: absolute;

  left: 50%;

  width: 24px;
  height: 1px;

  background: currentColor;

  transform: translateX(-50%);

  transition:
    transform 0.3s ease,
    top 0.3s ease,
    opacity 0.2s ease;
}


/* Position fermée */

.mobile-menu-button span:first-child {
  top: 18px;
}

.mobile-menu-button span:last-child {
  top: 26px;
}


/* ========================================
   MENU OUVERT → CROIX
======================================== */

.mobile-menu-button.active span:first-child {
  top: 22px;

  transform:
    translateX(-50%)
    rotate(45deg);
}

.mobile-menu-button.active span:last-child {
  top: 22px;

  transform:
    translateX(-50%)
    rotate(-45deg);
}


/* ========================================
   MOBILE
======================================== */

@media (max-width: 900px) {

  .mobile-menu-button {
    display: block;
  }

}


/* ==========================================================
   HERO
========================================================== */

.hero {

    position: relative;

    min-height: 100dvh;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

}


.hero__image {

    position: absolute;

    inset: -5% 0;

    background:
        url("../images/hero.jpg")
        center / cover no-repeat;

    transform: translateY(0);

}

.hero__content {

    position: relative;
    z-index: 2;

    width: min(90%, 900px);

    text-align: center;

    color: white;

    padding: 3rem;

    transform: translateY(8%);

}

.hero__location {

    margin: 0 0 1rem;

    font-family: "Inter", sans-serif;

    font-size: .9rem;

    font-weight: 500;

    text-transform: uppercase;

    letter-spacing: .35em;

    color: rgba(255,255,255,.95);

    text-shadow: 0 2px 8px rgba(0,0,0,.15);

}


.hero__title {

    margin: 0;

    font-family: "Cormorant Garamond", serif;

    font-size: clamp(4rem, 8vw, 7rem);

    font-weight: 500;

    line-height: .95;

    letter-spacing: -.02em;

    color: white;

    text-shadow:
        0 2px 10px rgba(0,0,0,.20),
        0 8px 30px rgba(0,0,0,.12);

}

@media (max-width: 1024px){

    .hero{
        min-height: 80dvh;
    }

}

@media (max-width: 768px){

    .hero{
         min-height:60svh;
    }

    .hero__content{
        transform: translateY(30%);
    }
    
    .hero__location {
        font-size: .8rem;
    }

    .hero__title {
        font-size: 2.5rem;
    }
}



.intro {

    padding:140px 0;

    background:#F7F4EE;

}


.intro-grid {

    display:grid;

    grid-template-columns: 0.9fr 1.1fr;

    gap:90px;

    align-items:center;

}


.intro-image img {

    width:100%;

    aspect-ratio:4 / 6;

    object-fit:cover;

}


.intro-content {

    max-width:600px;

}


.intro p.eyebrow {

    margin-bottom:24px;

    font-family:"Inter",sans-serif;

    font-size:14px;

    font-weight:500;

    letter-spacing:.25em;

    text-transform:uppercase;

    color: var(--charette);

}


.intro h2 {

    margin-bottom:40px;

    font-family:"Cormorant Garamond",serif;

    font-size:clamp(2.5rem,4vw,3.8rem);

    font-weight:500;

    line-height:1.05;

}


.intro p {
    margin-bottom:24px;
    color: var(--text-light);
    text-align: justify;
}





@media (max-width:768px) {

    .intro {
        padding: 80px 0;
    }

     .intro-image {

        display:none;

    }


    .intro-grid {

        display:block;

    }

    .intro-content {
        text-align:center;
        max-width:100%;
        margin: 0 10px;
    }

    .intro .eyebrow {

        margin-bottom:20px;
        justify-content:center;
    }


    .intro h2 {

        font-size:2.7rem;

        line-height:1.05;

        margin-bottom:30px;

    }


    .intro p {

        font-size:1rem;

        line-height:1.8;

    }    

}

/* ==========================================================
   DETAILS
========================================================== */

.details {
    display:flex;
    flex-wrap:nowrap;
    align-items:center;
    justify-content: center;
    gap:18px;
    margin-top:48px;
    padding-top:32px;
    white-space:nowrap;
}

.details--separator {
    border-top:1px solid var(--border);
}

.details--left{
    justify-content: flex-start;
}


.details__item {

    font-family:"Inter",sans-serif;

    font-size:12px;

    font-weight:500;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:var(--charette);

}

.details__item:not(:last-child)::after {

    content:"·";

    margin-left:18px;

    color:var(--accent);

}

@media (max-width:768px) {
    .details {

        margin-top:40px;

        padding-top:25px;

        flex-direction:column;

        align-items:center;

        gap:14px;
    }

    .details__item{

        text-align:center;

    }


    .details__item:not(:last-child)::after {

        display:none;

    }
}


/* ==========================================================
   CONTENT
========================================================== */

.content {
    max-width:720px;
    margin:0 auto;
    text-align:center;
}

.content--left {
    text-align:left;
}

.content__eyebrow {
    justify-content:center;
    margin-bottom:24px;
}

.content__title {
    margin:0 0 40px;
    font-family:"Cormorant Garamond", serif;
    font-size:clamp(2.8rem,4vw,4.2rem);
    font-weight:500;
    line-height:1.05;
    color:var(--text);
}


.content__text {
    margin:0 auto 24px;
    font-family:"Inter",sans-serif;
    font-size:1.05rem;
    line-height:1.8;
    color:var(--text-light);
}


@media(max-width:768px){

    .content_title {

        font-size:2.7rem;

    }

    .content{
        margin: 0 10px;
    }

}



/* ==========================================================
   PARK SECTION
   ========================================================== */

.park {

    padding:0 0 140px;

    background:var(--background-soft);

}


/* IMAGE */

.park-image {

    width:100%;

    margin-bottom:80px;

}


.park-image img {

    display:block;

    width:100%;

    aspect-ratio:16 / 8.5;

    object-fit:cover;

}



/* CONTENT */

.park-content {

    max-width:760px;

    margin:0 auto;

    text-align:center;
    
}


.park-content .eyebrow {

    justify-content:center;

    margin-bottom:24px;

}


/* TITRE */

.park h2 {

    margin:0 0 40px;

    font-family:"Cormorant Garamond", serif;

    font-size:clamp(2.8rem,4vw,4.2rem);

    font-weight:500;

    line-height:1.05;

    color:var(--text);

}



/* TEXTE */

.park-content p:not(.eyebrow) {

    margin:0 auto 24px;

    max-width:650px;

    font-family:"Inter",sans-serif;

    font-size:1.05rem;

    line-height:1.8;

    color:var(--text-light);

}



/* DETAILS */

.park-details {

    display:flex;

    justify-content:center;

    flex-wrap:wrap;

    gap:18px;

    margin-top:50px;

    padding-top:30px;

    border-top:1px solid var(--border);

}


.park-details span {

    font-family:"Inter",sans-serif;

    font-size:12px;

    font-weight:500;

    letter-spacing:.12em;

    text-transform:uppercase;

    color:var(--charette);

}


.park-details span:not(:last-child)::after {

    content:"·";

    margin-left:18px;

    color:var(--accent);

}


@media(max-width:768px){


    .park {

        padding:0 0 80px;

    }


    .park-image {

        margin-bottom:50px;

    }


    .park-image img {

        aspect-ratio:8 / 8.5;        

    }


    .park h2 {

        font-size:2.7rem;

    }

    .park-content{
        margin: 0 10px;
    }

    .park-details {

        flex-direction:column;

        gap:14px;

    }


    .park-details span:not(:last-child)::after {

        display:none;

    }

}



/* ==========================================================
   POOL SECTION
   ========================================================== */


.pool {

    padding:140px 0;

    background:var(--background);

}


/* HEADER */

.pool-header {

    max-width:780px;

    margin:0 auto 70px;

    text-align:center;

}


.pool h2 {

    margin:25px 0 35px;

    font-family:"Cormorant Garamond", serif;

    font-size:clamp(2.8rem, 5vw, 4rem);

    font-weight:500;

    line-height:1.05;

    color:var(--text);

    text-wrap:balance;

}


.pool-header p:not(.eyebrow) {

    margin:0 auto 22px;

    max-width:720px;

    font-family:"Inter", sans-serif;

    font-size:1rem;

    line-height:1.85;

    color:var(--text-light);

}



/* IMAGE */

.pool-image {

    margin:0;

}


.pool-image img {

    display:block;

    width:100%;

    aspect-ratio:16 / 9;

    object-fit:cover;

}

/* ==========================================================
   POOL DETAILS
   ========================================================== */

.pool-details {

    display:flex;

    flex-wrap:nowrap;

    align-items:center;
    justify-content:center;

    gap:18px;

    margin-top:48px;    

    white-space:nowrap;

}


.pool-details span {

    font-family:"Inter",sans-serif;

    font-size:12px;

    font-weight:500;

    letter-spacing:.08em;

    text-transform:uppercase;

    color:var(--charette);

}


.pool-details span:not(:last-child)::after {

    content:"·";

    margin-left:18px;

    color:var(--accent);

}

@media(max-width:768px) {


    .pool {

        padding:80px 0;

    }


    .pool-header {

        margin-bottom:45px;

    }


    .pool h2 {

        font-size:2.8rem;

    }


    .pool-image img {

        aspect-ratio:4 / 3;

    }


     .pool-details {

        margin-top:40px;

        padding-top:25px;

        flex-direction:column;

        align-items:center;

        gap:14px;
    }

    .pool-details span {

        text-align:center;

    }


    .pool-details span:not(:last-child)::after {

        display:none;

    }

}




.living {

    background:var(--background-soft);

    margin:0 auto;

    padding:140px 30px;

    text-align: center;

}


.living__intro {

    max-width:720px;

    margin:0 auto 70px;

}


.living__eyebrow {

    font-size:.75rem;

    letter-spacing:.25em;

    text-transform:uppercase;

    color:#536A7A;

    margin-bottom:25px;

}


.living__title {

    font-family:"Cormorant Garamond", serif;

    font-size:4rem;

    line-height:1;

    font-weight:500;

    margin:0 0 35px;

}


.living__text {

    color:#66665E;

    line-height:1.8;

    margin-bottom:20px;

}


.living__hero {

    max-width:1200px;

    margin:0 auto 40px;

}


.living__hero img {

    display:block;

    width:100%;

    aspect-ratio:16 / 9;

    object-fit:cover;

}


.living__gallery {

    max-width:1200px;


    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:25px;

    margin:0 auto;
}


.living__gallery figure {

    margin:0;

}


.living__gallery img {

    width:100%;

    aspect-ratio:4 / 3;

    object-fit:cover;

    display:block;

}


.living__details {

    display:flex;

    flex-wrap:wrap;

    gap:0;

    max-width:1200px;
    
    margin:35px auto 0;

}


.living__details span {

    position:relative;

    padding-right:18px;

    margin-right:18px;

    font-size:.75rem;

    letter-spacing:.15em;

    text-transform:uppercase;

    color:#536A7A;

}


.living__details span:not(:last-child)::after {

    content:"•";

    position:absolute;

    right:0;

    color:#CDAE82;

}



/* ==========================================================
   PRIVATE — ESPACES PRIVÉS
   ========================================================== */

.private {

    max-width:1200px;

    margin:0 auto;

    padding:140px 30px;

    text-align: center;
}


/* ==========================================================
   INTRO
   ========================================================== */

.private__intro {

    max-width:720px;

    margin-bottom:70px;

}


.private__eyebrow {

    margin:0 0 25px;

    font-size:.75rem;

    font-weight:500;

    letter-spacing:.25em;

    text-transform:uppercase;

    color:var(--charette);

}


.private__title {

    margin:0 0 35px;

    font-family:"Cormorant Garamond", serif;

    font-size:clamp(3rem,5vw,4rem);

    font-weight:500;

    line-height:1.02;

    color:var(--text);

}


.private__text {

    margin:0 0 20px;

    color:var(--text-light);

    font-size:1rem;

    line-height:1.8;

}


/* ==========================================================
   IMAGE PRINCIPALE
   ========================================================== */

.private__hero {

    margin:0 0 40px;

}


.private__hero img {

    display:block;

    width:100%;

    aspect-ratio:3 / 2;

    object-fit:cover;

}


/* ==========================================================
   GALERIE
   ========================================================== */

.private__gallery {

    display:grid;

    grid-template-columns:repeat(3, 1fr);

    gap:25px;

}


.private__gallery figure {

    margin:0;

}


.private__gallery img {

    display:block;

    width:100%;

    aspect-ratio:3 / 2;

    object-fit:cover;

}


/* ==========================================================
   DÉTAILS
   ========================================================== */

.private__details {

    display:flex;

    flex-wrap:wrap;

    margin-top:35px;

}


.private__details span {

    position:relative;

    margin-right:18px;

    padding-right:18px;

    font-size:.75rem;

    font-weight:500;

    letter-spacing:.15em;

    text-transform:uppercase;

    color:var(--charette);

}


.private__details span:not(:last-child)::after {

    content:"•";

    position:absolute;

    right:0;

    color:var(--accent);

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width:768px) {

    .private {

        padding:80px 24px;

    }


    .private__intro {

        max-width:100%;

        margin-bottom:45px;

        text-align:center;

    }


    .private__eyebrow {

        margin-bottom:18px;

    }


    .private__title {

        margin-bottom:28px;

        font-size:2.7rem;

    }


    .private__text {

        line-height:1.8;

    }


    .private__hero {

        margin-bottom:20px;

    }


    .private__gallery {

        grid-template-columns:1fr;

        gap:20px;

    }


    .private__gallery img {

        aspect-ratio:3 / 2;

    }


    .private__details {

        justify-content:center;

        margin-top:30px;

        text-align:center;

    }


    .private__details span {

        margin-right:12px;

        padding-right:12px;

        line-height:2;

    }

}


/* ==========================================================
   LUBERON
   ========================================================== */

.luberon {
    background: var(--background-soft);        
    padding: 140px 0;
}

.luberon > *{
    max-width: 1200px;
    margin: 0 auto;    
}

/* ==========================================================
   INTRO
   ========================================================== */

.luberon__intro {

    max-width: 760px;

    margin: 0 auto 70px;

    text-align: center;

}


.luberon__eyebrow {

    margin: 0 0 25px;

    font-size: .75rem;

    font-weight: 500;

    letter-spacing: .25em;

    text-transform: uppercase;

    color: var(--charette);

}


.luberon__title {

    margin: 0 0 35px;

    font-family: "Cormorant Garamond", serif;

    font-size: clamp(3rem, 5vw, 4rem);

    font-weight: 500;

    line-height: 1.02;

    color: var(--text);

}


.luberon__text {

    margin: 0 0 20px;

    color: var(--text-light);

    font-size: 1rem;

    line-height: 1.8;

}


/* ==========================================================
   IMAGE
   ========================================================== */


.luberon__hero img {

    display: block;

    width: 100%;

    object-fit: cover;

}


/* ==========================================================
   DÉTAILS
   ========================================================== */

.luberon__details {

    display: flex;

    flex-wrap: wrap;

    justify-content: center;

    margin-top: 35px;

}


.luberon__details span {

    position: relative;

    margin-right: 18px;

    padding-right: 18px;

    font-size: .75rem;

    font-weight: 500;

    letter-spacing: .15em;

    text-transform: uppercase;

    color: var(--charette);

}


.luberon__details span:not(:last-child)::after {

    content: "•";

    position: absolute;

    right: 0;

    color: var(--accent);

}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 768px) {

    .luberon {

        padding: 80px 24px;

    }


    .luberon__intro {

        max-width: 100%;

        margin-bottom: 45px;

    }


    .luberon__eyebrow {

        margin-bottom: 18px;

    }


    .luberon__title {

        margin-bottom: 28px;

        font-size: 2.7rem;

    }


    .luberon__text {

        line-height: 1.8;

    }


    .luberon__hero img {

        aspect-ratio: 3 / 2;

    }


    .luberon__details {

        margin-top: 28px;

        text-align: center;

    }


    .luberon__details span {

        margin-right: 12px;

        padding-right: 12px;

        line-height: 2;

    }

}



.contact {

    padding:160px 0;

    background:var(--background);

    text-align:center;

}


.contact .container {

    max-width:760px;

    margin:auto;

}


/* EYEBROW */
.contact .eyebrow {

    margin-bottom:30px;

    font-family:"Inter",sans-serif;

    font-size:13px;

    font-weight:500;

    letter-spacing:.25em;

    text-transform:uppercase;

    color:var(--charette);

}



/* TITLE */

.contact h2 {

    margin:0 0 40px;

    font-family:"Cormorant Garamond",serif;

    font-size:clamp(2.8rem,5vw,4rem);

    font-weight:500;

    line-height:1.05;

    color:var(--text);

}



/* TEXT */

.contact-text {

    max-width:560px;

    margin:0 auto 55px;

    font-family:"Inter",sans-serif;

    font-size:1.05rem;

    line-height:1.8;

    color:var(--text-light);

}



/* COORDONNEES */

.contact-links {

    display:flex;

    flex-direction:column;

    align-items:center;

    gap:18px;

    margin-bottom:55px;

}


.contact-links a {

    font-family:"Inter",sans-serif;

    font-size:16px;

    letter-spacing:.04em;

    color:var(--charette);

    text-decoration:none;

}


.contact-links a:first-child {

    font-size:20px;

    font-weight:500;

}


.contact-links a:hover {

    color:var(--accent-dark);

}

.contact-links a:first-child::before {

    content:"";

    display:block;

    width:40px;

    height:1px;

    margin:0 auto 20px;

    background:var(--accent);

}



/* LOCATION */

.contact-location {

    font-family:"Cormorant Garamond",serif;

    font-size:1.6rem;

    color:var(--accent-dark);

    letter-spacing:.05em;

}





@media(max-width:768px) {


    .contact {

        padding:90px 0;

    }


    .contact h2 {

        font-size:2.7rem;

    }


    .contact-links {

        flex-direction:column;

        gap:20px;

    }


}



/* =========================================
   TABLEAU DES TARIFS
   ========================================= */

.table-wrapper {
    width: 100%;
    overflow-x: auto;
    margin-top: 3rem;
    -webkit-overflow-scrolling: touch;
}

.tarifs-table {
    width: 100%;
    min-width: 650px;
    border-collapse: collapse;
    border-spacing: 0;
    text-align: left;
}

.tarifs-table th,
.tarifs-table td {
    padding: 1.25rem 1.5rem;
    border-bottom: 1px solid rgba(40, 35, 28, 0.15);
    vertical-align: middle;
}

.tarifs-table thead th {
    font-size: 0.75rem;
    font-weight: 500;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #6f675c;
    border-bottom: 1px solid rgba(40, 35, 28, 0.3);
}

.tarifs-table tbody th {
    font-weight: 500;
    white-space: nowrap;
}

.tarifs-table tbody td {
    font-size: 1rem;
}

.tarifs-table tbody tr:last-child th,
.tarifs-table tbody tr:last-child td {
    border-bottom: none;
}

.tarifs-table tbody tr:hover {
    background-color: rgba(40, 35, 28, 0.035);
}

.table-note {
    max-width: 760px;
    margin-top: 1.5rem;
    font-size: 0.85rem;
    line-height: 1.7;
    color: #6f675c;
}


/* Mobile */

@media (max-width: 700px) {

    .table-wrapper {
        margin-top: 2rem;
    }

    .tarifs-table th,
    .tarifs-table td {
        padding: 1rem;
    }

    .tarifs-table thead th {
        font-size: 0.68rem;
        letter-spacing: 0.08em;
    }

    .tarifs-table tbody th,
    .tarifs-table tbody td {
        font-size: 0.9rem;
    }

    .table-note {
        font-size: 0.8rem;
    }
}