:root{--primary-color:#54c4b3;--secondary-color:#a487ae;--tertiary-color:#7cb0ca;--accent-color:#e37a70;--info-color:#eabf6f;--primary-bg-light:#54c4b31a;--secondary-bg-light:#a487ae1a;--info-bg-light:#eabf6f1a;--accent-bg-light:#e37a701a;--tertiary-bg-light:#7cb0ca1a;--text-color:#000;--gray-text-color:#323232;--light-text-color:#6b7280;--background-color:#fff;--background-color-gray:#e7e7e7;--sidebar-bg:#f9fafb;--border-color:#e5e7eb;--hover-color:#f3f4f6;--active-color:#ecfdf5;--header-height:60px;--sidebar-width:250px;--right-sidebar-width:220px;--content-max-width:850px;--container-max-width:1400px;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--border-radius-sm:.25rem;--border-radius-md:.5rem;--shadow-sm:0 1px 2px #0000000d;--shadow-md:0 4px 6px #0000000d;--shadow-lg:0 10px 15px #0000000d}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-color);background-color:var(--background-color);font-family:Inter,sans-serif;line-height:1.6}h1,h2,h3,h4,h5,h6{margin-bottom:var(--space-6);font-family:Lato,sans-serif;line-height:1.3}h1{padding-bottom:var(--space-4);border-bottom:3px solid var(--primary-color);color:var(--primary-color);font-size:2.25rem;font-weight:900;position:relative}h1:after{content:"";background-color:var(--primary-color);width:100%;height:3px;position:absolute;bottom:-3px;left:0}h2{color:var(--tertiary-color);font-size:1.75rem;font-weight:700}h3{color:var(--accent-color);margin-bottom:var(--space-1);font-size:1.5rem;font-weight:700}h4{color:var(--accent-color);margin-bottom:var(--space-1);font-size:1.1rem}strong{color:var(--gray-text-color)}h4 strong{color:var(--accent-color)}ul,ol{padding:0 0 0 3%}code{background-color:var(--background-color-gray);color:var(--accent-color);padding:var(--space-2);border-radius:var(--border-radius-sm)}p{margin-bottom:var(--space-6)}.section-content img{margin-left:auto;margin-right:auto;display:block}a{color:var(--secondary-color);text-decoration:none;transition:color .2s}a:hover{text-decoration:underline}table{border-collapse:collapse;width:100%;margin-bottom:var(--space-8);background-color:var(--background-color);box-shadow:var(--shadow-sm);border-radius:var(--border-radius-md);overflow:hidden}th,td{padding:var(--space-4);text-align:left;border-bottom:1px solid var(--border-color)}th{color:#fff;background-color:#54c4b3;font-weight:600}tr:nth-child(2n){background-color:#e4fffb}tr:nth-child(odd){background-color:#fff}@media (width<=768px){table,thead,tbody,th,td,tr{display:block}thead tr{position:absolute;top:-9999px;left:-9999px}tr{border:1px solid var(--border-color);margin-bottom:var(--space-4)}td{border:none;border-bottom:1px solid var(--border-color);text-wrap:balance;padding-left:50%;position:relative}td:before{white-space:nowrap;text-wrap:balance;content:attr(data-label);width:45%;padding-right:10px;font-weight:600;position:absolute;top:16px;left:16px}}td .btn{margin:var(--space-2)0}.main-container{margin-top:var(--header-height);min-height:calc(100vh - var(--header-height));display:flex}.left-sidebar{width:var(--sidebar-width);background-color:var(--sidebar-bg);border-right:1px solid var(--border-color);height:calc(100vh - var(--header-height));padding:var(--space-6)0;z-index:100;scrollbar-width:none;position:fixed;left:0;overflow-y:auto;box-shadow:inset -5px 0 10px -5px #0000000d}.left-sidebar::-webkit-scrollbar{display:none}.content{padding:var(--space-10)var(--space-12);margin-left:var(--sidebar-width);margin-right:var(--right-sidebar-width);max-width:var(--content-max-width);flex:1;margin-inline:auto}.content .category-label{color:var(--secondary-color)}.right-sidebar{width:var(--right-sidebar-width);background-color:var(--sidebar-bg);border-left:1px solid var(--border-color);top:var(--header-height);height:calc(100vh - var(--header-height));padding:var(--space-6)0;position:fixed;right:0;overflow-y:auto;box-shadow:inset 5px 0 10px -5px #0000000d}.ad-space{margin-top:var(--space-10);padding:var(--space-6);background-color:var(--hover-color);border-radius:var(--border-radius-sm);text-align:center;border:1px dashed var(--border-color)}.container{max-width:var(--container-max-width);padding:0 var(--space-6);margin:0 auto}.featured-section{background-color:var(--primary-bg-light);border:1px solid var(--primary-color);padding:var(--space-6);margin-bottom:var(--space-8);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md)}.secondary-section{background-color:var(--secondary-bg-light);padding:var(--space-6);margin-bottom:var(--space-8);border-radius:var(--border-radius-md);border-left:4px solid var(--secondary-color);box-shadow:var(--shadow-md)}.info-card{background-color:var(--info-bg-light);border-left:4px solid var(--info-color);padding:var(--space-6);margin-bottom:var(--space-8);border-radius:var(--border-radius-md);box-shadow:var(--shadow-md)}.note-block{background-color:var(--tertiary-bg-light);padding:var(--space-6);margin-bottom:var(--space-8);border-radius:var(--border-radius-md);border-left:4px solid var(--tertiary-color);box-shadow:var(--shadow-md)}.warning-section{background-color:var(--accent-bg-light);padding:var(--space-6);margin-bottom:var(--space-8);border-radius:var(--border-radius-md);border-left:4px solid var(--accent-color);box-shadow:var(--shadow-md)}.primary-text{color:var(--primary-color)}.secondary-text{color:var(--secondary-color)}.tertiary-text{color:var(--tertiary-color)}.accent-text{color:var(--accent-color)}.info-text{color:var(--info-color)}.text-center{text-align:center}.text-left{text-align:left}.text-right{text-align:right}.font-bold{font-weight:700}.font-medium{font-weight:500}.font-light{font-weight:300}.flex{display:flex}.flex-col{flex-direction:column}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.items-center{align-items:center}.gap-1{gap:var(--space-1)}.gap-2{gap:var(--space-2)}.gap-4{gap:var(--space-4)}.gap-6{gap:var(--space-6)}.mb-1{margin-bottom:var(--space-1)}.mb-2{margin-bottom:var(--space-2)}.mb-4{margin-bottom:var(--space-4)}.mb-6{margin-bottom:var(--space-6)}.mb-8{margin-bottom:var(--space-8)}.mt-4{margin-top:var(--space-4)}.mt-8{margin-top:var(--space-8)}.p-2{padding:var(--space-2)}.p-4{padding:var(--space-4)}.p-6{padding:var(--space-6)}.rounded-sm{border-radius:var(--border-radius-sm)}.rounded-md{border-radius:var(--border-radius-md)}.shadow-sm{box-shadow:var(--shadow-sm)}.shadow-md{box-shadow:var(--shadow-md)}.shadow-lg{box-shadow:var(--shadow-lg)}.btn{padding:var(--space-2)var(--space-4);border-radius:var(--border-radius-sm);text-align:center;cursor:pointer;font-weight:500;text-decoration:none;transition:all .2s;display:inline-block}.btn:hover{text-decoration:none}.btn-primary{background-color:var(--primary-color);color:#fff}.btn-primary:hover{opacity:.9}.btn-secondary{background-color:var(--secondary-color);color:#fff}.btn-secondary:hover{opacity:.9}.btn-tertiary{background-color:var(--tertiary-color);color:#fff}.btn-tertiary:hover{opacity:.9}.btn-accent{background-color:var(--accent-color);color:#fff}.btn-accent:hover{opacity:.9}.btn-outline{background-color:#0000;border:1px solid}.btn-outline.btn-primary{color:var(--primary-color)}.btn-outline.btn-secondary{color:var(--secondary-color)}@media (width<=1300px){.left-sidebar,.right-sidebar{display:none}}@media (width<=1024px){.content{padding:var(--space-8)}}@media (width<=768px){.content{padding:var(--space-6);margin-left:0}h1{font-size:1.875rem}h2{font-size:1.5rem}h3{font-size:1.25rem}}
/*# sourceMappingURL=1-introduction-to-uiux-defining-ui-ux-and-product-design.22cef467.css.map */