#root{--font-family: "Roboto", sans-serif;--second-family: "Marcellus", serif;--font-size: clamp(.5rem, calc(1vw + .5rem) , 1rem);--title-size: clamp(1.5rem, calc(5vw + 2rem) , 5rem);--sub-title: clamp(.7rem, calc(2.5vw + 1.5rem) , 3rem);--gap: 1rem;--primary-black: hsl(0 0% 0%);--black-background-light: hsla(0 0 0 / .4);--black-background-dark: hsla(0 0 0 / .8);--primary-white: hsl(0 100% 100%);--sand: hsl(34, 67%, 67%);--sand-background-dark: hsla(34, 67%, 67%, .4);--sand-background-light: hsla(34, 67%, 67%, .8)}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}*,*:before,*:after{box-sizing:border-box}html{-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;scroll-behavior:smooth}body{margin:0;min-height:100vh;line-height:1.5;overflow-x:hidden}h1,h2,h3,h4,h5,h6{text-wrap:balance}h1,h2,h3,h4,button,input,label{line-height:1.1}h1,h2,h3,h4,h5,h6,p,figure,blockquote,dl,dd{margin-block-end:0}p,li,figcaption{max-width:70ch;text-wrap:pretty}header,footer,main,section,article{container-type:inline-size}button{background:none;color:inherit;border:none;padding:0;font:inherit;cursor:pointer;outline:inherit}a{text-decoration:none}img{display:block;max-inline-size:100%}ul[class],ol[class]{list-style:""}body{background-color:#fff;background:linear-gradient(hsl(0 0 0 / .1),hsla(0 0 0 / .8)),url(/background-image.webp);background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed}h1{font-family:var(--second-family);font-size:var(--title-size)}.primary-navbar{--navbar-transition: .6s linear( 0, .011 .7%, .043 1.4%, .176 3%, .859 8.3%, 1.091 10.5%, 1.235 12.6%, 1.278 13.7%, 1.299 14.8%, 1.3 16.2%, 1.273 17.7%, 1.223 19.3%, 1.054 23.5%, .984 25.6%, .932 27.9%, .909 30.3%, .917 33.2%, 1.004 41%, 1.027 45.6%, 1.025 48.7%, .992 60.9%, 1.002 76%, 1 );width:fit-content;margin:3rem auto;background-color:#0000004d;border-radius:12px;isolation:isolate;anchor-name:--hovered-link}.primary-navbar li{font-size:var(--small-text)}.primary-navbar li:hover{anchor-name:--hovered-link}.primary-navbar:before,.primary-navbar:after{content:"";position:absolute;top:calc(anchor(bottom) - 10px);left:calc(anchor(left) + 1rem);right:calc(anchor(right) + 1rem);bottom:calc(anchor(bottom) + 7px);border-radius:12px;position-anchor:--hovered-link;transition:var(--navbar-transition)}.primary-navbar:before{z-index:-1;background:var(--sand-background-light);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.primary-navbar:after{z-index:-2;background-image:url(/background-image.webp);background-position:center;background-repeat:no-repeat;background-size:cover;background-attachment:fixed}.primary-navbar:has(a:hover):before,.primary-navbar:has(a:hover):after{top:anchor(top);left:anchor(left);right:anchor(right);bottom:anchor(bottom)}@supports (corner-shape: squircle){.primary-navbar:has(a:hover):before,.primary-navbar:has(a:hover):after{border-radius:50%;corner-shape:squircle}}@supports (corner-shape: squircle){.primary-navbar:has(li:first-of-type a:hover):after{border-radius:22px 50% 50% 22px}}@supports (corner-shape: squircle){.primary-navbar:has(li:last-of-type a:hover):after{border-radius:50% 22px 22px 50%}}@supports (corner-shape: squircle){.primary-navbar{border-radius:24px;corner-shape:squircle}}.primary-navbar>ul{display:flex;padding:0;margin:0}.primary-navbar a{display:block;padding:1rem;color:var(--primary-black, #00000a)}.landing-header{background:linear-gradient(hsl(0 0 0 / .1),var(--sand-background-dark))}.landing-header h1{color:var(--secondary-color);text-align:center;max-width:15ch;place-self:center;margin-inline:auto}.landing-container{min-block-size:100vb;display:flex;flex-direction:column;justify-content:center;overflow-x:hidden;background:linear-gradient(hsl(0 0 100% / .99))}.rooms-container{align-self:center;justify-content:center}.booking-container{align-self:center}.contact-container{display:flex;justify-content:space-evenly;gap:var(--gap);font-size:var(--font-size);height:fit-content;border-top:4px solid var(--primary-black);border-bottom:4px solid var(--primary-black);border-left:2px solid var(--primary-black);border-right:2px solid var(--primary-black)}.contact-list{color:var(--primary-white);font-size:var(--font-size);font-weight:600}.back-to-top{z-index:100;position:fixed;bottom:1rem;right:1rem;opacity:.5;animation:show-on-scroll linear;animation-timeline:scroll()}.back-to-top img{width:2rem}.back-to-top:hover{opacity:1}@keyframes show-on-scroll{to{opacity:1}}.rooms-container{display:flex;flex-direction:column}.rooms-container h2{margin-bottom:1rem;font-size:var(--sub-title);font-family:var(--second-family);font-weight:300;text-align:center;text-decoration:underline;text-decoration-color:var(--sand)}.rooms-container .room-image-wrapper{width:clamp(2rem,calc(30vw + 10rem),24rem);aspect-ratio:2/1;overflow:hidden;margin:3rem;place-self:center}@media(max-width:35em){.rooms-container .room-image-wrapper.active{margin-top:2rem;width:80svw}}.rooms-container .room-image-wrapper.hidden{display:none}.btn-container{display:flex;gap:var(--gap);justify-content:center}@media(max-width:55em){.btn-container{flex-direction:column;width:80svw;margin:auto}}.booking-btn{border:var(--sand) 2px solid;font-size:var(--font-size);padding:.5em 1.5em;color:var(--primary-black);font-weight:400;text-transform:uppercase;cursor:pointer;border-radius:12px}@supports (corner-shape: squircle){.booking-btn{border-radius:100svh;corner-shape:squircle}}.booking-btn.active{background:linear-gradient(var(--sand),var(--sand-background-dark))}img{width:100%;height:100%;object-fit:cover;object-position:center;border-radius:12px}@supports (corner-shape: bevel){img{corner-shape:round;border-radius:24px}}.room-info{border:3px dotted var(--sand);margin:2rem;padding:2rem}.room-info h3{font-weight:600}.room-info p{font-size:var(--font-size)}.form-container{margin:3rem;text-align:center;display:grid;place-content:center;gap:var(--gap)}.form-container *{font-size:var(--font-size)}.form-container h3{margin-bottom:1rem;font-size:var(--sub-title);font-family:var(--second-family);font-weight:300;text-decoration:underline;text-decoration-color:var(--sand)}.form-container .activeRoom{width:fit-content}.form-container .activeRoom span{font-weight:600}form{display:grid;gap:var(--gap)}@media not (max-width:65em){form{grid-template-columns:1fr 1fr}}form input{padding:.5em;width:100%}form button{border:1px solid #ccc;font-size:var(--font-size);padding:.5em 1.5em;width:max-content;color:var(--primary-black);font-weight:400;text-transform:uppercase;cursor:pointer;border-radius:8px}@supports (corner-shape: squircle){form button{border-radius:80svh;corner-shape:squircle}}form button.active{background:linear-gradient(var(--sand),var(--sand-background-dark))}.input-field{display:grid;gap:var(--gap);position:relative}.input-field input{background:#fff;padding:1rem .75rem .25rem;border:1px solid #ccc;border-radius:4px;background:transparent;outline:none;display:block}.input-field label{position:absolute;left:.75rem;top:50%;transform:translateY(-50%);transition:.3s ease-out;pointer-events:none}.input-field input:is(:focus,:not(:placeholder-shown))+label{top:0;font-size:.75rem;background:#fff}.input-field input:is(:focus,:focus-visible){border-color:var(--sand)}dialog[open]{z-index:9999;margin:auto;border:none;box-shadow:0 0 1.5rem #05050566;border-radius:12px}dialog::backdrop{background:#1a1a1ae6;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.confirmed-booking{font-size:var(--font-size)}.confirmed-booking h3{font-family:var(--second-family)}.confirmed-booking span{font-weight:600}.confirmed-booking img{position:absolute;top:1rem;right:1rem;width:2rem;height:2rem}
