/* ==========================================================================
   Utility Classes
   ========================================================================== */

/* Display */
.hidden { display: none !important; }
.block { display: block; }
.inline-block { display: inline-block; }
.inline { display: inline; }

/* Flexbox Utilities - Most Common Patterns */
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.flex-col { flex-direction: column; }
.flex-row { flex-direction: row; }
.flex-wrap { flex-wrap: wrap; }
.flex-1 { flex: 1; }
.flex-shrink-0 { flex-shrink: 0; }

/* Flex Alignment - Common Combinations */
.flex-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flex-between {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.flex-start {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.flex-end {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

/* Individual Flex Properties */
.items-start { align-items: flex-start; }
.items-center { align-items: center; }
.items-end { align-items: flex-end; }
.items-stretch { align-items: stretch; }

.justify-start { justify-content: flex-start; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.justify-around { justify-content: space-around; }

/* Gap Utilities */
.gap-1 { gap: var(--space-1); }
.gap-2 { gap: var(--space-2); }
.gap-3 { gap: var(--space-3); }
.gap-4 { gap: var(--space-4); }
.gap-6 { gap: var(--space-6); }
.gap-8 { gap: var(--space-8); }

/* Visibility */
.invisible { visibility: hidden; }
.visible { visibility: visible; }

/* Overflow */
.overflow-hidden { overflow: hidden; }
.overflow-auto { overflow: auto; }
.overflow-x-hidden { overflow-x: hidden; }
.overflow-y-auto { overflow-y: auto; }

/* Position */
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.sticky { position: sticky; }

/* Width & Height */
.w-full { width: 100%; }
.w-auto { width: auto; }
.h-full { height: 100%; }
.h-auto { height: auto; }
.min-h-screen { min-height: 100vh; }

/* Margin */
.m-0 { margin: 0; }
.m-auto { margin: auto; }
.mx-auto { margin-left: auto; margin-right: auto; }
.my-auto { margin-top: auto; margin-bottom: auto; }

.mt-0 { margin-top: 0; }
.mt-4 { margin-top: var(--space-4); }
.mt-6 { margin-top: var(--space-6); }
.mt-8 { margin-top: var(--space-8); }
.mt-12 { margin-top: var(--space-12); }
.mt-16 { margin-top: var(--space-16); }

.mb-0 { margin-bottom: 0; }
.mb-4 { margin-bottom: var(--space-4); }
.mb-6 { margin-bottom: var(--space-6); }
.mb-8 { margin-bottom: var(--space-8); }
.mb-12 { margin-bottom: var(--space-12); }
.mb-16 { margin-bottom: var(--space-16); }

/* Padding */
.p-0 { padding: 0; }
.p-4 { padding: var(--space-4); }
.p-6 { padding: var(--space-6); }
.p-8 { padding: var(--space-8); }

.px-4 { padding-left: var(--space-4); padding-right: var(--space-4); }
.px-6 { padding-left: var(--space-6); padding-right: var(--space-6); }
.px-8 { padding-left: var(--space-8); padding-right: var(--space-8); }

.py-4 { padding-top: var(--space-4); padding-bottom: var(--space-4); }
.py-6 { padding-top: var(--space-6); padding-bottom: var(--space-6); }
.py-8 { padding-top: var(--space-8); padding-bottom: var(--space-8); }

/* Border Radius */
.rounded-none { border-radius: var(--radius-none); }
.rounded-sm { border-radius: var(--radius-sm); }
.rounded { border-radius: var(--radius-md); }
.rounded-lg { border-radius: var(--radius-lg); }
.rounded-xl { border-radius: var(--radius-xl); }
.rounded-2xl { border-radius: var(--radius-2xl); }
.rounded-full { border-radius: var(--radius-full); }

/* Background Colors */
.bg-white { background-color: var(--color-white); }
.bg-gray-50 { background-color: var(--color-gray-50); }
.bg-gray-100 { background-color: var(--color-gray-100); }
.bg-primary { background-color: var(--color-primary); }
.bg-secondary { background-color: var(--color-secondary); }
.bg-accent { background-color: var(--color-accent); }

/* Object Fit */
.object-cover { object-fit: cover; }
.object-contain { object-fit: contain; }
.object-center { object-position: center; }

/* Aspect Ratio */
.aspect-square { aspect-ratio: 1 / 1; }
.aspect-video { aspect-ratio: 16 / 9; }
.aspect-4-3 { aspect-ratio: 4 / 3; }
.aspect-3-2 { aspect-ratio: 3 / 2; }

/* Cursor */
.cursor-pointer { cursor: pointer; }
.cursor-default { cursor: default; }
.cursor-not-allowed { cursor: not-allowed; }

/* Pointer Events */
.pointer-events-none { pointer-events: none; }
.pointer-events-auto { pointer-events: auto; }

/* User Select */
.select-none { user-select: none; }
.select-text { user-select: text; }
.select-all { user-select: all; }

/* Z-Index */
.z-0 { z-index: 0; }
.z-10 { z-index: 10; }
.z-20 { z-index: 20; }
.z-50 { z-index: 50; }

/* Shadow */
.shadow-none { box-shadow: none; }
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }

/* Opacity */
.opacity-0 { opacity: 0; }
.opacity-25 { opacity: 0.25; }
.opacity-50 { opacity: 0.5; }
.opacity-75 { opacity: 0.75; }
.opacity-100 { opacity: 1; }

/* Transitions */
.transition-none { transition: none; }
.transition { transition: all var(--transition-base); }
.transition-fast { transition: all var(--transition-fast); }
.transition-slow { transition: all var(--transition-slow); }

/* Transform */
.transform { transform: translateZ(0); }
.scale-100 { transform: scale(1); }
.scale-105 { transform: scale(1.05); }
.scale-110 { transform: scale(1.1); }

/* Hover Effects */
.hover-lift {
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.hover-lift:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}

.hover-scale {
    transition: transform var(--transition-base);
}

.hover-scale:hover {
    transform: scale(1.02);
}

/* Animation */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@keyframes pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.animate-fade-in { animation: fadeIn 0.5s ease; }
.animate-fade-in-up { animation: fadeInUp 0.5s ease; }
.animate-fade-in-down { animation: fadeInDown 0.5s ease; }
.animate-slide-in-right { animation: slideInRight 0.5s ease; }
.animate-slide-in-left { animation: slideInLeft 0.5s ease; }
.animate-pulse { animation: pulse 2s infinite; }
.animate-spin { animation: spin 1s linear infinite; }

/* ==========================================================================
   Scroll Reveal — Premium Animation System
   ========================================================================== */

@media (prefers-reduced-motion: no-preference) {

    /* Base */
    .reveal {
        opacity: 0;
        transform: translateY(40px);
        transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1),
                    transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
        will-change: opacity, transform;
    }

    .reveal.is-visible {
        opacity: 1;
        transform: translateY(0) !important;
    }

    /* Directions */
    .reveal--left  { transform: translateX(-50px); }
    .reveal--right { transform: translateX(50px); }
    .reveal--up    { transform: translateY(40px); }
    .reveal--down  { transform: translateY(-30px); }

    /* Scale in */
    .reveal--scale {
        transform: scale(0.92) translateY(20px);
        transition: opacity 0.7s cubic-bezier(0.16, 1, 0.3, 1),
                    transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal--scale.is-visible { transform: scale(1) translateY(0); }

    /* Fade only — for subtle elements */
    .reveal--fade {
        transform: none;
        transition: opacity 0.9s ease;
    }
    .reveal--fade.is-visible { opacity: 1; }

    /* Stagger delays */
    .reveal--delay-1 { transition-delay: 0.08s; }
    .reveal--delay-2 { transition-delay: 0.16s; }
    .reveal--delay-3 { transition-delay: 0.24s; }
    .reveal--delay-4 { transition-delay: 0.32s; }
    .reveal--delay-5 { transition-delay: 0.40s; }
    .reveal--delay-6 { transition-delay: 0.48s; }

    /* Slow / fast variants */
    .reveal--slow {
        transition-duration: 1s;
    }
    .reveal--fast {
        transition-duration: 0.5s;
    }

    /* Special: clip reveal for headings */
    .reveal--clip {
        clip-path: inset(0 0 100% 0);
        opacity: 1;
        transform: none;
        transition: clip-path 0.8s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal--clip.is-visible { clip-path: inset(0 0 0% 0); }

    /* Floating subtle loop for hero badge / accent items */
    @keyframes float {
        0%, 100% { transform: translateY(0px); }
        50%       { transform: translateY(-8px); }
    }
    .animate-float {
        animation: float 4s ease-in-out infinite;
    }

    /* Shimmer for accent lines / gold underlines */
    @keyframes shimmer {
        0%   { background-position: -200% center; }
        100% { background-position: 200% center; }
    }
    .animate-shimmer {
        background: linear-gradient(90deg,
            var(--color-secondary) 0%,
            #f5d78e 40%,
            var(--color-secondary) 60%,
            #c8a84b 100%);
        background-size: 200% auto;
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        animation: shimmer 3s linear infinite;
    }

    /* Counter count-up pulse */
    @keyframes countPulse {
        0%   { transform: scale(1); }
        50%  { transform: scale(1.06); }
        100% { transform: scale(1); }
    }
    .animate-count-pulse {
        animation: countPulse 0.4s ease-out;
    }

    /* Line draw for decorative lines */
    @keyframes drawLine {
        from { transform: scaleX(0); }
        to   { transform: scaleX(1); }
    }
    .reveal--line {
        transform-origin: left center;
        transform: scaleX(0);
        opacity: 1;
        transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
    }
    .reveal--line.is-visible { transform: scaleX(1); }

}

/* Reduced motion: instant appearance */
@media (prefers-reduced-motion: reduce) {
    .reveal,
    .reveal--left,
    .reveal--right,
    .reveal--scale,
    .reveal--clip,
    .reveal--line,
    .reveal--fade {
        opacity: 1 !important;
        transform: none !important;
        clip-path: none !important;
        transition: none !important;
    }
    .animate-float,
    .animate-shimmer { animation: none !important; }
}

/* Responsive Utilities */
@media (max-width: 1024px) {
    .lg\:hidden { display: none !important; }
}

@media (max-width: 768px) {
    .md\:hidden { display: none !important; }
}

@media (max-width: 640px) {
    .sm\:hidden { display: none !important; }
}

@media (min-width: 641px) {
    .sm\:block { display: block; }
}

@media (min-width: 769px) {
    .md\:block { display: block; }
}

@media (min-width: 1025px) {
    .lg\:block { display: block; }
}

/* Print Utilities */
@media print {
    .no-print { display: none !important; }
    .print-only { display: block !important; }
}


/* ==========================================================================
   WordPress Core Styles
   ========================================================================== */

/* Gutenberg Buttons */
.wp-block-button__link {
    text-decoration: none;
}

.wp-block-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-4);
}

/* Pagination */
.pagination,
.nav-links {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: var(--space-2);
    margin-top: var(--space-12);
}

.page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 40px;
    height: 40px;
    padding: 0 var(--space-3);
    background-color: var(--color-white);
    border: 1px solid var(--color-gray-200);
    border-radius: var(--radius-md);
    font-size: var(--text-sm);
    color: var(--color-gray-600);
    transition: all var(--transition-fast);
}

.page-numbers:hover {
    border-color: var(--color-secondary);
    color: var(--color-secondary);
}

.page-numbers.current {
    background-color: var(--color-secondary);
    border-color: var(--color-secondary);
    color: var(--color-white);
}

.page-numbers.dots {
    border: none;
    background: none;
}

/* Comments */
.comments-area {
    margin-top: var(--space-16);
    padding-top: var(--space-12);
    border-top: 1px solid var(--color-gray-200);
}

.comment-list {
    list-style: none;
    padding: 0;
}

.comment {
    margin-bottom: var(--space-8);
    padding-bottom: var(--space-8);
    border-bottom: 1px solid var(--color-gray-100);
}

.comment-author {
    display: flex;
    align-items: center;
    gap: var(--space-4);
    margin-bottom: var(--space-4);
}

.comment-author img {
    border-radius: var(--radius-full);
}

.comment-author .fn {
    font-weight: var(--font-semibold);
}

.comment-content {
    padding-left: calc(48px + var(--space-4));
}

.comment-reply-link {
    font-size: var(--text-sm);
    color: var(--color-secondary);
}

/* Gallery */
.wp-block-gallery {
    display: grid;
    gap: var(--space-4);
}

.wp-block-gallery.columns-2 {
    grid-template-columns: repeat(2, 1fr);
}

.wp-block-gallery.columns-3 {
    grid-template-columns: repeat(3, 1fr);
}

.wp-block-gallery.columns-4 {
    grid-template-columns: repeat(4, 1fr);
}

.wp-block-gallery figure {
    margin: 0;
}

.wp-block-gallery img {
    border-radius: var(--radius-lg);
}

/* Blockquote */
blockquote,
.wp-block-quote {
    border-left: 4px solid var(--color-secondary);
    padding-left: var(--space-6);
    margin: var(--space-8) 0;
    font-style: italic;
    color: var(--color-gray-600);
}

.wp-block-quote cite {
    display: block;
    margin-top: var(--space-4);
    font-style: normal;
    font-weight: var(--font-semibold);
    color: var(--color-primary);
}

/* Tables */
table {
    width: 100%;
    border-collapse: collapse;
}

th, td {
    padding: var(--space-3) var(--space-4);
    text-align: left;
    border-bottom: 1px solid var(--color-gray-200);
}

th {
    background-color: var(--color-gray-50);
    font-weight: var(--font-semibold);
}

/* Contact Form 7 */
.wpcf7-form {
    max-width: 600px;
}

.wpcf7-form-control-wrap {
    display: block;
    margin-bottom: var(--space-6);
}

.wpcf7-form label {
    display: block;
    margin-bottom: var(--space-2);
    font-weight: var(--font-medium);
}

.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea {
    width: 100%;
    padding: var(--space-4);
    border: 1px solid var(--color-gray-300);
    border-radius: var(--radius-lg);
    transition: border-color var(--transition-fast);
}

.wpcf7-form input[type="text"]:focus,
.wpcf7-form input[type="email"]:focus,
.wpcf7-form input[type="tel"]:focus,
.wpcf7-form textarea:focus {
    border-color: var(--color-secondary);
    outline: none;
}

.wpcf7-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-4) var(--space-8);
    background-color: var(--color-secondary);
    border: none;
    border-radius: var(--radius-none);
    font-weight: var(--font-semibold);
    text-transform: uppercase;
    letter-spacing: var(--tracking-wide);
    color: var(--color-primary);
    cursor: pointer;
    transition: all var(--transition-base);
}

.wpcf7-submit:hover {
    background-color: var(--color-secondary-dark);
}

.wpcf7-response-output {
    margin: var(--space-6) 0 0;
    padding: var(--space-4);
    border-radius: var(--radius-lg);
}

.wpcf7-mail-sent-ok {
    background-color: rgba(34, 197, 94, 0.1);
    border: 1px solid var(--color-success);
    color: var(--color-success);
}

.wpcf7-validation-errors {
    background-color: rgba(239, 68, 68, 0.1);
    border: 1px solid var(--color-error);
    color: var(--color-error);
}

/* ==========================================================================
   Print Styles
   ========================================================================== */
@media print {
    .site-header,
    .site-footer,
    .sticky-cta,
    .cta-section,
    .nav-toggle,
    .command-bar {
        display: none !important;
    }
    
    .hero {
        min-height: auto;
        padding: var(--space-8) 0;
    }
    
    .hero__background {
        display: none;
    }
    
    .hero__content {
        color: var(--color-primary);
    }
    
    a {
        text-decoration: underline;
    }
    
    a[href]::after {
        content: " (" attr(href) ")";
        font-size: 0.8em;
    }
}