/*  grid  */
main > .grid:first-child { padding: calc(var(--gutter-y, 2rem) * .5) var(--gutter-x, 2rem) var(--gutter-y, 2rem) var(--gutter-x, 2rem); }
main > .grid .grid + .grid { margin-top: var(--gutter-y, 2rem); }

.grid > .wrapper { max-width: calc(var(--max-width, 76rem)); }

.grid-min-height-25vh { min-height: 25lvh; }
.grid-min-height-50vh { min-height: 50lvh; }
.grid-min-height-75vh { min-height: 75lvh; }
.grid-min-height-100vh { min-height: 100lvh; }

.grid-bgcolor-beige { background-color: var(--color-beige-90, #EADFC8); }

.grid-bgcolor-orange { background-color: var(--color-orange, #F29C50); color: var(--color-white, #FFFFFF); --color-input-border: var(--color-white, #FFFFFF); }
.grid-bgcolor-orange :is(h1, h2, h3, h4, h5, h6, a:not(.button), a:not(.button):hover) { color: inherit; }
.grid-bgcolor-orange li::marker { color: var(--color-white, #FFFFFF); }


/*  image  */
.image-max-width-25percent > :is(*, picture) { max-width: min(100%, 25%); }
.image-max-width-50percent > :is(*, picture) { max-width: min(100%, 50%); }
.image-max-width-75percent > :is(*, picture) { max-width: min(100%, 75%); }
.image-max-width-25vw > :is(*, picture) { max-width: min(100%, 25vw); }
.image-max-width-50vw > :is(*, picture) { max-width: min(100%, 50vw); }
.image-max-width-75vw > :is(*, picture) { max-width: min(100%, 75vw); }



/*  masonry  */
.masonry { --masonry-gap-x: 1rem; --masonry-gap-y: 1rem; }


/*  hoverbox  */
/*.hoverbox + .hoverbox { margin-top: 1rem; }*/
a.hoverbox { padding: 0; margin: 0; }
a.hoverbox:hover { background: none; }
.hoverbox .wrapper { z-index: 1; text-shadow: 0 0 .25rem rgba(0, 0, 0, 1); font-weight: 600; }
.hoverbox .box { opacity: 1; transform: scale(1); background: none; }
.hoverbox .image img { transition: transform .5s ease, filter .5s ease; filter: none; }
.hoverbox:hover .image img, .hoverbox:active .image img { transition: transform .5s ease, filter .5s ease; transform: scale(1.1); filter: blur(1px); }
.hoverbox .link:focus-visible .box { outline: 2px solid var(--color-link-focus); }
@media (max-width: 32rem) {
    .hoverbox .title { font-size: 1.25rem; }
}



/*  link  */
.link { color: var(--color-link, #669900); text-decoration: underline; }
.link:hover { color: var(--color-link-hover, #669900); text-decoration: underline; }



/*  button  */
.button {
    display: inline-block;
    padding: .5em 1.125em;
    border: 2px solid var(--color-orange);
    background: var(--color-orange);
    color: var(--color-white, #FFFFFF);
    font-family: var(--font-family, inherit);
    font-size: var(--font-size, 1rem);
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    transition: color .2s ease, border .2s ease, background-color .2s ease, box-shadow .2s ease;
    cursor: pointer;
}
.button.disabled { background: var(--color-grey); }
.button:hover, .button:focus-visible { background: var(--color-white, #FFFFFF); color: var(--color-orange); }
.button.disabled:hover, .button.disabled:focus-visible { background: var(--color-light-grey, #E9E9E9); cursor: default; }
.button.mailformreset { background: var(--color-light-grey, #E9E9E9); color: #990000; }
.button.mailformreset:hover, .button.mailformreset:focus-visible { background: var(--color-white, #FFFFFF); }
.button > i.fas:first-child, .button > i.far:first-child { margin-right: .25em; }



/*  mailform  */
.mailform .label { font-weight: normal !important; }
.mailform .label .mandatory:after { content: '*' !important; color: #990000 !important; }
.mailform .message.success { border-color: var(--color-orange); background-color: transparent; }
.mailform form { display: flex; flex-flow: row wrap; justify-content: space-between; gap: 0 2rem; }
.mailform .group { width: 100%; }
.mailform .group:nth-child(3n + 1), .mailform .group:nth-child(3n + 2) { width: calc(50% - 1rem); }
.mailform .valid .label::after { background-color: var(--color-orange); }
.mailform .mailformtextarea { min-height: 12em; }



/*  horizontal rule  */
hr { border: 0; border-top: 2px solid var(--color-light-grey, #B1B1B1); width: 100%; height: 0; margin: 1.5em auto; }
h1 + hr, h2 + hr, h3 + hr, h4 + hr { margin-top: .5em; }
@media (max-width: 40rem) {
    hr { margin: 1em auto; }
}



/*  text  */
.bgimage .text-style-large, .bgimage .text-style-medium { color: var(--color-white, #FFFFFF); text-shadow: 0 0 5rem rgba(0, 0, 0, .4), 0 0 2rem rgba(0, 0, 0, .3), 0 0 .5rem rgba(0, 0, 0, .2); }
.bgimage .text-style-large:first-child { margin-top: .5em; }
.text-style-large { font-size: 4em; line-height: 1.25; font-weight: 600; }
p.text-style-large:not(:last-child) { margin-bottom: 1rem; }
.text-style-medium { font-size: 2.5em; line-height: 1.25; font-weight: 500; }
.text-style-subheader { font-size: 1.625em; font-weight: 600; line-height: 1.25; }
.text-style-subheader:not(:last-child) { padding-bottom: .5em; margin-bottom: 0; }
p .fas, p .fab, .contact-block .fas, .contact-block .fab { color: var(--color-grey, #B1B1B1); margin-right: .25em; }
.contact-block { margin: 1em 0 2em 0; list-style-type: none;}
.contact-block li { margin: 0; }
.contact-block li .fas ,.contact-block li .fab { width: 1em; text-align: center; }
.contact-block li:not(:last-child) { margin-bottom: .5em; }
@media (max-width: 60rem) {
    .text-style-large { font-size: 3em; }
    .text-style-medium { font-size: 1.75em; }
}
@media (max-width: 40rem) {
    .text-style-large { font-size: 2em; }
    .text-style-medium { font-size: 1.25em; }
}



/*  accordion menu  */
.accordion { border: 2px solid var(--color-light-grey); transition: border-color .3s ease; background: var(--color-white); }
.accordion.opened { border-color: var(--color-orange); }
.accordion-head { background: var(--color-white); border-bottom: 0; padding-right: 4rem; transition: border-color .3s ease; }
.accordion-head:focus { outline: none; }
.accordion-head:focus-visible { outline: 2px solid var(--color-link-focus); outline-offset: -4px; }
.accordion-head::after { content: 'i'; top: 50%; right: 1rem; margin-top: -1rem; width: 2rem; height: 2rem; line-height: 2rem; border-radius: 50%; font-size: 1.375rem; text-align: center; color: var(--color-white); background: #0076CC; transition: none; }
.accordion-head :is(h1, h2, h3, h4, h5, h6) { color: var(--color-text, #000000); }
.accordion.opened .accordion-head::after { content: '+'; font-size: 3rem; color: var(--color-link); background: none; }
.accordion-content-wrapper { padding-top: 0; }
.accordion + .accordion { margin-top: -1em; }



/*  blockquote  */
.blockquote::before { content:  url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='%23A1AB86'><path d='M9.983 3v7.391C9.983 16.095 6.252 19.961 1 21l-.995-2.151C2.437 17.932 4 15.211 4 13H0V3h9.983zM24 3v7.391c0 5.704-3.748 9.571-9 10.609l-.996-2.151C16.437 17.932 18 15.211 18 13h-3.983V3H24z'/></svg>"); }
.blockquote::after { border-left: 1px solid var(--color-orange); }