/*
Theme Name: Exam Application
Theme URI: https://example.com/exam-application
Author: Exam Application Team
Author URI: https://example.com
Description: Custom WordPress theme for the Exam Application portal.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 8.0
Text Domain: exam-application
*/

:root {
    --color-bg: hsl(210 38% 99%);
    --color-bg-alt: hsl(214 28% 96%);
    --color-text: hsl(220 20% 20%);
    --color-text-muted: hsl(220 10% 46%);
    --color-border: hsl(214 20% 87%);
    --color-primary: hsl(145 59% 31%);
    --color-primary-light: hsl(147 54% 39%);
    --color-auth-header: #0d9488;
    --color-auth-header-light: #14b8a6;
    --color-form-primary: var(--color-auth-header);
    --color-form-primary-hover: #0f766e;
    --shadow-form-primary: 0 10px 22px rgba(13, 148, 136, 0.22);
    --shadow-form-primary-hover: 0 12px 24px rgba(15, 118, 110, 0.24);
    --gradient-cta-primary: linear-gradient(135deg, #f59e0b 0%, #f97316 60%, #ef4444 100%);
    --gradient-cta-primary-hover: linear-gradient(135deg, #f97316 0%, #ef4444 100%);
    --shadow-cta-primary: 0 0 0 3px rgba(249, 115, 22, 0.35), 0 8px 24px rgba(239, 68, 68, 0.45), 0 2px 6px rgba(0, 0, 0, 0.2);
    --shadow-cta-primary-hover: 0 0 0 4px rgba(249, 115, 22, 0.45), 0 16px 40px rgba(239, 68, 68, 0.55), 0 4px 12px rgba(0, 0, 0, 0.25);
    --color-secondary: hsl(214 24% 95%);
    --color-secondary-accent: hsl(176 73% 35%);
    --color-secondary-accent-dark: hsl(176 80% 28%);
    --color-secondary-accent-muted: hsl(176 22% 42%);
    --color-secondary-accent-soft: hsl(176 62% 94%);
    --color-accent: hsl(145 55% 95%);
    --color-header-portal: #138247;
    --color-header-portal-soft: #eef8f1;
    --color-surface-soft: hsl(214 34% 97%);
    --color-header-bg: hsla(210, 48%, 99%, 0.94);
    --color-header-bg-sticky: hsla(210, 48%, 99%, 0.98);
    --color-footer-bg: hsl(214 24% 95%);
    --max-width: 1280px;
    --spacing-sm: 0.75rem;
    --spacing-md: 1.5rem;
    --spacing-lg: 2rem;
    --spacing-xl: 3rem;
    --radius-md: 0.5rem;
    --shadow-sm: 0 10px 30px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 24px 48px rgba(15, 23, 42, 0.12);
    --transition: 0.2s ease;
    --font-heading: 'Noto Sans JP', sans-serif;
    --hero-gradient: linear-gradient(135deg, #0d9488 0%, #0f9b8f 54%, #10b981 100%);
}

*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    border-color: var(--color-border);
}

html {
    scroll-behavior: smooth;
    font-size: 13px;
}

@media (min-width: 1024px) {
    html {
        font-size: clamp(12px, 0.661vw + 5.153px, 15px);
    }
}

body {
    font-family: 'Noto Sans JP', sans-serif;
    color: var(--color-text);
    background-color: var(--color-bg-alt);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-heading);
    line-height: 1.3;
}

p,
figure,
blockquote,
ul,
ol {
    margin: 0;
}

a {
    color: inherit;
    text-decoration: none;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}

ul,
ol {
    padding: 0;
    list-style: none;
}

input,
button,
textarea,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

table {
    width: 100%;
    border-collapse: collapse;
}

code,
pre {
    font-family: Consolas, Monaco, 'Courier New', monospace;
}