/*
font-family: 'Mona-Sans';
*/

:root {
    --primary: #F47920;
    --secondary: #FFAB52;
    --white: #FFFFFF;
    --black: #000000;
}

body { overflow-x: hidden;}
html{ scrollbar-width: thin; -ms-overflow-style: none; scrollbar-color: var(--primary) #7D7E81; scroll-behavior: smooth;}
body{ padding:0; margin:0; font-size:16px; color:var(--black); font-family: 'Mona-Sans';}
a, button{outline:none !important; text-decoration:none; box-shadow:none; transition:all .4s ease-in-out;}
a:hover, a:focus, select:focus, button:focus,.btn:focus,btn.focus { outline:none; text-decoration:none; box-shadow:none;}
* { margin:0; padding:0;}
img { border:none; vertical-align:middle; max-width:100%; height:auto;}
li{ list-style:none;}
h1, h2, h3, h4, h5, h6{ outline:none !important;}
input, select, textarea, button{ outline:none !important; box-shadow:none;}
input, textarea, select{ /*-moz-appearance: none; -webkit-appearance: none;*/ box-shadow:none !important;}

.container{ width:90%; max-width: 1640px; margin:0 auto; padding:0;}

/* Hero */
.hero-section { min-height: 100vh;}
.hero-section .left-content { padding: 60px; display: flex; flex-direction: column; justify-content: space-between; align-items: center; height: 100vh; text-align: center;}
.hero-section .brand-logo{ margin-bottom: 30px; max-width: 500px;}
.hero-section h1 { font-family: 'Playfair Display', serif; font-size: 42px; margin-bottom: 25px; color: var(--white);}
.hero-section .subtitle{ margin: 0 0 20px; color: var(--white); font-size: 20px;}
.hero-section .company-info{ margin-bottom: 30px;}
.hero-section .company-info p { margin-bottom: 6px; color: var(--white); font-size: 20px;}
.hero-section .company-info p strong{ font-weight: 700;}
.hero-section .company-info p a{ color: var(--primary);}
.hero-section .company-info p a:hover{ color: var(--white);}
.hero-section .company-info span{ font-size: 20px;}
.hero-section .social_icon{ display: flex; gap: 20px; align-items: center; margin-top: 30px;}
.hero-section .social_icon span{ font-size: 18px; font-weight: 700; color: var(--white);}
.hero-section .social_icon a{ border: 1px solid var(--primary); border-radius: 50px; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;}
.hero-section .social_icon a:hover{ background: var(--primary);}
.hero-section .social_icon a img{ width: 20px;}
.whatsbutton{ position: fixed; bottom: 30px; right: 30px; width: 50px;}
.hero-section figure { margin: 0; padding: 0; position: absolute; top: 0; left: 0; z-index: -1; width: 100%;}
.hero-section figure::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.6);}
.hero-section figure img{ width: 100%; height: 100vh; object-fit: cover;}