@import 'tailwindcss';
@import './reset.css';
@import './fonts.css';
@import './btn.css';
@import './inputs.css';
@import './menu.css';
@import './select.css';
@import './radiogroups.css';
@import './templates/template-travel/main.css';

@source '../../vendor/laravel/framework/src/Illuminate/Pagination/resources/views/*.blade.php';
@source '../../storage/framework/views/*.php';
@source '../**/*.blade.php';
@source '../**/*.js';

@theme {
   --font-main: "Montaga", serif;
   --font-secondary: "Onest", sans-serif;
   --font-mono: "Space Mono", monospace;
   --font-roboto: "Roboto", sans-serif;
   --font-antura: "Antura Script", sans-serif;
   --font-aboreto: "Aboreto", system-ui;

   --color-primary100: #C999C7;
   --color-primary200: #363BAD;
   --color-primary300: #D3D3FF;
   --color-primary400: #EFE5DC;
   --color-black: #252727;
   --color-secondary: #f0f0f4;

   --color-complement300: #373760;
   --color-complement400: #D9D9D9;
   --color-complement500: #2A172B;

   --color-black: #0F1010;
   --color-white: #FFFFFF;
   --color-gray: #797979;

   --color-main: #4D3D7E;
   --color-accent: #8B8494;
   --color-bgfooter: #625D74;

   --text-size-hero: clamp(2.625rem, calc(1vw + 1.5rem), 3.625rem);
   /*
    mínimo: 2.625rem (≈ 42px)
    máximo: 3.625rem (≈ 58px)
  */

   /* para h1 */
   --text-size-main: clamp(2rem, calc(0.9vw + 1.25rem), 2.25rem);
   /*
  mínimo: 2rem (≈ 32px)
  máximo: 2.25rem (≈ 36px)
*/

   /* para h2 */
   --text-size-title: clamp(1.5rem, calc(0.9vw + 1.25rem), 1.75rem);
   /*
  mínimo: 1.5rem (≈ 24px)
  máximo: 1.75rem (≈ 28px)
*/

   /* para h3 */
   --text-size-subtitle: clamp(1.375rem, calc(0.9vw + 1.25rem), 1.5rem);
   /*
  mínimo: 1.375rem (≈ 22px)
  máximo: 1.5rem (≈ 24px)
*/


   /* para h4 */
   --text-size-heading: clamp(1.125rem, calc(0.65vw + 0.875rem), 1.25rem);
   /*
  mínimo: 1.125rem (≈ 18px)
  máximo: 1.25rem (≈ 20px)
*/

   /* small */
   --text-size-small-heading: clamp(0.75rem, calc(0.6vw + 0.8rem), 0.875rem);
   /*
  mínimo: 0.75rem (≈ 12px)
  máximo: 0.875rem (≈ 14px)
*/
   --text-parrafo: clamp(0.875rem, calc(0.5vw + 0.75rem), 0.875rem);
}

h1 {
   line-height: 1.6;
}

h2,
h3,
h4,
h5,
p {
   line-height: 1.4;
}

.line-max {
   line-height: 2;
}

.container {
   @apply px-8 sm:px-12 md:px-16 mx-auto;
}

.container-center {
   @apply max-w-5xl mx-auto;
}

.main-wrap {
   @apply pt-24 lg:pt-0 lg:pl-[240px];
}

.parrafo {
   letter-spacing: 0.14px;
}

.mask-container-title {
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
   -webkit-mask-size: cover;
   mask-size: cover;
   -webkit-mask-position: top;
   mask-position: top;
}

.mask-container-footer {
   -webkit-mask-repeat: no-repeat;
   mask-repeat: no-repeat;
   -webkit-mask-size: contain;
   mask-size: contain;
   -webkit-mask-position: top;
   mask-position: top;
}

.item-name{
   @apply absolute top-[10%] xl:top-[5%] left-0 w-full;
}