/* UTILITAIRES */
 .dn {
     display: none;
 }

 .db {
     display: block;
 }

 .df {
     display: flex;
 }

 .dg {
     display: grid;
 }

 .aic {
     align-items: center;
 }

 .jcc {
     justify-content: center;
 }

 .jcsb {
     justify-content: space-between;
 }

 .fdc {
     flex-direction: column;
 }

 .fdr {
     flex-direction: row;
 }

 .fww {
     flex-wrap: wrap;
 }

 .rel {
     position: relative;
 }

 .abs {
     position: absolute;
 }

 .fix {
     position: fixed;
 }

 .tac {
     text-align: center;
 }

 .tal {
     text-align: left;
 }

 .tar {
     text-align: right;
 }

 .usn {
     user-select: none;
 }

 .ovh {
     overflow: hidden;
 }

 .cp {
     cursor: pointer;
 }

 .fs0 {
     flex-shrink: 0;
 }

 /* WIDTH / HEIGHT */
 .w100 {
     width: 100%;
 }

 .h100 {
     height: 100%;
 }

 .mw1200 {
     max-width: 1200px;
 }

 .mw600 {
     max-width: 600px;
 }

 .mw480 {
     max-width: 480px;
 }

 .mg0a {
     margin: 0 auto;
 }

 /* PADDING */
 .p0 {
     padding: 0;
 }

 .p1 {
     padding: 0.5rem;
 }

 .p2 {
     padding: 1rem;
 }

 .p3 {
     padding: 1.5rem;
 }

 .p4 {
     padding: 2rem;
 }

 .p5 {
     padding: 3rem;
 }

 .p6 {
     padding: 4rem;
 }

 .px2 {
     padding-left: 1rem;
     padding-right: 1rem;
 }

 .px3 {
     padding-left: 1.5rem;
     padding-right: 1.5rem;
 }

 .py2 {
     padding-top: 1rem;
     padding-bottom: 1rem;
 }

 .py3 {
     padding-top: 1.5rem;
     padding-bottom: 1.5rem;
 }
  .pt4 {
     padding-top: 1rem;
 }
 .pt6 {
     padding-top: 6rem;
 }
 .pt8 {
     padding-top: 8rem;
 }

 .pb4 {
     padding-bottom: 4rem;
 }

 /* MARGIN */
 .m0 {
     margin: 0;
 }

 .mb1 {
     margin-bottom: 0.5rem;
 }

 .mb2 {
     margin-bottom: 1rem;
 }

 .mb3 {
     margin-bottom: 1.5rem;
 }

 .mb4 {
     margin-bottom: 2rem;
 }

 .mb5 {
     margin-bottom: 3rem;
 }

 .mt1 {
     margin-top: 0.5rem;
 }

 .mt2 {
     margin-top: 1rem;
 }

 .mt4 {
     margin-top: 2rem;
 }

 .mt5 {
     margin-top: 3rem;
 }

 .mtm2 {
     margin-top: -0.5rem;
 }

 .mtm1r {
     margin-top: 1rem;
 }

 /* GAP */
 .gap1 {
     gap: 0.5rem;
 }

 .gap2 {
     gap: 1rem;
 }

 .gap3 {
     gap: 1.5rem;
 }

 .gap4 {
     gap: 2rem;
 }

 .gap5 {
     gap: 5rem;
 }

 /* BORDURES */
 .bd {
     border: 1px solid var(--border);
 }

 .bdt {
     border-top: 1px solid var(--border);
 }

 .bdb {
     border-bottom: 1px solid var(--border);
 }

 .r1 {
     border-radius: 0.5rem;
 }

 .r2 {
     border-radius: 1rem;
 }

 .r3 {
     border-radius: 1.5rem;
 }

 .rMax {
     border-radius: 9999px;
 }

 /* BACKGROUND */
 .bg-bg {
     background: var(--bg);
 }

 .bg-card {
     background: var(--card);
 }

 .bg-soft {
     background: var(--soft);
 }

 .bg-accent {
     background: var(--accent);
 }

 .bg-accent-soft {
     background: var(--accent-soft);
 }

 .bg-warm {
     background: var(--warm);
 }

 .bg-fg {
     background: var(--fg);
 }

 .bg-grad {
     background: linear-gradient(180deg, var(--soft) 0%, var(--bg) 100%);
 }

 /* TEXT COLOR */
 .c-fg {
     color: var(--fg);
 }

 .c-muted {
     color: var(--muted);
 }

 .c-accent {
     color: var(--accent);
 }

 .c-white {
     color: #FFFFFF;
 }

 .c-white60 {
     color: rgba(255, 255, 255, 0.6);
 }

 /* FONT */
 .fd {
     font-family: 'Fraunces', serif;
 }

 .fw5 {
     font-weight: 500;
 }

 .fw6 {
     font-weight: 600;
 }

 .fw7 {
     font-weight: 700;
 }

 .fs-xs {
     font-size: 0.75rem;
 }

 .fs-sm {
     font-size: 0.875rem;
 }

 .fs-base {
     font-size: 1rem;
 }

 .fs-lg {
     font-size: 1.125rem;
 }

 .fs-xl {
     font-size: 1.25rem;
 }

 .fs-2xl {
     font-size: 1.5rem;
 }

 .fs-3xl {
     font-size: 2rem;
 }

 .fs-4xl {
     font-size: 2.5rem;
 }

 .fs-hero {
     font-size: clamp(2.5rem, 6vw, 4rem);
 }

 .fs-title {
     font-size: clamp(2rem, 5vw, 3rem);
 }

 .ls-wide {
     letter-spacing: 0.05em;
 }

 .ttu {
     text-transform: uppercase;
 }

 .tdn {
     text-decoration: none;
 }

 .lh1 {
     line-height: 1.1;
 }


 /* CONTAINER */
 .container {
     max-width: 1000px;
     margin: 0 auto;
     padding-left: 4rem;
     padding-right: 4rem;
 }

 /* GRID */
 .gc2 {
     grid-column: span 2;
 }

 .gtc-auto {
     grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
 }

 .gtc-2 {
     grid-template-columns: repeat(2, 1fr);
 }

 .gtc-4 {
     grid-template-columns: repeat(4, 1fr);
 }

 /* WIDTH FIXED */
 .w48 {
     width: 48px;
 }

 .w56 {
     width: 56px;
 }

 .h48 {
     height: 48px;
 }

 .h56 {
     height: 56px;
 }

 summary{
    cursor: pointer;
 }