/* accordion.css */
@layer components{.accordion{}.accordionitem{border-bottom:1px solid black;&:first-child{border-top:1px solid black;}button{display:block;padding:1rem;width:100%;text-align:left;position:relative;transition:background-color 0.2s ease;&:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;}&:hover,&:focus,&:active,&[aria-expanded="true"]{background-color:#f1f1f1;}&::after,&::before{content:"";width:1.2rem;border-top:1px solid black;position:absolute;right:1rem;top:50%;transform:translateY(-50%);}&::after{transform:rotate(90deg) translateY(-50%);}&[aria-expanded="true"]{&::after{display:none;}}}}.accordiontext{font-size:1.25rem;line-height:1.5;padding:0 1rem 1rem;height:max-content;background-color:#f1f1f1;transition:all ease 0.3s;overflow:hidden;&[hidden="true"]{display:block;visibility:hidden;height:0;padding-top:0;padding-bottom:0;}}}
/* block.css */
@layer components{.block{margin-top:3rem;margin-bottom:3rem;& .textcolumn{max-width:50rem;}&.block-type-text,&.block-type-list{& > .usertext{max-width:50rem;}}&.block-type-image{margin-top:4rem;margin-bottom:4rem;}&.block-type-gallery{margin-top:4rem;margin-bottom:4rem;& .type--grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:1rem;list-style:none;padding:0;margin:1rem 0;}& .splide{margin:1rem 0;.splide__pagination{transform:scale(1.5);}&:has(figcaption) .splide__pagination{bottom:4.5rem;}}}&.block-type-video{.imagefigure{max-width:50rem;}iframe{width:100%;height:100%;aspect-ratio:16/9;border:none;display:block;}}}}
/* content.css */
@layer components{.defaultcontent{.head{position:relative;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:2rem;}picture{width:100%;height:auto;}.headimage{width:100%;height:auto;object-fit:cover;}.title{position:absolute;z-index:2;text-align:center;display:flex;align-items:center;justify-content:center;z-index:1;letter-spacing:-0.02em;inset:0;font-size:clamp(2rem,10vw,5rem);font-family:var(--alice);color:white;text-shadow:0 0 15px rgba(0,0,0,0.7),1px 1px 0 rgba(0,0,0,0.5);padding:7% 1rem;@media (max-width:450px){align-items:flex-end;}}}}
/* footer.css */
@layer components{.footer{background-color:var(--erde);.das-eckerts &{background-color:var(--wasser);}.content{position:relative;display:flex;justify-content:space-between;align-items:center;gap:3rem;color:white;padding-top:3rem;padding-bottom:3rem;line-height:1.33;width:100%;& > *{min-width:150px;}@media (max-width:650px){flex-direction:column;text-align:center;}}.text{width:100%;a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.3em;}}.logolink{display:block;width:120px;}.logo{border:1px solid white;border-radius:0.3rem;}.wrap{display:flex;justify-content:space-between;align-items:center;}.copyright{width:100%;display:flex;flex-direction:column;align-items:flex-end;gap:0.5rem;text-align:right;@media (max-width:768px){position:absolute;right:0;}@media (max-width:650px){position:static;align-items:center;text-align:center;}}.arrowlink{display:block;width:1rem;height:1rem;fill:white;transition:transform 0.2s ease-in-out;border:1px solid white;width:4rem;height:4rem;display:flex;border-radius:50%;align-items:center;justify-content:center;svg{width:1rem;height:1rem;fill:white;transition:transform 0.2s ease-in-out;}&:hover{transform:translateY(-0.2rem);svg{transform:scale(1.3);}}}}}
/* header.css */
@layer components{.header{height:180px;padding:2rem 0;@media (max-width:768px){height:112px;}@media (max-width:450px){height:140px;}background-color:var(--erde);.das-eckerts &.default{background-color:var(--wasser);}.inner{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;width:100%;padding:0 5%;}.logolink{border:1px solid white;overflow:hidden;border-radius:0.3rem;width:110px;min-width:110px;@media (min-width:760px){width:180px;min-width:180px;}@media (max-width:450px){position:absolute;transform:translateX(-50%);left:50%;top:50px;}}.logo{transform:scale(1.035);}.burger{display:flex;gap:0.8em;align-items:center;justify-content:flex-start;&.close{position:relative;z-index:2;}svg{width:2rem;height:auto;fill:white;@media (max-width:760px){width:1.5rem;}}}.burgertext,.toplink{font-weight:700;color:white;text-transform:uppercase;font-size:1.7rem;@media (max-width:760px){font-size:1.2rem;}}.toplink,.burger{white-space:nowrap;text-shadow:0 0 7px rgba(0,0,0,0.2);}.toplink{position:relative;z-index:2;text-align:right;background:var(--orange);padding:3px 1.2rem;border-radius:0.3rem;transition:all 0.25s ease;&:hover{background:black;letter-spacing:0.008em;padding-inline:1.4rem;}}.metawrap,.burger{width:13rem;@media (max-width:760px){width:9rem;}@media (max-width:450px){width:auto;}}.metawrap{position:relative;top:-3px;display:flex;flex-direction:column;gap:1rem;align-items:flex-end;justify-content:flex-end;@media (max-width:450px){gap:0.8rem;flex-direction:row-reverse;flex-wrap:wrap;align-items:center;justify-content:flex-start;}}}}
/* hero.css */
@layer components{.hero{position:relative;height:90vh;margin-top:-180px;z-index:1;@media (max-width:650px){height:80vh;}& .text{position:absolute;bottom:0;left:0;right:0;width:100%;padding:2rem 2rem 0.5rem 2rem;font-family:var(--alice);letter-spacing:-0.02em;font-size:clamp(2.2rem,7vw,4rem);line-height:1.2;color:white;line-height:0.9;text-shadow:0 0 8px rgba(0,0,0,0.5);text-wrap:balance;max-width:none;text-align:center;.jump{display:block;text-align:center;margin-top:1rem;transition:transform 0.2s ease-in-out;svg{width:4rem;height:auto;fill:white;transition:transform 0.2s ease-in-out;}&:hover{svg{transform:translateY(0.2rem);}}}}& .single{height:100%;& img{width:100%;height:100%;object-fit:cover;}}& .splide{height:100%;& .splide__slide{height:90vh;@media (max-width:650px){height:80vh;}}& figure,& img,& video{width:100%;height:100%;object-fit:cover;}}& .splide__pagination{right:1rem;left:auto;bottom:2rem;transform-origin:bottom right;transform:scale(1.5);@media (max-width:650px){bottom:1rem;right:0;}}}}
/* imagefigure.css */
@layer components{.imagefigure{& img{display:block;width:100%;height:auto;object-fit:cover;}& figcaption{font-size:1rem;color:var(--text);font-weight:700;background:#f1f1f1;padding:1rem;text-align:center;}}}
/* imagestrip.css */
@layer components{.imagestrip{& .images{display:flex;flex-wrap:wrap;gap:1rem;padding:1rem;width:100%;list-style:none;@media (max-width:720px){gap:0.7rem;padding:0.7rem;}}& .item{display:flex;align-items:stretch;flex:auto;height:220px;min-width:250px;@media (max-width:720px){height:110px;min-width:125px;width:auto !important;}@media (max-width:500px){height:80px;min-width:96px;}}& .image{display:block;width:100%;height:auto;object-fit:cover;}}}
/* langnav.css */
@layer components{.langnav{.langlist{display:flex;align-items:center;gap:0.2rem;}.langitem{}.langlink{color:white;border:1px solid white;border-radius:0.3rem;padding:0.15rem 0.6rem;font-size:1rem;&:hover{background-color:white;color:var(--erde);}&[aria-current="true"]{text-shadow:0 0 7px rgba(0,0,0,0.2);font-weight:700;background-color:rgba(255,255,255,0.3);border-width:2px;}}}}
/* menu.css */
@layer components{[x-cloak]{display:none !important;}.menu{position:absolute;top:-5rem;left:0;right:0;background:var(--erde);background:rgba(85,76,75,0.95);padding:5rem 5% 2rem 5%;z-index:1;color:white;backdrop-filter:blur(5px);will-change:transform,opacity,border-radius;transform-style:preserve-3d;transform-origin:left top;perspective:500px;transition:transform 0.9s cubic-bezier(0.4,0,0.2,1.3),opacity 0.7s cubic-bezier(0.4,0,0.2,4),border-radius 0.9s ease-in-out;.das-eckerts &{background-color:rgba(12,45,105,0.95);}&[aria-hidden="true"]{opacity:0;pointer-events:none;border-radius:0 0 100% 0;transform:translateY(-80%) rotateY(60deg) scale(0.5);}&[aria-hidden="false"]{opacity:1;pointer-events:auto;transform:translateY(0) rotateX(0deg) scale(1);}.list{display:flex;flex-direction:column;gap:1rem;margin:2rem 0;}.item{position:relative;border-top:1px solid white;display:flex;flex-direction:row;align-items:flex-start;gap:0.5rem;}.link{color:white;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px;text-decoration-color:rgba(255,255,255,0.6);font-weight:500;font-size:1.2rem;display:block;padding:0.5rem 0;transition:color 0.2s ease;border-radius:2px;font-family:var(--alice);font-size:2rem;min-width:16rem;white-space:nowrap;display:inline-flex;align-items:center;justify-content:flex-start;gap:0.6rem;&::after{opacity:0;transition:opacity 0.12s ease;font-family:times new roman;content:"";width:16px;height:16px;background:url(/assets/img/thinarrowtop.svg) 50% 50% no-repeat;background-size:100% 100%;transform:rotate(90deg) translateX(3px);filter:invert();}&:hover{text-decoration:none;&::after{opacity:1;}}.submenu &{width:auto;text-decoration:none;font-size:1.2rem;font-family:var(--din);text-transform:uppercase;letter-spacing:0.04em;padding:0.1rem 0;&::after{width:12px;height:12px;transform:rotate(90deg) translateX(0);}&:hover{font-weight:700;}}&:focus-visible{outline:2px solid white;outline-offset:2px;}}.submenu{list-style:none;margin:0.9rem 0 0 0;display:flex;flex-direction:column;gap:0.75rem;width:100%;}.figure{min-width:320px;height:auto;margin:1.2rem 0 0 0;& img{display:block;width:100%;height:auto;object-fit:cover;}}}}
/* quicknavi.css */
@layer components{.quicknavi{padding:10%;display:flex;flex-direction:column;gap:3rem;@media (min-width:900px){flex-direction:row;padding:5rem 3rem;}& .item{display:flex;gap:1rem;width:100%;max-width:375px;margin:0 auto;font-size:clamp(1rem,2vw,1.2rem);@media (min-width:900px){flex-direction:column;flex:1;text-align:center;}}& .icon{min-width:3rem;min-height:3rem;max-height:3rem;text-align:center;margin:0 auto;@media (min-width:900px){min-width:4rem;min-height:4rem;max-height:4rem;}}& .content{border-left:3px solid var(--orange);padding-left:1rem;line-height:1.33;width:100%;text-wrap:balance;@media (min-width:900px){border-left:none;padding-left:0;}}& .title{text-transform:uppercase;margin-bottom:0.3rem;transition:all 0.2s ease;@media (min-width:900px){border-bottom:3px solid var(--orange);padding-bottom:0.3rem;width:fit-content;margin:0 auto 0.8rem;line-height:1.15;}&:hover{padding-left:0.55rem;padding-right:0.55rem;color:var(--orange);}}& .linktext{font-weight:700;margin-top:0.3rem;display:inline-flex;align-items:center;gap:0.3rem;white-space:nowrap;&:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.2em;}svg{width:0.8rem;height:0.8rem;fill:black;margin-left:0.3rem;transform:translateX(0);transition:transform 0.2s ease;.linktext:hover &{transform:translateX(0.25rem);}}}}}
/* rooms.css */
@layer components{.roomslist{display:grid;grid-template-columns:repeat(auto-fit,minmax(355px,1fr));grid-auto-rows:auto;column-gap:2rem;row-gap:1rem;margin:0 auto 4rem;}.roomcard{margin-bottom:1rem;grid-row:span 3;background-color:var(--erdelight);display:grid;grid-template-rows:subgrid;align-content:start;h2{font-size:1.75rem;line-height:1.2;font-weight:600;text-transform:uppercase;color:var(--erde);margin:1rem 1rem 0;}figcaption{line-height:1.5;font-size:1.125rem;padding:1rem 1rem 0;}footer{padding:1rem;display:flex;gap:2rem;justify-content:space-between;align-items:center;p{font-weight:600;font-size:1.333rem;color:var(--erde);}}& .mews{width:fit-content;font-weight:700;text-transform:uppercase;font-size:1.2rem;padding:0.5rem 2rem;background-color:var(--erde);color:white;border-radius:0.3rem;transition:padding 0.12s ease,background 0.12s ease;&:hover,&:focus,&:active{padding-right:2.5rem;background:black url(/assets/img/arrow-white.svg) no-repeat 88% center;background-size:0.7rem;}}}}
/* textimage.css */
@layer components{.textimage{display:flex;flex-direction:row;align-items:center;gap:5%;&:has(figcaption) .usertext{margin-bottom:2.2rem;}& > *{flex:1;}&.left{flex-direction:row-reverse;}@media (max-width:768px){flex-direction:column !important;gap:1.5rem;}}}
/* welcome.css */
@layer components{.welcome{padding:12% 8%;background-color:var(--lehm);text-align:center;display:flex;flex-direction:column;gap:3em;@media (max-width:650px){padding:3rem 1rem;}& .title{font-size:clamp(2rem,7vw,4rem);letter-spacing:-0.02em;font-family:var(--alice);line-height:1.1;}& .text{font-size:clamp(1.2rem,4vw,1.6rem);line-height:1.5;font-family:var(--din);text-wrap:balance;max-width:50ch;margin:0 auto;}& .nav{display:flex;justify-content:center;gap:1.5em;margin:0 auto;font-size:clamp(1.2rem,4vw,1.6rem);flex-wrap:wrap;@media (max-width:650px){flex-direction:column;gap:1em;}}& .link{font-weight:700;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:0.2em;white-space:nowrap;}& .mews{font-weight:700;text-transform:uppercase;font-size:1.2rem;padding:0.5rem 2rem;background-color:var(--orange);white-space:nowrap;color:white;border-radius:0.3rem;transition:background-color 0.2s ease;&:hover{background-color:black;}}}}
