/*
Theme Name:        Stitch Dental - Seattle Dental Studio
Theme URI:         https://seattledentalstudio.com/
Author:            Stitch Design
Description:       A premium, modern dental clinic WordPress theme for Seattle Dental Studio. Features a clean "Clinical Sanctuary" design system with glassmorphism navigation, editorial typography (Manrope + Inter), and responsive layouts for Home, About, Services, Testimonials, and Contact pages. Built with Tailwind CSS and Material Symbols.
Version:           1.0.0
Requires at least: 5.8
Tested up to:      6.7
Requires PHP:      7.4
License:           GNU General Public License v2 or later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       stitch-dental
Tags:              medical, health-and-wellness, one-column, custom-colors, custom-logo, custom-menu, featured-images, full-width-template, sticky-post, theme-options, translation-ready, wide-blocks, blog, portfolio
*/

/* ==========================================================================
   Design System: The Clinical Sanctuary
   Colors, Typography & Base Styles
   ========================================================================== */

:root {
    --color-primary:                  #00649a;
    --color-primary-dim:              #005787;
    --color-primary-fixed:            #67bafd;
    --color-primary-fixed-dim:        #58acef;
    --color-primary-container:        #67bafd;
    --color-on-primary:               #f6f9ff;
    --color-on-primary-fixed:         #001d31;
    --color-on-primary-fixed-variant: #003f63;
    --color-on-primary-container:     #003655;
    --color-inverse-primary:          #67bafd;

    --color-secondary:                #006979;
    --color-secondary-dim:            #005c6a;
    --color-secondary-fixed:          #a7edff;
    --color-secondary-fixed-dim:      #69e5ff;
    --color-secondary-container:      #a7edff;
    --color-on-secondary:             #eefbff;
    --color-on-secondary-fixed:       #004652;
    --color-on-secondary-fixed-variant: #006575;
    --color-on-secondary-container:   #005a69;

    --color-tertiary:                 #5c5b85;
    --color-tertiary-dim:             #504f78;
    --color-tertiary-fixed:           #cac7f8;
    --color-tertiary-fixed-dim:       #bcbae9;
    --color-tertiary-container:       #cac7f8;
    --color-on-tertiary:              #fbf7ff;
    --color-on-tertiary-fixed:        #2d2c53;
    --color-on-tertiary-fixed-variant:#4a4971;
    --color-on-tertiary-container:    #414068;

    --color-surface:                  #f8f9fa;
    --color-surface-dim:              #d5dbdd;
    --color-surface-bright:           #f8f9fa;
    --color-surface-tint:             #00649a;
    --color-surface-variant:          #dee3e6;
    --color-surface-container-lowest: #ffffff;
    --color-surface-container-low:    #f1f4f5;
    --color-surface-container:        #ebeef0;
    --color-surface-container-high:   #e5e9eb;
    --color-surface-container-highest:#dee3e6;
    --color-inverse-surface:          #0c0f10;
    --color-inverse-on-surface:       #9b9d9e;

    --color-background:               #f8f9fa;
    --color-on-background:            #2d3335;
    --color-on-surface:               #2d3335;
    --color-on-surface-variant:       #5a6062;
    --color-outline:                  #767c7e;
    --color-outline-variant:          #adb3b5;

    --color-error:                    #a83836;
    --color-error-dim:                #67040d;
    --color-error-container:          #fa746f;
    --color-on-error:                 #fff7f6;
    --color-on-error-container:       #6e0a12;

    --font-headline: 'Manrope', sans-serif;
    --font-body:     'Inter', sans-serif;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;
    font-family: var(--font-body);
    font-size: 16px;
    line-height: 1.6;
    color: var(--color-on-surface);
    background-color: var(--color-surface);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-headline);
    font-weight: 700;
    line-height: 1.2;
    color: var(--color-on-surface);
    margin: 0 0 1rem;
}

p { margin: 0 0 1rem; }

a {
    color: var(--color-primary);
    text-decoration: none;
    transition: color 0.3s ease;
}

a:hover { color: var(--color-primary-dim); }

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

/* WordPress Core Classes */
.alignleft  { float: left;  margin: 0 1.5rem 1rem 0; }
.alignright { float: right; margin: 0 0 1rem 1.5rem; }
.aligncenter { display: block; margin: 0 auto 1rem; }
.alignwide  { margin-left: auto; margin-right: auto; }
.alignfull  { width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

.wp-caption { max-width: 100%; margin-bottom: 1rem; }
.wp-caption-text { font-size: 0.875rem; color: var(--color-on-surface-variant); text-align: center; margin-top: 0.5rem; }

.screen-reader-text {
    clip: rect(1px,1px,1px,1px);
    position: absolute !important;
    height: 1px; width: 1px;
    overflow: hidden;
}

/* Material Symbols */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    vertical-align: middle;
}

/* Utility */
.hero-gradient { background: linear-gradient(135deg, #00649a 0%, #67bafd 100%); }
.glass-nav { backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }