body {box-sizing: border-box;}
* {margin: 0; padding: 0; font-family: 'Inter', sans-serif;}
.serif-font {font-family: 'Crimson Pro', serif;}
.nav-bar {
position: fixed;
top: 0;
left: 0;
right: 0;
background: rgba(255, 255, 255, 0.98);
backdrop-filter: blur(10px);
z-index: 100;
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
}
.hero-section {
min-height: 100%;
position: relative;
}
.slider-container {
position: relative;
}
.slide {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
transition: opacity 1.5s ease-in-out;
}
.slide.active {
opacity: 1;
}
.section-title {
position: relative;
display: inline-block;
font-size: 3.5rem;
}
.section-title::after {
content: '';
position: absolute;
bottom: -5px;
left: 0;
width: 80px;
height: 4px;
background: #F4811E;
}
.section-title.center::after {
left: calc(50% - 40px) !important;
}
.badge-experience {
position: absolute;
top: -20px;
right: -20px;
width: 100px;
height: 100px;
background: linear-gradient(135deg, #F4811E 0%, #ff6b00 100%);
border-radius: 50%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
color: white;
font-weight: bold;
box-shadow: 0 10px 40px rgba(244, 129, 30, 0.4);
z-index: 10;
}
.certification-badge {
background: white;
border: 2px solid #e5e7eb;
border-radius: 12px;
padding: 1rem;
text-align: center;
transition: all 0.3s ease;
}
.certification-badge:hover {
border-color: #2D2F91;
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.1);
transform: translateY(-4px);
}
.service-box {
background: white;
border: 1px solid #e5e7eb;
transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
position: relative;
overflow: hidden;
}
.service-box::before {
content: '';
position: absolute;
top: 0;
left: 0;
width: 0;
height: 3px;
background: #F4811E;
transition: width 0.4s ease;
}
.service-box:hover {
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.12);
transform: translateY(-8px);
border-color: #F4811E;
}
.service-box:hover::before {
width: 100%;
}
.stat-card {
background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
backdrop-filter: blur(10px);
border: 1px solid rgba(255, 255, 255, 0.2);
}
.gallery-item {
position: relative;
overflow: hidden;
border-radius: 16px;
box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
transition: all 0.4s ease;
background: #f3f4f6;
}
.gallery-item:hover {
transform: translateY(-8px);
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.2);
}
.gallery-item svg {
width: 100%;
height: 300px;
transition: transform 0.4s ease;
}
.gallery-item:hover svg {
transform: scale(1.05);
}
.gallery-overlay {
position: absolute;
bottom: 0;
left: 0;
right: 0;
background: linear-gradient(to top, rgba(0, 0, 0, 0.9), transparent);
color: white;
padding: 1.5rem;
transform: translateY(100%);
transition: transform 0.4s ease;
}
.gallery-item:hover .gallery-overlay {
transform: translateY(0);
} .field-wrapper {
position: relative;
}
.field-input-wrapper {
position: relative;
}
.form-input {
border: 2px solid #e5e7eb;
transition: all 0.3s ease;
background: white;
width: 100%;
}
.form-input:focus {
outline: none;
border-color: #2D2F91;
box-shadow: 0 0 0 4px rgba(45, 47, 145, 0.1);
} .form-input.success,
.field-input-wrapper.success .form-input {
border-color: #10b981;
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.1);
}
.form-input.success:focus,
.field-input-wrapper.success .form-input:focus {
border-color: #10b981;
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.15);
} .form-input.error,
.field-input-wrapper.error .form-input {
border-color: #ef4444;
box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.1);
animation: shake 0.4s ease;
}
.form-input.error:focus,
.field-input-wrapper.error .form-input:focus {
border-color: #ef4444;
box-shadow: 0 0 0 4px rgba(239, 68, 68, 0.15);
} @keyframes shake {
0%, 100% { transform: translateX(0); }
10%, 30%, 50%, 70%, 90% { transform: translateX(-5px); }
20%, 40%, 60%, 80% { transform: translateX(5px); }
} .field-icon {
position: absolute;
right: 12px;
top: 50%;
transform: translateY(-50%);
display: flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
pointer-events: none;
transition: all 0.3s ease;
opacity: 0;
}
.field-icon.error-icon {
opacity: 1;
color: #ef4444;
}
.field-icon.success-icon {
opacity: 1;
color: #10b981;
}
textarea + .field-icon {
top: 20px;
transform: translateY(0);
} .field-error-message {
display: none;
color: #ef4444;
font-size: 0.875rem;
margin-top: 0.5rem;
padding-left: 0.25rem;
animation: slideDown 0.3s ease;
}
.field-error-message:not(:empty) {
display: block;
}
@keyframes slideDown {
from {
opacity: 0;
transform: translateY(-5px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.btn-submit {
background: linear-gradient(135deg, #F4811E 0%, #ff6b00 100%);
transition: all 0.3s ease;
position: relative;
overflow: hidden;
}
.btn-submit::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
transition: left 0.5s ease;
}
.btn-submit:hover::before {
left: 100%;
}
.btn-submit:hover {
transform: translateY(-2px);
box-shadow: 0 10px 30px rgba(244, 129, 30, 0.4);
}
.btn-submit:disabled {
opacity: 0.6;
cursor: not-allowed;
transform: none;
}
.whatsapp-float {
position: fixed;
bottom: 30px;
right: 30px;
width: 64px;
height: 64px;
background: #25D366;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 6px 30px rgba(37, 211, 102, 0.5);
cursor: pointer;
transition: all 0.3s ease;
z-index: 1000;
text-decoration: none;
}
.whatsapp-float:hover {
transform: scale(1.1);
box-shadow: 0 8px 40px rgba(37, 211, 102, 0.6);
}
.alert-success {
background: #10b981;
color: white;
padding: 1rem 1.5rem;
border-radius: 8px;
margin-bottom: 1.5rem;
display: none;
align-items: center;
gap: 0.75rem;
}
.alert-success.show {
display: flex;
animation: slideDown 0.4s ease;
}
.alert-error {
background: #ef4444;
color: white;
padding: 1rem 1.5rem;
border-radius: 8px;
margin-bottom: 1.5rem;
display: none;
align-items: center;
gap: 0.75rem;
}
.alert-error.show {
display: flex;
animation: slideDown 0.4s ease;
}
@keyframes slideDown {
from {
opacity: 0;
transform: translateY(-20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.icon-wrapper {
width: 70px;
height: 70px;
display: flex;
align-items: center;
justify-content: center;
border-radius: 12px;
background: linear-gradient(135deg, #f0f9ff 0%, #e0f2fe 100%);
} .thank-you-container {
min-height: 100%;
display: flex;
align-items: center;
justify-content: center;
background: linear-gradient(135deg, #2D2F91 0%, #00ADEE 100%);
position: relative;
overflow: hidden; }
.background-pattern {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0.1;
background-image: 
radial-gradient(circle at 20% 50%, white 2px, transparent 2px),
radial-gradient(circle at 80% 80%, white 2px, transparent 2px),
radial-gradient(circle at 40% 20%, white 3px, transparent 3px);
background-size: 100px 100px, 150px 150px, 120px 120px;
animation: float 20s ease-in-out infinite;
}
@keyframes float {
0%, 100% { transform: translateY(0px); }
50% { transform: translateY(-20px); }
}
.success-card {
background: white;
border-radius: 24px;
box-shadow: 0 30px 90px rgba(0, 0, 0, 0.3);
max-width: 650px;
width: 90%;
padding: 3rem;
margin: 3rem;
text-align: center;
position: relative;
z-index: 10;
animation: slideUp 0.8s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes slideUp {
from {
opacity: 0;
transform: translateY(50px);
}
to {
opacity: 1;
transform: translateY(0);
}
}
.success-icon-wrapper {
width: 120px;
height: 120px;
margin: 0 auto 2rem;
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 10px 40px rgba(16, 185, 129, 0.4);
animation: scaleIn 0.6s cubic-bezier(0.34, 1.56, 0.64, 1) 0.3s backwards;
}
@keyframes scaleIn {
from {
transform: scale(0);
opacity: 0;
}
to {
transform: scale(1);
opacity: 1;
}
}
.checkmark {
width: 60px;
height: 60px;
border-radius: 50%;
display: block;
stroke-width: 3;
stroke: white;
stroke-miterlimit: 10;
box-shadow: inset 0px 0px 0px white;
animation: fill 0.4s ease-in-out 0.5s forwards, scale 0.3s ease-in-out 0.9s both;
}
.checkmark-circle {
stroke-dasharray: 166;
stroke-dashoffset: 166;
stroke-width: 3;
stroke-miterlimit: 10;
stroke: white;
fill: none;
animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) 0.5s forwards;
}
.checkmark-check {
transform-origin: 50% 50%;
stroke-dasharray: 48;
stroke-dashoffset: 48;
animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.9s forwards;
}
@keyframes stroke {
100% {
stroke-dashoffset: 0;
}
}
@keyframes fadeIn {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
.btn-home {
background: linear-gradient(135deg, #F4811E 0%, #ff6b00 100%);
color: white;
padding: 1rem 2.5rem;
border-radius: 12px;
font-weight: 600;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 0.75rem;
transition: all 0.3s ease;
box-shadow: 0 6px 20px rgba(244, 129, 30, 0.3);
animation: fadeIn 0.6s ease 1.4s backwards;
}
.btn-home:hover {
transform: translateY(-3px);
box-shadow: 0 12px 30px rgba(244, 129, 30, 0.4);
}
.btn-whatsapp {
background: linear-gradient(135deg, #25D366 0%, #128C7E 100%);
color: white;
padding: 1rem 2.5rem;
border-radius: 12px;
font-weight: 600;
text-decoration: none;
display: inline-flex;
align-items: center;
gap: 0.75rem;
transition: all 0.3s ease;
box-shadow: 0 6px 20px rgba(37, 211, 102, 0.3);
animation: fadeIn 0.6s ease 1.4s backwards;
}
.btn-whatsapp:hover {
transform: translateY(-3px);
box-shadow: 0 12px 30px rgba(37, 211, 102, 0.4);
}
.info-box {
background: #f9fafb;
border-left: 4px solid #2D2F91;
padding: 1.25rem;
border-radius: 8px;
margin-top: 2rem;
text-align: left;
animation: fadeIn 0.6s ease 1.6s backwards;
}
.decorative-plane {
position: absolute;
top: 10%;
right: 5%;
font-size: 4rem;
opacity: 0.15;
animation: float 15s ease-in-out infinite;
z-index: 5;
}
.decorative-plane-2 {
position: absolute;
bottom: 15%;
left: 8%;
font-size: 3rem;
opacity: 0.15;
animation: float 18s ease-in-out infinite reverse;
z-index: 5;
}
@view-transition {navigation:auto;}
.logo-h {max-width: 220px;}
.logo-f {max-width: 180px; border-radius: 12px; padding: 12px 10px;}
.social-widget {display: flex; flex-wrap: wrap;}
.social-widget img, .social-widget svg {width: 38px; height: 38px; margin: 5px;}
.icon-facebook {fill: #2C5C9B; color: #FFFFFF;}
.icon-instagram {fill: #F14E76; color: #FFFFFF;}
.icon-youtube {fill: #F83F37; color: #FFFFFF;}
@media (min-width: 768px) {
.success-card-page {
margin-top: 150px !important;
}
}
@media (max-width: 767px) {
.nav-bar {
position: inherit !important;
}
.section-title {
font-size: 2rem;
}
}*,
::before,
::after {
--tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
--tw-contain-size: ;
--tw-contain-layout: ;
--tw-contain-paint: ;
--tw-contain-style: 
}
::backdrop {
--tw-border-spacing-x:0;
--tw-border-spacing-y:0;
--tw-translate-x:0;
--tw-translate-y:0;
--tw-rotate:0;
--tw-skew-x:0;
--tw-skew-y:0;
--tw-scale-x:1;
--tw-scale-y:1;
--tw-pan-x: ;
--tw-pan-y: ;
--tw-pinch-zoom: ;
--tw-scroll-snap-strictness:proximity;
--tw-gradient-from-position: ;
--tw-gradient-via-position: ;
--tw-gradient-to-position: ;
--tw-ordinal: ;
--tw-slashed-zero: ;
--tw-numeric-figure: ;
--tw-numeric-spacing: ;
--tw-numeric-fraction: ;
--tw-ring-inset: ;
--tw-ring-offset-width:0px;
--tw-ring-offset-color:#fff;
--tw-ring-color:rgb(59 130 246 / 0.5);
--tw-ring-offset-shadow:0 0 #0000;
--tw-ring-shadow:0 0 #0000;
--tw-shadow:0 0 #0000;
--tw-shadow-colored:0 0 #0000;
--tw-blur: ;
--tw-brightness: ;
--tw-contrast: ;
--tw-grayscale: ;
--tw-hue-rotate: ;
--tw-invert: ;
--tw-saturate: ;
--tw-sepia: ;
--tw-drop-shadow: ;
--tw-backdrop-blur: ;
--tw-backdrop-brightness: ;
--tw-backdrop-contrast: ;
--tw-backdrop-grayscale: ;
--tw-backdrop-hue-rotate: ;
--tw-backdrop-invert: ;
--tw-backdrop-opacity: ;
--tw-backdrop-saturate: ;
--tw-backdrop-sepia: ;
--tw-contain-size: ;
--tw-contain-layout: ;
--tw-contain-paint: ;
--tw-contain-style: 
} *,
::after,
::before {
box-sizing:border-box;
border-width:0;
border-style:solid;
border-color:#e5e7eb
}
::after,
::before {
--tw-content:''
}
:host,
html {
line-height:1.5;
-webkit-text-size-adjust:100%;
-moz-tab-size:4;
tab-size:4;
font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
font-feature-settings:normal;
font-variation-settings:normal;
-webkit-tap-highlight-color:transparent
}
body {
margin:0;
line-height:inherit
}
hr {
height:0;
color:inherit;
border-top-width:1px
}
abbr:where([title]) {
-webkit-text-decoration:underline dotted;
text-decoration:underline dotted
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-size:inherit;
font-weight:inherit
}
a {
color:inherit;
text-decoration:inherit
}
b,
strong {
font-weight:bolder
}
code,
kbd,
pre,
samp {
font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
font-feature-settings:normal;
font-variation-settings:normal;
font-size:1em
}
small {
font-size:80%
}
sub,
sup {
font-size:75%;
line-height:0;
position:relative;
vertical-align:baseline
}
sub {
bottom:-.25em
}
sup {
top:-.5em
}
table {
text-indent:0;
border-color:inherit;
border-collapse:collapse
}
button,
input,
optgroup,
select,
textarea {
font-family:inherit;
font-feature-settings:inherit;
font-variation-settings:inherit;
font-size:100%;
font-weight:inherit;
line-height:inherit;
letter-spacing:inherit;
color:inherit;
margin:0;
padding:0
}
button,
select {
text-transform:none
}
button,
input:where([type=button]),
input:where([type=reset]),
input:where([type=submit]) {
-webkit-appearance:button;
background-color:transparent;
background-image:none
}
:-moz-focusring {
outline:auto
}
:-moz-ui-invalid {
box-shadow:none
}
progress {
vertical-align:baseline
}
::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
height:auto
}
[type=search] {
-webkit-appearance:textfield;
outline-offset:-2px
}
::-webkit-search-decoration {
-webkit-appearance:none
}
::-webkit-file-upload-button {
-webkit-appearance:button;
font:inherit
}
summary {
display:list-item
}
blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
margin:0
}
fieldset {
margin:0;
padding:0
}
legend {
padding:0
}
menu,
ol,
ul {
list-style:none;
margin:0;
padding:0
}
dialog {
padding:0
}
textarea {
resize:vertical
}
input::placeholder,
textarea::placeholder {
opacity:1;
color:#9ca3af
}
[role=button],
button {
cursor:pointer
}
:disabled {
cursor:default
}
audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
display:block;
vertical-align:middle
}
img,
video {
max-width:100%;
height:auto
}
[hidden]:where(:not([hidden=until-found])) {
display:none
}
.absolute {
position:absolute
}
.relative {
position:relative
}
.inset-0 {
inset:0px
}
.bottom-0 {
bottom:0px
}
.left-0 {
left:0px
}
.right-0 {
right:0px
}
.top-0 {
top:0px
}
.z-0 {
z-index:0
}
.z-10 {
z-index:10
}
.mx-auto {
margin-left:auto;
margin-right:auto
}
.mb-12 {
margin-bottom:3rem
}
.mb-16 {
margin-bottom:4rem
}
.mb-2 {
margin-bottom:0.5rem
}
.mb-4 {
margin-bottom:1rem
}
.mb-6 {
margin-bottom:1.5rem
}
.mb-8 {
margin-bottom:2rem
}
.ml-2 {
margin-left:0.5rem
}
.mr-2 {
margin-right:0.5rem
}
.mt-1 {
margin-top:0.25rem
}
.mt-4 {
margin-top:1rem
}
.mt-6 {
margin-top:1.5rem
}
.block {
display:block
}
.inline-block {
display:inline-block
}
.flex {
display:flex
}
.grid {
display:grid
}
.hidden {
display:none
}
.h-10 {
height:2.5rem
}
.h-6 {
height:1.5rem
}
.h-96 {
height:24rem
}
.h-auto {
height:auto
}
.h-full {
height:100%
}
.w-10 {
width:2.5rem
}
.w-6 {
width:1.5rem
}
.w-96 {
width:24rem
}
.w-full {
width:100%
}
.max-w-3xl {
max-width:48rem
}
.max-w-4xl {
max-width:56rem
}
.max-w-7xl {
max-width:80rem
}
.flex-shrink-0 {
flex-shrink:0
}
.resize-none {
resize:none
}
.grid-cols-2 {
grid-template-columns:repeat(2, minmax(0, 1fr))
}
.flex-wrap {
flex-wrap:wrap
}
.items-start {
align-items:flex-start
}
.items-center {
align-items:center
}
.justify-center {
justify-content:center
}
.justify-between {
justify-content:space-between
}
.gap-12 {
gap:3rem
}
.gap-16 {
gap:4rem
}
.gap-2 {
gap:0.5rem
}
.gap-3 {
gap:0.75rem
}
.gap-4 {
gap:1rem
}
.gap-6 {
gap:1.5rem
}
.gap-8 {
gap:2rem
}
.space-y-2 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse:0;
margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))
}
.space-y-4 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse:0;
margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom:calc(1rem * var(--tw-space-y-reverse))
}
.space-y-6 > :not([hidden]) ~ :not([hidden]) {
--tw-space-y-reverse:0;
margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))
}
.overflow-auto {
overflow:auto
}
.overflow-hidden {
overflow:hidden
}
.rounded {
border-radius:0.25rem
}
.rounded-2xl {
border-radius:1rem
}
.rounded-full {
border-radius:9999px
}
.rounded-lg {
border-radius:0.5rem
}
.border {
border-width:1px
}
.border-t {
border-top-width:1px
}
.border-gray-100 {
--tw-border-opacity:1;
border-color:rgb(243 244 246 / var(--tw-border-opacity, 1))
}
.border-gray-600 {
--tw-border-opacity:1;
border-color:rgb(75 85 99 / var(--tw-border-opacity, 1))
}
.bg-\[\#F4811E\] {
--tw-bg-opacity:1;
background-color:rgb(244 129 30 / var(--tw-bg-opacity, 1))
}
.bg-blue-50 {
--tw-bg-opacity:1;
background-color:rgb(239 246 255 / var(--tw-bg-opacity, 1))
}
.bg-gray-50 {
--tw-bg-opacity:1;
background-color:rgb(249 250 251 / var(--tw-bg-opacity, 1))
}
.bg-orange-50 {
--tw-bg-opacity:1;
background-color:rgb(255 247 237 / var(--tw-bg-opacity, 1))
}
.bg-white {
--tw-bg-opacity:1;
background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))
}
.bg-white\/20 {
background-color:rgb(255 255 255 / 0.2)
}
.bg-gradient-to-br {
background-image:linear-gradient(to bottom right, var(--tw-gradient-stops))
}
.from-gray-50 {
--tw-gradient-from:#f9fafb var(--tw-gradient-from-position);
--tw-gradient-to:rgb(249 250 251 / 0) var(--tw-gradient-to-position);
--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)
}
.to-white {
--tw-gradient-to:#fff var(--tw-gradient-to-position)
}
.p-6 {
padding:1.5rem
}
.p-8 {
padding:2rem
}
.px-2 {
padding-left:0.5rem;
padding-right:0.5rem
}
.px-4 {
padding-left:1rem;
padding-right:1rem
}
.px-6 {
padding-left:1.5rem;
padding-right:1.5rem
}
.px-8 {
padding-left:2rem;
padding-right:2rem
}
.py-1 {
padding-top:0.25rem;
padding-bottom:0.25rem
}
.py-12 {
padding-top:3rem;
padding-bottom:3rem
}
.py-24 {
padding-top:6rem;
padding-bottom:6rem
}
.py-3 {
padding-top:0.75rem;
padding-bottom:0.75rem
}
.py-4 {
padding-top:1rem;
padding-bottom:1rem
}
.pt-20 {
padding-top:5rem
}
.pt-8 {
padding-top:2rem
}
.text-center {
text-align:center
}
.text-2xl {
font-size:1.5rem;
line-height:2rem
}
.text-3xl {
font-size:1.875rem;
line-height:2.25rem
}
.text-4xl {
font-size:2.25rem;
line-height:2.5rem
}
.text-5xl {
font-size:3rem;
line-height:1
}
.text-lg {
font-size:1.125rem;
line-height:1.75rem
}
.text-sm {
font-size:0.875rem;
line-height:1.25rem
}
.text-xl {
font-size:1.25rem;
line-height:1.75rem
}
.text-xs {
font-size:0.75rem;
line-height:1rem
}
.font-bold {
font-weight:700
}
.font-medium {
font-weight:500
}
.font-semibold {
font-weight:600
}
.leading-relaxed {
line-height:1.625
}
.leading-tight {
line-height:1.25
}
.tracking-tight {
letter-spacing:-0.025em
}
.text-\[\#00ADEE\] {
--tw-text-opacity:1;
color:rgb(0 173 238 / var(--tw-text-opacity, 1))
}
.text-\[\#2D2F91\] {
--tw-text-opacity:1;
color:rgb(45 47 145 / var(--tw-text-opacity, 1))
}
.text-\[\#F4811E\] {
--tw-text-opacity:1;
color:rgb(244 129 30 / var(--tw-text-opacity, 1))
}
.text-gray-100 {
--tw-text-opacity:1;
color:rgb(243 244 246 / var(--tw-text-opacity, 1))
}
.text-gray-300 {
--tw-text-opacity:1;
color:rgb(209 213 219 / var(--tw-text-opacity, 1))
}
.text-gray-500 {
--tw-text-opacity:1;
color:rgb(107 114 128 / var(--tw-text-opacity, 1))
}
.text-gray-600 {
--tw-text-opacity:1;
color:rgb(75 85 99 / var(--tw-text-opacity, 1))
}
.text-gray-700 {
--tw-text-opacity:1;
color:rgb(55 65 81 / var(--tw-text-opacity, 1))
}
.text-gray-900 {
--tw-text-opacity:1;
color:rgb(17 24 39 / var(--tw-text-opacity, 1))
}
.text-white {
--tw-text-opacity:1;
color:rgb(255 255 255 / var(--tw-text-opacity, 1))
}
.opacity-30 {
opacity:0.3
}
.opacity-90 {
opacity:0.9
}
.shadow-2xl {
--tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);
--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.shadow-xl {
--tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
.blur-3xl {
--tw-blur:blur(64px);
filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.filter {
filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)
}
.transition-all {
transition-property:all;
transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
transition-duration:150ms
}
.transition-colors {
transition-property:color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;
transition-property:color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);
transition-duration:150ms
}
.duration-300 {
transition-duration:300ms
}
.hover\:bg-\[\#ff6b00\]:hover {
--tw-bg-opacity:1;
background-color:rgb(255 107 0 / var(--tw-bg-opacity, 1))
}
.hover\:text-\[\#F4811E\]:hover {
--tw-text-opacity:1;
color:rgb(244 129 30 / var(--tw-text-opacity, 1))
}
.hover\:shadow-xl:hover {
--tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}
@media (min-width: 768px) {
.md\:flex {
display:flex
}
.md\:grid-cols-2 {
grid-template-columns:repeat(2, minmax(0, 1fr))
}
.md\:grid-cols-3 {
grid-template-columns:repeat(3, minmax(0, 1fr))
}
.md\:grid-cols-4 {
grid-template-columns:repeat(4, minmax(0, 1fr))
}
.md\:p-12 {
padding:3rem
}
.md\:text-6xl {
font-size:3.75rem;
line-height:1
}
}
@media (min-width: 1024px) {
.lg\:grid-cols-4 {
grid-template-columns:repeat(4, minmax(0, 1fr))
}
}