@charset "UTF-8";

:root{
	/* font size  */
	--siteFont-ratio: 1;

	--siteFont-inc-l: calc( var(--pt-fontSize-root) * 0.25 );
	--siteFont-inc-xl: calc( var(--pt-fontSize-root) * 0.4 );
	--siteFont-inc-xxl: calc( var(--pt-fontSize-root) * 0.65 );
	--siteFont-inc-xxxl: calc( var(--pt-fontSize-root) * 0.9 );

	--minFontSize-xs: 11px;
	--minFontSize-s: 12px;
	--minFontSize-m: 14px;
	--minFontSize-l: 16px;
	--minFontSize-xl: 18px;
	--minFontSize-xxl: 20px;
	--minFontSize-xxxl: 22px;

	--inputPadding: calc(0.4em + 0.6rem);
	--lineHeight: 1.36;

	/* wp heading */
	--wp-headingSize-h1: 2.2em;
	--wp-headingSize-h2: 2em;
	--wp-headingSize-h3: 1.8em;
	--wp-headingSize-h4: 1.6em;
	--wp-headingSize-h5: 1.4em;
	--wp-headingSize-h6: 1.2em;

	/*  with themeOption -------------------------------------------------------------------------------------------------------------------- */

		/* Colors */
			--pt-bg-body: #fff;
			--pt-color-highlight: #5be7a1;
			--pt-text-color-primary: #000;
			--pt-text-color-secondary: #000;
			--pt-text-color-action: #1ab768;
			--pt-text-color-over-highlight: #000;
				/* show more */
				--pt-bg-single-header: #f9f9f9;
				--pt-text-color-single-header: var(--pt-text-color-primary);
				--pt-bg-comment: rgba(235,237,239,.4);
				--pt-border-color: rgba(161,162,168,.35);
				--pt-input-border-color: var(--pt-border-color);
				--pt-bg-popup: #111215;
				--pt-text-color-popup: #fff;
				--pt-bg-button: rgb(235, 237, 239);
				--pt-text-color-button: var(--pt-text-color-primary);
				
			/* menu */
			--pt-bg-menu: var(--pt-bg-body);
			--pt-text-color-menu: var(--pt-text-color-primary);
			--pt-bg-submenu: #111215;
			--pt-text-color-submenu: #fff;
			/* side */
			--pt-side-menu-bg-color: #000;
			--pt-side-menu-text-color: #fff;

		/* fonts */
			--pt-fontFamily-body: "syne-Local",sans-serif;
			--pt-fontFamily-normalMenu: var(--pt-fontFamily-body);
			--pt-fontFamily-title: var(--pt-fontFamily-body);
			--pt-fontFamily-sideMenu: var(--pt-fontFamily-title);

			--pt-fontWeight-body: 400;
			--pt-fontWeight-link: 500;
			--pt-fontWeight-title: 600;
			--pt-fontWeight-normalMenu: var(--pt-fontWeight-link);
			--pt-fontWeight-sideMenu: var(--pt-fontWeight-title);

			--pt-letter-spacing: 0;


	/* without themeOption -------------------------------------------------------------------------------------------------------------------- */
		--pt-bg-mask: rgba(41,42,44,.7);
		--pt-bg-translucent: rgba(0,0,0,0.03);
		--pt-bg-code: #1d2944;
		--pt-text-color-code: #e6e8ef; 
		
		/* size  */
		--pt-border-width: 1px;
		--pt-border-bold: calc(4px + 0.1em);

		--pt-gap-m-x: 3.2vw;
		--pt-gap-m-y: 3.2vw;

		--pt-textarea-width: 46rem;

		--pt-btn-m: max(calc(var(--pt-fontSize-root) * 1.8 + 2vmin),36px);

		--pt-widget-width: calc(100px + 17vw);
		--videoRatio: 0.5625;


		--pt-fontSize-xxxl: max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xxxl) ) , var(--minFontSize-xxxl));
		--pt-fontSize-xxl:  max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xxl) ) , var(--minFontSize-xxl));
		--pt-fontSize-xl:   max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-xl) ) , var(--minFontSize-xl));
		--pt-fontSize-l:    max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) + var(--siteFont-inc-l) ) , var(--minFontSize-l));

		--pt-fontSize-m:    max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) * 1 ) ,   var(--minFontSize-m));
		--pt-fontSize-s:    max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) * 0.85 ) ,var(--minFontSize-s));
		--pt-fontSize-xs:   max( calc( var(--pt-fontSize-root) * var(--siteFont-ratio) * 0.7 ) , var(--minFontSize-xs));

		--pt-admin-bar: 0px;
		--header-minHeight: 0px;
		--pt-transition-button: color 0.15s,background 0.15s;

		/* for wp block */
		--wp-fontRatio: 1.125;
		--wp-textareaFontSize: calc( var(--pt-fontSize-root) * var(--wp-fontRatio) );
		--wp-list-gap: 0.8525rem;
		--wp-list-left-gap: 0.9525em;
		--wp-block-gap: 1.525rem;
}

.admin-bar{
	--pt-admin-bar: 32px;
}
.pt-border-width-m{
	--pt-border-width: 2px;
}
.pt-letter-spacing-1{
	--pt-letter-spacing: -0.04em;
}
.pt-letter-spacing-2{
	--pt-letter-spacing: -0.02em;
}
.pt-letter-spacing-4{
	--pt-letter-spacing: 0.02em;
}
.pt-letter-spacing-5{
	--pt-letter-spacing: 0.04em;
}
@media (max-width: 782px){
	.admin-bar{
		--pt-admin-bar: 46px;
	}
}