/*
Theme Name: Coo'ee - Bettio
Author: Coo'ee Italia
Description: Coo'ee custom theme
Version: 1.0
*/
/******************/
/*** VARIABLES ****/
/******************/
/****************************  General  ***************************************/
html { border: none; margin: 0; padding: 0; min-height: 100vh; box-sizing: border-box; }

body { background-color: #F7F7F7; font-family: "halyard-text", sans-serif; font-style: normal; font-size: 16px; font-weight: 400; line-height: 1.5; height: 100%; display: block; color: #0a0a0a; }

.boxed-xl { margin-left: auto; margin-right: auto; max-width: 1920px; width: 100%; }

.boxed-lg { margin-left: auto; margin-right: auto; max-width: 1300px; width: 100%; }

.boxed-md { margin-left: auto; margin-right: auto; max-width: 1070px; width: 100%; }

.boxed-sm { margin-left: auto; margin-right: auto; max-width: 740px; width: 100%; }

.min-w-btn { min-width: 12rem; }

/****************************  Typography  ************************************/
h1, h2, h3, h4, h5, h6 { font-family: "halyard-display", sans-serif; font-weight: 600; }

h1 { font-size: 45px; line-height: 1.3; }

h2 { font-size: 40px; line-height: 1.3; }

h3 { font-size: 20px; font-family: "halyard-text", sans-serif; line-height: 1.3; }

h4 { font-size: 18px; font-family: "halyard-text", sans-serif; color: rgba(10, 10, 10, 0.5); font-weight: 400; }

p { line-height: 1.5; font-size: 16px; color: rgba(10, 10, 10, 0.7); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.font-lineare { font-family: "halyard-text", sans-serif; }

.bg-grigio { background-color: #F7F7F7; }

.bg-nero { background-color: #0a0a0a; }

.btn { background-color: #DFA832; color: #fff; border-radius: 9999px; text-decoration: none; padding: 10px 25px; font-size: 15px; font-weight: 500; letter-spacing: 0.3px; display: inline-block; transition: all linear 300ms; }

.btn:hover { background-color: #F4C053; }

.pagination .page-numbers { padding: 0 2px; margin: 8px; opacity: 0.6; }

.pagination .page-numbers.current { font-weight: 700; opacity: 1; }

ul.lista-doc li a { background: url("/wp-content/uploads/icon-doc.svg") no-repeat center left; background-size: 22px; }

a.link-arrow { color: #0a0a0a; transition: color linear 200ms; background: url("/wp-content/uploads/arrow.svg") no-repeat center right 20px; background-size: 12px; }

a.link-arrow:hover { color: #DFA832; }

.outer-landscape { padding-top: 67%; }

.modal__overlay { background: rgba(0, 0, 0, 0.9); z-index: 9999; }

.modal__overlay .modal__container { height: auto; max-height: 100vh; padding: 75px 30px; position: relative; overflow-y: auto; -ms-overflow-style: none; scrollbar-width: none; }

.modal__overlay .modal__container::-webkit-scrollbar { display: none; }

.modal__overlay .modal__container .modal__header { padding: 20px; position: absolute; width: 100%; top: 0; right: 0; text-align: right; }

.modal__overlay .modal__container .modal__content { line-height: 1.5; }

.modal__overlay .modal__container .modal__cta h2 { font-size: 30px; }

/**************************\ Animation Style \**************************/
@keyframes mmfadeIn { from { opacity: 0; }
  to { opacity: 1; } }

@keyframes mmfadeOut { from { opacity: 1; }
  to { opacity: 0; } }

@keyframes mmslideIn { from { transform: translateY(15%); }
  to { transform: translateY(0); } }

@keyframes mmslideOut { from { transform: translateY(0); }
  to { transform: translateY(-10%); } }

.micromodal-slide { display: none; }

.micromodal-slide.is-open { display: block; }

.micromodal-slide[aria-hidden="false"] .modal__overlay { animation: mmfadeIn 0.3s cubic-bezier(0, 0, 0.2, 1); }

.micromodal-slide[aria-hidden="false"] .modal__container { animation: mmslideIn 0.3s cubic-bezier(0, 0, 0.2, 1); }

.micromodal-slide[aria-hidden="true"] .modal__overlay { animation: mmfadeOut 0.3s cubic-bezier(0, 0, 0.2, 1); }

.micromodal-slide[aria-hidden="true"] .modal__container { animation: mmslideOut 0.3s cubic-bezier(0, 0, 0.2, 1); }

.micromodal-slide .modal__container, .micromodal-slide .modal__overlay { will-change: transform; }

.schermata { width: 170%; }
