/* ==========================================================================
   ARCHITAPE GLOBAL STYLESHEET
   Core variables, shared resets, and base typography for all templates.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap");

/* Unified Variables */
:root {
    /* Brand Colors */
    --primary-color: #559ab3;
    --primary-dark: #3d7a8f;
    --primary-light: #7bb3c7;
    --primary-lighter: #ffffff;

    --at-accent: #73c5d8;
    --at-accent-light: #e6f7fb;

    --brand-blue: #559ab3;

    /* Text & Greys */
    --text-dark: #1a1a1a;
    --text-main: #0f172a;
    --text-medium: #4a4a4a;
    --text-light: #6b6b6b;
    --text-muted: #475569;

    --border-color: #e0e0e0;
    --shadow-color: rgba(0, 0, 0, 0.08);
    --white: #ffffff;

    --at-dark: #1a1a1a;
    --at-gray: #f8f9fa;
    --at-gray-text: #666666;

    --at-transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Global Resets and Base Styles */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Inter", sans-serif;
    color: var(--text-main);
    line-height: 1.5;
    background-color: #ffffff;
}

/* Common Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: "Inter", sans-serif;
    color: var(--text-dark);
    font-weight: 700;
}

a {
    color: var(--primary-color);
    text-decoration: none;
    transition: var(--at-transition);
}

a:hover {
    color: var(--primary-dark);
}

/* ==================================================== */
/* Source: home.xml */
/* ==================================================== */

/* Premium Hover Effects for Home Cards */
.s_card {
    transition:
        transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1),
        box-shadow 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) !important;
    border: none !important;
    overflow: hidden;
}

.s_card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, 0.15) !important;
}

.s_card .o_card_img_wrapper img {
    transition: transform 0.5s ease;
}

.s_card:hover .o_card_img_wrapper img {
    transform: scale(1.05);
}

.s_card .btn-outline-primary {
    transition: all 0.2s ease;
}

.s_card:hover .btn-outline-primary {
    background-color: var(--primary);
    color: white;
    border-color: var(--primary);
}

/* Mobile Optimizations */
@media (max-width: 768px) {
    .o_background_video.o_full_screen_height {
        /* 16:9 Aspect Ratio based on screen width to prevent cropping */
        min-height: 56.25vw !important;
        height: 56.25vw !important;
    }

    /* Also reduce the text cover section if it's too tall */
    .s_cover.o_full_screen_height {
        min-height: 60vh !important;
        height: auto !important;
        padding-top: 60px !important;
        padding-bottom: 60px !important;
    }
}