@charset "utf-8";
/*
Theme Name:SPECARJP
Template:SPECAR
Theme URI:https://specar.jp/
Description:SPECARJP from SPEC Inc.
Version:1.0
Author:SPEC Inc.
Author URI:https://specgroup.jp/
*/

:root {
    /* --- BASE THEME (Deep Red) --- */
    --hue-theme: 355;
    --sat-theme: 65%;
    --lum-theme: 45%;
    --lum-theme-dark: 30%;
    --lum-theme-darker: 15%;
    --alpha: 1;
    --alpha-trp: 0.3;
    --alpha-mtrp: 0.7;
    --alpha-filter: 0.3;

    /* --- Neutral --- */
    --sat-neutral: 10%; /* ほんの少し赤みを含ませたグレー */
    --lum-white: 97%;
    --lum-black: 8%;

    /* --- Gold (Champagne Gold) --- */
    --hue-gold: 42;
    --sat-gold: 45%;
    --lum-gold: 70%;

    /* --- Form Colors (Slate Blue) --- */
    --hue-form: 220;
    --sat-form: 40%;
    --lum-form: 50%;

    /* --- Point Colors (Sage Green) --- */
    --hue-point: 150;
    --sat-point: 35%;
    --lum-point: 55%;

    /* --- Dark Colors --- */
    --hue-dark: 355;
    --sat-dark: 40%;
    --lum-dark: 40%;

    /* --- Base Colors --- */
    --color-theme: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme), var(--alpha));
    --color-theme-dark: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-dark), var(--alpha));
    --color-theme-darker: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-darker), var(--alpha));
    --color-white: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-white), var(--alpha));
    --color-black: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-black), var(--alpha));
    --color-gold: hsla(var(--hue-gold), var(--sat-gold), var(--lum-gold), var(--alpha));
    --color-form: hsla(var(--hue-form), var(--sat-form), var(--lum-form), var(--alpha));
    --color-point: hsla(var(--hue-point), var(--sat-point), var(--lum-point), var(--alpha));
    --color-darktheme: hsla(var(--hue-dark), var(--sat-dark), var(--lum-dark), var(--alpha));
    /*--color-body-background: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-black), calc(var(--alpha) - 0.9));*/
    --color-body-background: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-white), calc(var(--alpha) - var(--alpha-trp)));

    /* --- Transparent Variants --- */
    --color-theme-trp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme), calc(var(--alpha) - var(--alpha-trp)));
    --color-theme-mtrp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-theme-dark-trp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-dark), calc(var(--alpha) - var(--alpha-trp)));
    --color-theme-dark-mtrp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-dark), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-theme-darker-trp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-darker), calc(var(--alpha) - var(--alpha-trp)));
    --color-theme-darker-mtrp: hsla(var(--hue-theme), var(--sat-theme), var(--lum-theme-darker), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-white-trp: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-white), calc(var(--alpha) - var(--alpha-trp)));
    --color-white-mtrp: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-white), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-white-filter: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-white), calc(var(--alpha) - var(--alpha-filter)));
    --color-black-trp: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-black), calc(var(--alpha) - var(--alpha-trp)));
    --color-black-mtrp: hsla(var(--hue-theme), var(--sat-neutral), var(--lum-black), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-darktheme-trp: hsla(var(--hue-dark), var(--sat-dark), var(--lum-dark), calc(var(--alpha) - var(--alpha-trp)));
    --color-darktheme-mtrp: hsla(var(--hue-dark), var(--sat-dark), var(--lum-dark), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-form-trp: hsla(var(--hue-form), var(--sat-form), var(--lum-form), calc(var(--alpha) - var(--alpha-trp)));
    --color-form-mtrp: hsla(var(--hue-form), var(--sat-form), var(--lum-form), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-point-trp: hsla(var(--hue-point), var(--sat-point), var(--lum-point), calc(var(--alpha) - var(--alpha-trp)));
    --color-point-mtrp: hsla(var(--hue-point), var(--sat-point), var(--lum-point), calc(var(--alpha) - var(--alpha-mtrp)));
    --color-gold-trp: hsla(var(--hue-gold), var(--sat-gold), var(--lum-gold), calc(var(--alpha) - var(--alpha-trp)));
    --color-gold-mtrp: hsla(var(--hue-gold), var(--sat-gold), var(--lum-gold), calc(var(--alpha) - var(--alpha-mtrp)));


    /* --- Misc --- */
    --logo-width: 8rem;
}

/* --- MEDIA QUERY: 768px以上 --- */
@media (min-width: 768px) {
    :root {
        --logo-width: 7.5rem;
    }
}