[x-cloak] {
  display: none !important;
}
@import "variables";
@import "buttons";
@import "container";
@import "fonts";
@import "input";
@import "list";
@import "typography";
@import "card";
@import "pagination";
@import "alpine";
@tailwind base;
@tailwind components;
@tailwind utilities;
/* Buttons */
input[type="submit"].button-primary,
[class^="button-"] {
  @apply inline-flex px-5 justify-center items-center text-sm-clamp transition-all duration-200 rounded-full font-sans no-underline cursor-pointer;

  height: 42px;
}

.button-primary,
input[type="submit"].button-primary {
  @apply px-4 text-center text-white uppercase bg-black hover:bg-green-700;
}

.button-primary.light {
  @apply hover:bg-green-300 hover:text-black;
}

.button-chevron {
  @apply text-white bg-black hover:bg-green-700 w-11 h-11 px-0;
}

.button-secondary {
  @apply px-3 bg-green-300 hover:bg-green-700 hover:text-white;
}

.button-tertiary {
  @apply bg-white w-full sm:w-fit border border-transparent hover:border-green-700/50 uppercase;

  box-shadow: 0px 4px 6px 0px rgba(0, 0, 0, 0.04);
}

.button-tertiary:hover {
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.04);
}
.card * {
  @apply transition-all duration-200 ease-out;
}

.card h3 {
@apply hyphenate;
}
@layer components {
  .container {
    @apply px-5 relative mx-auto;

    width: min(100%, 1280px);
    max-width: min(100%, 1280px);
  }

  .inner-container {
    @apply flex flex-col mx-auto;
    width: var(--form-width);
  }

  [class^="wrapper"] {
    @apply flex flex-col gap-6 lg:gap-8 rounded-2xl lg:rounded-4xl py-4 lg:py-10 px-4 lg:px-8 xl:px-14;
  }

  .wrapper-border {
    @apply border border-grey-300 w-full md:w-126; 
  }
}
/* @author: lemone.com */
/* Fonts */
@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-Medium-e74c77581ede10a6220042a795b693b49c2bf5637c279b1ff06c00c2e267c192.woff2) format('woff2'),
      url(/assets/ZillaSlab-Medium-1a7c7b2be9e6e66cf9ecd7bbc0c313f12ceef0672d8a1918e4a09491e7b71fc9.woff) format('woff'),
      url(/assets/ZillaSlab-Medium-8fab48deba461be73466a5a1a20d004a0ecc2c025b8a2aec117200a8adee0bb5.ttf) format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-BoldItalic-05f127108114dff64cc94e5b8337f1dbb705e2fde39d10eabe0f9a13de7aac6f.woff2) format('woff2'),
      url(/assets/ZillaSlab-BoldItalic-7ebc9e8f36b83fa87dfd149a30d224cf13cd3004e12137589d5d85e1e93abd65.woff) format('woff'),
      url(/assets/ZillaSlab-BoldItalic-8632fc04ff92e257f9c8c7cfecd6a8e060cd9877e327a6dee4ab159044c4398a.ttf) format('truetype');
  font-weight: bold;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-Bold-3a43c331688ed8e89d7fe7ef876635482cb12d19aab36b1bb1c501c22476e1a6.woff2) format('woff2'),
      url(/assets/ZillaSlab-Bold-82aebd222e784afe78b5b10b1b493e46f6ee658c7560a9f312366c30c814189b.woff) format('woff'),
      url(/assets/ZillaSlab-Bold-7394a44e27bced441a83102097ede971183b02f6ebeef949eb809c275624a62d.ttf) format('truetype');
  font-weight: bold;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-SemiBold-ce34b90ba544f2c978d45122cd5cd55509ab143254756ae3aceca34681a00724.woff2) format('woff2'),
      url(/assets/ZillaSlab-SemiBold-68dede6789f2518a780e24c294bd8b5391f0140b3b38be9fc28234bbfa5e2ea9.woff) format('woff'),
      url(/assets/ZillaSlab-SemiBold-151e770d45dd55e3d0101001847b0afc0d9f37e9c5ec6f02144226d2aeceaf5c.ttf) format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-Light-77485289f0119576c004111d0e536b661fb83d609571fdc2d9bc6a2fdc56e83b.woff2) format('woff2'),
      url(/assets/ZillaSlab-Light-c382c194c323c69a827aa9fe8743ba971b67db96693486866d654633fb0bdc75.woff) format('woff'),
      url(/assets/ZillaSlab-Light-7a96086a4030e78e88ecc252929f3b67acfb48bb6ea0966e3ab77da8dd89ff64.ttf) format('truetype');
  font-weight: 300;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-Regular-b9c29df03f5f09c0aca357d9c0394c9939c7e11f0ad813ff34c451b527af6454.woff2) format('woff2'),
      url(/assets/ZillaSlab-Regular-cc5c4587c6bb6a37ee78ef563fa72846adca76357ec4f8036926d13bd6d968fe.woff) format('woff'),
      url(/assets/ZillaSlab-Regular-12a0d67be871ed1f257e20e7f31903c5a816759ee79d68d2904bb5a0ac812a50.ttf) format('truetype');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-MediumItalic-ec2b95849bb32d42a94f86cee33278c9581aad60c8205654aa9bdbbb607a1904.woff2) format('woff2'),
      url(/assets/ZillaSlab-MediumItalic-392c8f809ea4b40532be6f9dc54c0f3ee1cc181c3332a3ac4b99f95b57d0b30a.woff) format('woff'),
      url(/assets/ZillaSlab-MediumItalic-ab312ce8951e4fad617389fbf9a964e17819fc01b59712a58f619d1e827b2def.ttf) format('truetype');
  font-weight: 500;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-Italic-72cb3d7a4d13c5a34dadd77bb89fe875464ce8deb12797ec249b4704a442130a.woff2) format('woff2'),
      url(/assets/ZillaSlab-Italic-17e62959db1a0feeee7572d1ff01d128616af5cef7831b9455ddf23684bba0f4.woff) format('woff'),
      url(/assets/ZillaSlab-Italic-5ec9f68b7ed63ed2b5fc55b29d43bcba713ef43a22633130c6b1f907621a1965.ttf) format('truetype');
  font-weight: normal;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-LightItalic-fdefab62d6947bdc79ddd34a56761fee7d775d5aed5fb7102c3ca6610bf1f8a0.woff2) format('woff2'),
      url(/assets/ZillaSlab-LightItalic-def2d96629db5cbe6bbeede49e884c835805ae84c29a5051ce49ab6f5797593a.woff) format('woff'),
      url(/assets/ZillaSlab-LightItalic-223b8f5ddda862960266a0c6d735de79c75f8774dbb2c5870f93d2232f70322e.ttf) format('truetype');
  font-weight: 300;
  font-style: italic;
}

@font-face {
  font-family: 'Zilla Slab';
  font-display: swap;
  src: url(/assets/ZillaSlab-SemiBoldItalic-7c168169e8ae94a7669d2571382106ed73a9a4ba941aece4b76524fd93519a9b.woff2) format('woff2'),
      url(/assets/ZillaSlab-SemiBoldItalic-1823e375b3f90c434fcac1052b3588eedd5b5cdc3b20314f79db4996925d6a7d.woff) format('woff'),
      url(/assets/ZillaSlab-SemiBoldItalic-bc5a9abfe906177f3e9dfb97643b38b6e9c7eeb2036a50c7d05b9b821abf0c3e.ttf) format('truetype');
  font-weight: 600;
  font-style: italic;
}
.header-dropdown {
  top: calc(100% + 0.5rem);

  @media screen and (min-width: 1024px) {
    top: calc(100% + 1rem);
  }
}
html {
  @apply scroll-smooth antialiased;
}

form {
  @apply flex flex-col gap-4;

  width: var(--form-width);
}

/* Checkbox  */
.input.boolean {
  @apply flex gap-2 items-center cursor-pointer;
}

.input.boolean input {
  @apply w-5 h-5 transition-all cursor-pointer;
}

.input.boolean input[type="checkbox"]:checked {
  @apply bg-green-700 cursor-pointer;
}

.input.boolean input[type="checkbox"]:focus,
.input.boolean input[type="checkbox"]:focus-within {
  @apply ring-green-700;
}

/* Inputs with floating label */
.input.email,
.input.password,
.input.search,
.input.string,
.input.text,
.input.date_select,
.input.url {
  @apply relative;

  &.field_with_errors {
    input {
      @apply ring-red-500;
    }

    .error,
    label {
      @apply text-red-500;
    }
  }
}

.input.email label,
.input.password label,
.input.search label,
.input.string label,
.input.text label,
.input.date_select label,
.input.url label {
  @apply absolute font-medium text-black transition-all left-2 top-2 cursor-text;
}

.input.email input,
.input.password input,
.input.search input,
.input.string input,
.input.text input,
.input.input.date_select input,
.input.url input {
  @apply block w-full rounded-md border-0 py-1.5 text-black shadow-sm ring-1 ring-inset ring-green-700/40 placeholder:text-green-700/40 focus:ring-2 focus:ring-inset focus:ring-green-700 sm:text-sm sm:leading-6;
}

.input.search input {
  @apply block w-full rounded-md border-0 py-1.5 text-black shadow-sm ring-1 ring-inset ring-green-700/40 placeholder:text-black/60 focus:ring-2 focus:ring-inset focus:ring-green-700 sm:text-sm sm:leading-6;
}

.input.email:has(input:not(:placeholder-shown)) label,
.input.password:has(input:not(:placeholder-shown)) label,
.input.search:has(input:not(:placeholder-shown)) label,
.input.string:has(input:not(:placeholder-shown)) label,
.input.text:has(input:not(:placeholder-shown)) label,
.input.date_select:has(input:not(:placeholder-shown)) label,
.input.url:has(input:not(:placeholder-shown)) label,
.input.email:focus-within label,
.input.password:focus-within label,
.input.search:focus-within label,
.input.string:focus-within label,
.input.text:focus-within label,
.input.date_select:focus-within label,
.input.url:focus-within label {
  @apply -top-2 inline-block bg-white px-1 text-xs;
}
.list-checks li {
  @apply relative pl-7;
}

.list-checks li::before {
  @apply w-4 h-4 absolute top-0 left-0;
  content: url(/assets/check-68287e9bea36ac98f1808e3460b448f57e2af2e361d599c6b15612d65404f459.svg);
}
.pagination {
  @apply flex justify-center items-center;
}

.pagination .page {
  @apply p-1.5 text-black border border-r-0 border-black first:rounded-l-full last:rounded-r-full;
}

.pagination .page:first-child {
  @apply py-1.5 px-2;
}

.pagination .page:last-child {
  @apply py-1.5 px-2 border-r;
}

.pagination .page.gap,
.pagination .page a {
  @apply p-1.5;
}

.pagination .page.active {
  @apply bg-black text-white;
}
body {
  @apply flex flex-col;
  font-weight: 400;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -khtml-font-smoothing: antialiased;
  -apple-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  @apply font-serif;
}

[class^="border-title"] {
  @apply flex justify-center items-center text-center font-serif;
}

.border-title {
  @apply relative mb-8 uppercase text-5xl-clamp;
}

[class^="border-title"]::before,
[class^="border-title"]::after {
  content: "";
  border-top: 1px solid currentColor;
  flex: 1 0 20px;
}

[class^="border-title"] span {
  @apply relative px-3 xs:px-6;
}

.border-title-widget {
  @apply mb-5;
  font-size: 1.625rem;
  line-height: 1.2;
}

.border-title-form {
  @apply text-5xl-clamp mb-4;

  line-height: 1.2;
}

.custom-link {
  @apply font-semibold underline text-green-700 hover:text-black transition-all hover:no-underline;
}

.hyphenate {
  word-wrap: break-word;
  overflow-wrap: break-word;

  -webkit-hyphens: auto;
  -moz-hyphens: auto;
  hyphens: auto;
}
:root {
  --form-width: min(500px, 100%);
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */