/*
|--------------------------------------------------------------------------
| Aanya Organics Theme
|--------------------------------------------------------------------------
| Module : Design System
| File   : typography.css
| Version: 1.0.0
|--------------------------------------------------------------------------
*/

/* ==========================================================
   Body
========================================================== */

body{

    font-family:var(--font-body);

    font-size:var(--font-size-base);

    font-weight:var(--font-regular);

    line-height:var(--line-height-normal);

    color:var(--color-text);

}

/* ==========================================================
   Headings
========================================================== */

h1,
h2,
h3,
h4,
h5,
h6{

    font-family:var(--font-heading);

    font-weight:var(--font-bold);

    line-height:var(--line-height-tight);

    color:var(--color-text);

    margin-bottom:1rem;

}

h1{

    font-size:clamp(2.8rem,6vw,4.5rem);

}

h2{

    font-size:clamp(2.2rem,5vw,3.5rem);

}

h3{

    font-size:clamp(1.8rem,4vw,2.5rem);

}

h4{

    font-size:clamp(1.5rem,3vw,2rem);

}

h5{

    font-size:1.25rem;

}

h6{

    font-size:1.05rem;

}

/* ==========================================================
   Paragraphs
========================================================== */

p{

    margin-bottom:1.5rem;

    color:var(--color-text-light);

}

/* ==========================================================
   Lists
========================================================== */

.entry-content ul,
.entry-content ol{

    margin:0 0 1.5rem 2rem;

}

.entry-content li{

    margin-bottom:.75rem;

}

/* ==========================================================
   Links
========================================================== */

a{

    transition:var(--transition-fast);

}

a:hover{

    color:var(--color-primary);

}

/* ==========================================================
   Strong
========================================================== */

strong{

    font-weight:var(--font-bold);

}

/* ==========================================================
   Small
========================================================== */

small{

    font-size:var(--font-size-sm);

}

/* ==========================================================
   Blockquote
========================================================== */

blockquote{

    margin:2rem 0;

    padding:2rem;

    border-left:5px solid var(--color-primary);

    background:#fff;

    border-radius:var(--radius-md);

    box-shadow:var(--shadow-sm);

}

blockquote p{

    margin-bottom:0;

}

/* ==========================================================
   Code
========================================================== */

code{

    background:#f2f2f2;

    padding:2px 6px;

    border-radius:4px;

    font-size:.95em;

}

pre{

    overflow:auto;

    padding:20px;

    background:#1f1f1f;

    color:#ffffff;

    border-radius:var(--radius-md);

}

/* ==========================================================
   Tables
========================================================== */

table{

    width:100%;

    margin-bottom:2rem;

}

th{

    text-align:left;

    background:var(--color-section);

}

th,
td{

    padding:1rem;

    border:1px solid var(--color-border);

}

/* ==========================================================
   Selection
========================================================== */

::selection{

    background:var(--color-primary);

    color:#ffffff;

}