/* ----------------------------------------------------------------------------------------------------------------- */
/* ---------------------------------------------------- root.css --------------------------------------------------- */
/* ---------------------------- Developed by 'Tsakiris Studio' do not modify this file. ---------------------------- */
/* ------------------------  Latest version (--CD-01062026 --MD-01062026 --BUILD-0.0.0-1) -------------------------- */
/* ----------------------------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------- FONTS ----------------------------------------------------- */

/* MONTSERRAT */
@font-face {

	font-style : normal ;
	font-display : swap ;
    font-weight : 100 900 ;
	font-family : "Montserrat" ;
	src : url("../assets/fonts/montserrat.ttf") format("truetype") ;

}

/* CORMORANT GARAMOND */
@font-face {

	font-style : normal ;
	font-display : swap ;
    font-weight : 300 700 ;
	font-family : "Cormorant Garamond" ;
	src : url("../assets/fonts/cormorant_garamond.ttf") format("truetype") ;

}

/* ----------------------------------------------------------------------------------------------------------------- */


/* ----------------------------------------------------- ROOT ------------------------------------------------------ */
:root {

    /* --------------------------------------------------- FONTS --------------------------------------------------- */

    --font-primary : "Montserrat", Arial, Helvetica, sans-serif ;
    --font-secondary : "Cormorant Garamond", Georgia, serif ;

    /* ------------------------------------------------------------------------------------------------------------- */


	/* -------------------------------------------------- COLORS --------------------------------------------------- */

	/* BLACK OPACITIES */
	--color-black-100 : rgba(0, 0, 0, 0.1) ;
	--color-black-200 : rgba(0, 0, 0, 0.2) ;
	--color-black-300 : rgba(0, 0, 0, 0.3) ;
	--color-black-400 : rgba(0, 0, 0, 0.4) ;
	--color-black-500 : rgba(0, 0, 0, 0.5) ;
	--color-black-600 : rgba(0, 0, 0, 0.6) ;
	--color-black-700 : rgba(0, 0, 0, 0.7) ;
	--color-black-800 : rgba(0, 0, 0, 0.8) ;
	--color-black-900 : rgba(0, 0, 0, 0.9) ;

	/* INK COLOR SCALE */
	--color-ink-100 : #ffca99 ;
	--color-ink-100-rgb : 255, 202, 153 ;
	--color-ink-200 : #ffc38c ;
	--color-ink-200-rgb : 255, 195, 140 ;
	--color-ink-300 : #ffbc7f ;
	--color-ink-300-rgb : 255, 188, 127 ;
	--color-ink-400 : #ffb673 ;
	--color-ink-400-rgb : 255, 182, 115 ;
	--color-ink-500 : #14283c ;
	--color-ink-500-rgb : 20, 40, 60 ;
	--color-ink-600 : #e59d5c ;
	--color-ink-600-rgb : 229, 157, 92 ;
	--color-ink-700 : #cc8c52 ;
	--color-ink-700-rgb : 204, 140, 82 ;
	--color-ink-800 : #b37a47 ;
	--color-ink-800-rgb : 179, 122, 71 ;
	--color-ink-900 : #99683d ;
	--color-ink-900-rgb : 153, 104, 61 ;

	/* PAPER COLOR SCALE */
	--color-paper-100 : #dfdcd9 ;
	--color-paper-100-rgb : 223, 220, 217 ;
	--color-paper-200 : #e1dcd7 ;
	--color-paper-200-rgb : 225, 220, 215 ;
	--color-paper-300 : #e3dcd5 ;
	--color-paper-300-rgb : 227, 220, 213 ;
	--color-paper-400 : #e4dcd4 ;
	--color-paper-400-rgb : 228, 220, 212 ;
	--color-paper-500 : #e6dcd2 ;
	--color-paper-500-rgb : 230, 220, 210 ;
	--color-paper-600 : #dcd0c1 ;
	--color-paper-600-rgb : 220, 208, 193 ;
	--color-paper-700 : #d2c4b2 ;
	--color-paper-700-rgb : 210, 196, 178 ;
	--color-paper-800 : #c8b8a2 ;
	--color-paper-800-rgb : 200, 184, 162 ;
	--color-paper-900 : #beac93 ;
	--color-paper-900-rgb : 190, 172, 147 ;

	/* Muted Scale */
	--color-muted-100 : #ffca99 ;
	--color-muted-100-rgb : 255, 202, 153 ;
	--color-muted-200 : #ffc38c ;
	--color-muted-200-rgb : 255, 195, 140 ;
	--color-muted-300 : #ffbc7f ;
	--color-muted-300-rgb : 255, 188, 127 ;
	--color-muted-400 : #ffb673 ;
	--color-muted-400-rgb : 255, 182, 115 ;
	--color-muted-500 : #5c6670 ;
	--color-muted-500-rgb : 92, 102, 112 ;
	--color-muted-600 : #e59d5c ;
	--color-muted-600-rgb : 229, 157, 92 ;
	--color-muted-700 : #cc8c52 ;
	--color-muted-700-rgb : 204, 140, 82 ;
	--color-muted-800 : #b37a47 ;
	--color-muted-800-rgb : 179, 122, 71 ;
	--color-muted-900 : #99683d ;
	--color-muted-900-rgb : 153, 104, 61 ;

	/* Coral Scale */
	--color-coral-100 : #ffca99 ;
	--color-coral-100-rgb : 255, 202, 153 ;
	--color-coral-200 : #ffc38c ;
	--color-coral-200-rgb : 255, 195, 140 ;
	--color-coral-300 : #ffbc7f ;
	--color-coral-300-rgb : 255, 188, 127 ;
	--color-coral-400 : #ffb673 ;
	--color-coral-400-rgb : 255, 182, 115 ;
	--color-coral-500 : #ff6f61 ;
	--color-coral-500-rgb : 255, 111, 97 ;
	--color-coral-600 : #e59d5c ;
	--color-coral-600-rgb : 229, 157, 92 ;
	--color-coral-700 : #cc8c52 ;
	--color-coral-700-rgb : 204, 140, 82 ;
	--color-coral-800 : #b37a47 ;
	--color-coral-800-rgb : 179, 122, 71 ;
	--color-coral-900 : #99683d ;
	--color-coral-900-rgb : 153, 104, 61 ;

	/* Theme Colors */
	--color-ink : var(--color-ink-500) ;
	--color-ink-rgb : var(--color-ink-500-rgb) ;
	--color-paper : var(--color-paper-500) ;
	--color-paper-rgb : var(--color-paper-500-rgb) ;
	--color-muted : var(--color-muted-500) ;
	--color-muted-rgb : var(--color-muted-500-rgb) ;
	--color-coral : var(--color-coral-500) ;
	--color-coral-rgb : var(--color-coral-500-rgb) ;

	/* ------------------------------------------------------------------------------------------------------------- */


	/* ------------------------------------------------- MATERIALS ------------------------------------------------- */

	--material-metal : url("../assets/textures/materials/metal.webp") ;
    --material-steel : url("../assets/textures/materials/steel.webp") ;
    --material-copper : url("../assets/textures/materials/copper.webp") ;

	/* ------------------------------------------------------------------------------------------------------------- */


	/* ------------------------------------------------ FONT SIZES ------------------------------------------------- */

    --font-size-10 : clamp(8.0px, 0.488vw, 12.0px) ;
    --font-size-11 : clamp(9.0px, 0.537vw, 13.0px) ;
	--font-size-12 : clamp(10.0px, 0.585vw, 14.0px) ;
	--font-size-13 : clamp(11.0px, 0.634vw, 15.0px) ;
	--font-size-14 : clamp(12.0px, 0.683vw, 16.0px) ;
	--font-size-15 : clamp(13.0px, 0.732vw, 17.0px) ;
	--font-size-16 : clamp(14.0px, 0.781vw, 18.0px) ;
	--font-size-17 : clamp(15.0px, 0.830vw, 19.0px) ;
	--font-size-18 : clamp(16.0px, 0.878vw, 20.0px) ;
    --font-size-19 : clamp(17.0px, 0.927vw, 21.0px) ;
    --font-size-20 : clamp(18.0px, 0.976vw, 22.0px) ;
    --font-size-21 : clamp(19.0px, 1.025vw, 23.0px) ;
    --font-size-22 : clamp(20.0px, 1.074vw, 24.0px) ;
    --font-size-23 : clamp(21.0px, 1.123vw, 25.0px) ;
    --font-size-24 : clamp(22.0px, 1.171vw, 26.0px) ;
    --font-size-25 : clamp(23.0px, 1.220vw, 27.0px) ;
    --font-size-26 : clamp(24.0px, 1.269vw, 28.0px) ;
    --font-size-27 : clamp(25.0px, 1.318vw, 29.0px) ;
    --font-size-28 : clamp(26.0px, 1.367vw, 30.0px) ;

	/* ------------------------------------------------------------------------------------------------------------- */


	/* ---------------------------------------------- LETTER SPACING ----------------------------------------------- */

	--letter-spacing-xxxsmall : clamp(0.25px, 0.024vw, 0.75px) ; /* letter-spacing : 0.5px ; */
	--letter-spacing-xxsmall : clamp(0.5px, 0.036vw, 1px) ; /* letter-spacing : 0.75px ; */
	--letter-spacing-xsmall : clamp(0.75px, 0.048vw, 1.25px) ; /* letter-spacing : 1px ; */
	--letter-spacing-small : clamp(1px, 0.061vw, 1.5px) ; /* letter-spacing : 1.25px ; */
	--letter-spacing-medium : clamp(1.25px, 0.073vw, 1.75px) ; /* letter-spacing : 1.5px ; */
	--letter-spacing-large : clamp(1.5px, 0.085vw, 2px) ; /* letter-spacing : 1.75px ; */
	--letter-spacing-xlarge : clamp(1.75px, 0.097vw, 2.25px) ; /* letter-spacing : 2px ; */
    --letter-spacing-xxlarge : clamp(2px, 0.109vw, 2.5px) ; /* letter-spacing : 2.25px ; */
    --letter-spacing-xxxlarge : clamp(2.25px, 0.122vw, 2.75px) ; /* letter-spacing : 2.5px ; */

	/* ------------------------------------------------------------------------------------------------------------- */


	/* --------------------------------------------------- SIZES --------------------------------------------------- */

    --size-2 : clamp(1.5px, 0.097vw, 2.5px) ;
    --size-8 : clamp(6.0px, 0.390vw, 10.0px) ;
    --size-16 : clamp(12.0px, 0.781vw, 20.0px) ;
    --size-24 : clamp(20.0px, 1.171vw, 28.0px) ;
    --size-32 : clamp(26.0px, 1.562vw, 38.0px) ;
    --size-56 : clamp(48.0px, 2.734vw, 64.0px) ;
    --size-72 : clamp(64.0px, 3.515vw, 80.0px) ;
    --size-96 : clamp(88.0px, 4.687vw, 104.0px) ;

	/* ------------------------------------------------------------------------------------------------------------- */


	/* ------------------------------------------------ TRANSITIONS ------------------------------------------------ */

    /* TRANSITION SPEEDS */
    --transition-xxxfast : 50ms ;
    --transition-xxfast : 100ms ;
    --transition-xfast : 150ms ;
	--transition-fast : 200ms ;
	--transition-normal : 250ms ;
	--transition-slow : 300ms ;
    --transition-xslow : 350ms ;
    --transition-xxslow : 400ms ;
    --transition-xxxslow : 450ms ;

    /* TRANSITION SETTINGS */
    --transition-type : ease ;
	--transition-speed : var(--transition-normal) ;

    /* TRANSITION ATTRIBUTES */
	--transition-color : color var(--transition-speed) var(--transition-type) ;
	--transition-width : width var(--transition-speed) var(--transition-type) ;
	--transition-height : height var(--transition-speed) var(--transition-type) ;
	--transition-opacity : opacity var(--transition-speed) var(--transition-type) ;
	--transition-transform : transform var(--transition-speed) var(--transition-type) ;
	--transition-background : background var(--transition-speed) var(--transition-type) ;
	--transition-background-color : background-color var(--transition-speed) var(--transition-type) ;

	/* ------------------------------------------------------------------------------------------------------------- */

}
/* ----------------------------------------------------------------------------------------------------------------- */