#one-stop-centre { font-family: 'DM Sans', sans-serif; }

.container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 40px;
        }
        
        .section-subtitle,
        .hero-description {
            text-align: justify;
            text-justify: inter-word;
        }
        
        /* Hero Section with Parallax Effect */
        .hero {
            margin-top: 0; 
            min-height: 100vh; /* Locks to full screen height */
            display: flex;
            align-items: center; 
            justify-content: center;
            background: linear-gradient(rgba(45, 90, 61, 0.7), rgba(26, 36, 30, 0.85)), 
                        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800"><rect fill="%23333" width="1200" height="800"/></svg>');
            background-size: cover;
            background-position: center;
            background-attachment: fixed;
            text-align: center;
            color: #FFFFFF;
            position: relative;
            overflow: hidden;
            padding: 80px 0; /* Ensures content doesn't hit edges on short screens */
        }

        /* Bottom Fade to next section */
        .hero::before {
            content: '';
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            height: 15vh;
            background: linear-gradient(to bottom, transparent, #FFFFFF);
            z-index: 1;
        }

        .hero-content {
            position: relative;
            z-index: 2;
            width: 100%;
            max-width: 1000px; /* Limits the width of the stats block */
            margin: 0 auto;
        }

        .hero-badge {
            display: inline-block;
            font-family: 'DM Sans', sans-serif;
            font-size: 12px;
            font-weight: 700;
            text-transform: uppercase;
            letter-spacing: 2px;
            color: #C6A867;
            background: rgba(198, 168, 103, 0.15);
            padding: 8px 20px;
            border-radius: 100px;
            margin-bottom: 24px;
            border: 1px solid rgba(198, 168, 103, 0.3);
            backdrop-filter: blur(10px);
        }

        .hero-title {
            font-family: 'Playfair Display', Georgia, serif;
            font-size: clamp(48px, 10vw, 86px); /* Responsive font sizing */
            font-weight: 400;
            margin-bottom: 32px;
            font-style: italic;
            line-height: 1.1;
            text-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
        }

        .hero-subtitle {
            font-family: 'DM Sans', sans-serif;
            font-size: 22px;
            font-weight: 400;
            margin-bottom: 16px;
            opacity: 0.95;
        }

        .hero-description {
            font-family: 'DM Sans', sans-serif;
            font-size: 17px;
            max-width: 800px;
            margin: 0 auto 40px;
            opacity: 0.9;
            line-height: 1.8;
        }

        .hero-cta {
            display: inline-flex;
            align-items: center;
            gap: 10px;
            padding: 20px 48px;
            background: #C6A867;
            color: #1A241E;
            font-family: 'DM Sans', sans-serif;
            font-size: 16px;
            font-weight: 700;
            text-decoration: none;
            border-radius: 100px;
            transition: all 0.3s ease;
            box-shadow: 0 10px 30px rgba(198, 168, 103, 0.3);
        }

        .hero-cta:hover {
            background: #D4B676;
            transform: translateY(-3px);
            box-shadow: 0 15px 40px rgba(198, 168, 103, 0.4);
        }
        
        /* --- Integrated Intro Stats Styling --- */
        .intro-stats {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
            margin: 40px auto 50px; /* Space above and below stats */
            padding: 30px;
            background: rgba(255, 255, 255, 0.05); /* Subtle glass effect */
            backdrop-filter: blur(10px);
            border-radius: 24px;
            border: 1px solid rgba(198, 168, 103, 0.2);
            max-width: 800px;
        }
        
        .intro-stat-number {
            font-family: 'Playfair Display', Georgia, serif;
            font-size: 42px;
            font-weight: 600;
            color: #C6A867;
            display: block;
            line-height: 1;
            margin-bottom: 8px;
        }
        
        .intro-stat-label {
            font-family: 'DM Sans', sans-serif;
            font-size: 13px;
            text-transform: uppercase;
            letter-spacing: 2px;
            opacity: 0.8;
        }

        /* Section Styles */
        .section {
            padding: 100px 0;
        }
        
        .section-cuisine {
            background: #FFFFFF;
        }
        
        .section-alt {
            background: #FAFAF8;
        }

        .section-title {
            font-family: 'Playfair Display', Georgia, serif;
            font-size: 52px;
            font-weight: 400;
            color: #1A241E;
            margin-bottom: 16px;
            text-align: center;
        }

        .section-subtitle {
            font-family: 'DM Sans', sans-serif;
            font-size: 19px;
            color: #666;
            text-align: center;
            max-width: 700px;
            margin: 0 auto 64px;
            line-height: 1.7;
        }

.osc-container {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 40px;
}

/* ---- Hero ---- */
.osc-hero {
    min-height: 100vh;
    position: relative;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #0D1410;
    padding: 120px 0 80px;
}

.osc-hero-bg {
    position: absolute;
    inset: 0;
    background: 
        linear-gradient(rgba(13, 20, 16, 0.55), rgba(13, 20, 16, 0.80)),
        url('<?php echo get_template_directory_uri(); ?>/images/hero-background/project-3-community-resilient.webp') center/cover no-repeat;
    z-index: 0;
}

.osc-hero-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(198, 168, 103, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(198, 168, 103, 0.04) 1px, transparent 1px);
    background-size: 60px 60px;
    z-index: 1;
}

.osc-hero-overlay {
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 20vh;
    background: linear-gradient(to bottom, transparent, #FAFAF8);
    z-index: 2;
}

.osc-hero-content {
    position: relative;
    z-index: 3;
    max-width: 860px;
}

.osc-breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    margin-bottom: 28px;
    color: rgba(255,255,255,0.5);
}
.osc-breadcrumb a { color: rgba(255,255,255,0.6); text-decoration: none; transition: color 0.3s; }
.osc-breadcrumb a:hover { color: #C6A867; }
.osc-breadcrumb span:last-child { color: #C6A867; }

.osc-hero-badge {
    display: inline-flex;
    align-items: center;
    padding: 10px 24px;
    background: rgba(198, 168, 103, 0.15);
    border: 1px solid rgba(198, 168, 103, 0.35);
    border-radius: 100px;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #C6A867;
    margin-bottom: 28px;
}

.osc-hero-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(44px, 6vw, 80px);
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1.1;
    margin-bottom: 24px;
}

.osc-hero-highlight {
    font-style: italic;
    background: linear-gradient(135deg, #2D5A3D, #4A8B5C);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.osc-hero-desc {
    font-size: 18px;
    color: rgba(255,255,255,0.75);
    line-height: 1.8;
    max-width: 680px;
    margin-bottom: 36px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-hero-pills {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.osc-pill {
    padding: 10px 22px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 100px;
    font-size: 14px;
    font-weight: 500;
    color: #E8E4DC;
    text-decoration: none;
    transition: all 0.3s ease;
    backdrop-filter: blur(10px);
}
.osc-pill:hover {
    background: #2D5A3D;
    border-color: #2D5A3D;
    color: #fff;
}

/* ---- Shared Section ---- */
.osc-section { padding: 100px 0; }
.osc-section--dark { background: #1A241E; }
.osc-section--light { background: #FAFAF8; }
.osc-section--warm { background: #FFFFFF; }

.osc-section-header {
    text-align: center;
    margin-bottom: 64px;
}

.osc-eyebrow {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #2D5A3D;
    margin-bottom: 14px;
}
.osc-eyebrow--gold { color: #C6A867; }

.osc-section-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: clamp(34px, 5vw, 52px);
    font-weight: 400;
    color: #1A241E;
    line-height: 1.15;
    margin-bottom: 16px;
}
.osc-section-title em { font-style: italic; color: #2D5A3D; }
.osc-section-title--light { color: #FFFFFF; }
.osc-section-title--light em { color: #C6A867; }

.osc-section-sub {
    font-size: 17px;
    color: #666;
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.8;
    text-align: justify;
    text-justify: inter-word;
}
.osc-section-sub--light { color: #A8A49C; }

/* ---- Intro ---- */
.osc-intro {
    background: #FAFAF8;
    padding: 100px 0;
}

.osc-intro-single {
    max-width: 900px;
    margin: 0 auto;
    text-align: center;
}

.osc-intro-single .osc-section-title {
    margin-bottom: 32px;
}

.osc-intro-body {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 32px;
    text-align: left;
    margin-bottom: 56px;
}

.osc-intro-body p {
    font-size: 16px;
    color: #555;
    line-height: 1.9;
    text-align: justify;
    text-justify: inter-word;
}

.osc-intro-pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
}

.osc-pillar {
    background: #FFFFFF;
    border-radius: 16px;
    padding: 28px 20px;
    border: 1px solid rgba(0,0,0,0.06);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
}

.osc-pillar:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.08);
    border-color: #2D5A3D;
}

.osc-pillar-icon {
    font-size: 32px;
    margin-bottom: 4px;
}

.osc-pillar strong {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 16px;
    color: #1A241E;
}

.osc-pillar span {
    font-size: 12px;
    color: #888;
    text-align: center;
    line-height: 1.5;
}

@media (max-width: 768px) {
    .osc-intro-body { grid-template-columns: 1fr; }
    .osc-intro-pillars { grid-template-columns: repeat(2, 1fr); }
}

/* ---- Attractions ---- */
.osc-attractions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: auto auto;
    gap: 20px;
}

.osc-attract-card--large {
    grid-column: span 2;
}

.osc-attract-card {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 20px;
    overflow: hidden;
    transition: all 0.4s ease;
}
.osc-attract-card:hover {
    transform: translateY(-8px);
    border-color: rgba(198,168,103,0.3);
    box-shadow: 0 20px 48px rgba(0,0,0,0.3);
}

.osc-attract-img {
    width: 100%;
    aspect-ratio: 16/9;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.osc-attract-card--large .osc-attract-img {
    aspect-ratio: 16/8;
}

.osc-attract-emoji { font-size: 64px; }
.osc-attract-card--large .osc-attract-emoji { font-size: 96px; }

.osc-attract-body { padding: 24px 28px 28px; }

.osc-attract-tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #C6A867;
    margin-bottom: 10px;
}

.osc-attract-body h3 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 20px;
    font-weight: 500;
    color: #FFFFFF;
    margin-bottom: 10px;
    line-height: 1.3;
}
.osc-attract-card--large .osc-attract-body h3 { font-size: 26px; }

.osc-attract-body p {
    font-size: 14px;
    color: #A8A49C;
    line-height: 1.7;
    text-align: justify;
    text-justify: inter-word;
}

/* ---- Blog Grid (Culinary) ---- */
.osc-blog-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 28px;
}

.osc-blog-sidebar {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.osc-blog-card {
    background: #FFFFFF;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0,0,0,0.07);
    border: 1px solid rgba(0,0,0,0.05);
    transition: all 0.4s ease;
    display: flex;
    flex-direction: column; /* ensures footer sticks to bottom */
}
.osc-blog-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 40px rgba(0,0,0,0.12);
}

.osc-blog-img-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 16/9; /* uniform image height across all 4 cards */
    overflow: hidden;
    background: #E5E5E5;
    flex-shrink: 0;
}

.osc-blog-img-wrap--small {
    aspect-ratio: 16/7;
}

.osc-blog-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    transition: transform 0.5s ease;
}
.osc-blog-card:hover .osc-blog-img { transform: scale(1.04); }

.osc-blog-category-tag {
    position: absolute;
    top: 14px;
    left: 14px;
    background: rgba(198,168,103,0.95);
    color: #1A241E;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 5px 14px;
    border-radius: 100px;
}

.osc-blog-body {
    padding: 24px 28px 28px;
    display: flex;
    flex-direction: column;
    flex-grow: 1; /* pushes footer to bottom */
}

.osc-blog-card--small .osc-blog-body { padding: 18px 22px 22px; }

.osc-blog-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: #999;
    margin-bottom: 10px;
}

.osc-blog-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 22px;
    font-weight: 600;
    color: #1A241E;
    line-height: 1.3;
    margin-bottom: 12px;
}
.osc-blog-card--small .osc-blog-title { font-size: 18px; }

.osc-blog-excerpt {
    font-size: 14px;
    color: #666;
    line-height: 1.75;
    margin-bottom: 16px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-blog-footer {
    border-top: 1px solid #F0F0F0;
    padding-top: 14px;
    margin-top: auto; /* always at bottom regardless of excerpt length */
}

.osc-blog-contact {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 12px;
    color: #888;
}

/* ---- Homestay ---- */
.osc-homestay-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
    align-items: start;
}

.osc-homestay-card {
    background: #FFFFFF;
    border-radius: 24px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,0.08);
}

.osc-homestay-img-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 4/3;
    overflow: hidden;
}

.osc-homestay-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.5s ease;
}
.osc-homestay-card:hover .osc-homestay-img { transform: scale(1.04); }

.osc-homestay-badge {
    position: absolute;
    top: 14px;
    left: 14px;
    background: #2D5A3D;
    color: #FFFFFF;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 5px 14px;
    border-radius: 100px;
}

.osc-homestay-body { padding: 28px 32px 32px; }

.osc-homestay-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 26px;
    font-weight: 600;
    color: #1A241E;
    margin-bottom: 12px;
}

.osc-homestay-desc {
    font-size: 15px;
    color: #666;
    line-height: 1.8;
    margin-bottom: 20px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-homestay-features {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 20px;
}
.osc-homestay-features span {
    padding: 7px 14px;
    background: #FAFAF8;
    border-radius: 100px;
    font-size: 12px;
    color: #555;
    border: 1px solid #E5E5E5;
}

.osc-homestay-contact {
    border-top: 1px solid #F0F0F0;
    padding-top: 16px;
}
.osc-contact-row {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 13px;
    color: #666;
    margin-bottom: 8px;
}
.osc-tiktok-link {
    font-size: 13px;
    color: #2D5A3D;
    text-decoration: none;
    font-weight: 500;
}
.osc-tiktok-link:hover { text-decoration: underline; }

/* Homestay types (right col) */
.osc-homestay-types { display: flex; flex-direction: column; gap: 20px; }

.osc-types-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 24px;
    font-weight: 500;
    color: #1A241E;
    margin-bottom: 8px;
}

.osc-type-card {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    padding: 24px;
    background: #FAFAF8;
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}
.osc-type-card:hover {
    background: #FFFFFF;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
    transform: translateX(4px);
}

.osc-type-icon {
    width: 48px;
    height: 48px;
    background: #2D5A3D;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    flex-shrink: 0;
}

.osc-type-card h4 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 17px;
    color: #1A241E;
    margin-bottom: 6px;
}
.osc-type-card p {
    font-size: 13px;
    color: #666;
    line-height: 1.6;
}

/* ---- Digital Tools ---- */
.osc-tools-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}

.osc-tool-feature {
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 24px;
    overflow: hidden;
    transition: all 0.4s ease;
}
.osc-tool-feature:hover {
    border-color: rgba(198,168,103,0.3);
    box-shadow: 0 20px 48px rgba(0,0,0,0.3);
}

.osc-tool-img-wrap {
    width: 100%;
    aspect-ratio: 3/4;
    overflow: hidden;
}

.osc-tool-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
    transition: transform 0.5s ease;
}
.osc-tool-feature:hover .osc-tool-img { transform: scale(1.03); }

.osc-tool-body {
    padding: 28px 32px 32px;
}

.osc-tool-body h3 {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 22px;
    font-weight: 500;
    color: #FFFFFF;
    line-height: 1.3;
    margin-bottom: 14px;
}

.osc-tool-body p {
    font-size: 14px;
    color: #A8A49C;
    line-height: 1.75;
    margin-bottom: 18px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-tool-list {
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.osc-tool-list li {
    font-size: 13px;
    color: #C6A867;
}

/* ---- Benefits & Vision ---- */
.osc-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 80px;
    align-items: start;
}

.osc-two-col > div:first-child .osc-section-title { text-align: left; }
.osc-two-col > div:first-child p {
    font-size: 15px;
    color: #555;
    line-height: 1.9;
    margin-bottom: 16px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-benefits-list {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 32px;
}

.osc-benefit {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.osc-benefit-icon {
    width: 44px;
    height: 44px;
    background: rgba(45,90,61,0.1);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    flex-shrink: 0;
}

.osc-benefit strong {
    display: block;
    font-size: 15px;
    color: #1A241E;
    margin-bottom: 3px;
}
.osc-benefit span {
    font-size: 13px;
    color: #777;
}

.osc-vision-box {
    background: linear-gradient(135deg, #1A241E 0%, #2D5A3D 100%);
    border-radius: 28px;
    padding: 48px 44px;
    color: #FFFFFF;
    position: sticky;
    top: 120px;
}

.osc-vision-eyebrow {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: #C6A867;
    margin-bottom: 16px;
}

.osc-vision-title {
    font-family: 'Playfair Display', Georgia, serif;
    font-size: 28px;
    font-weight: 400;
    color: #FFFFFF;
    line-height: 1.3;
    margin-bottom: 20px;
}

.osc-vision-box p {
    font-size: 15px;
    color: rgba(255,255,255,0.8);
    line-height: 1.85;
    margin-bottom: 16px;
    text-align: justify;
    text-justify: inter-word;
}

.osc-vision-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid rgba(255,255,255,0.1);
}
.osc-vision-tags span {
    padding: 8px 16px;
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    border-radius: 100px;
    font-size: 13px;
    color: #E8D5A3;
}

.osc-blog-img-wrap a,
.osc-homestay-img-wrap a,
.osc-tool-img-wrap a {
    display: block;
    width: 100%;
    height: 100%;
    cursor: zoom-in;
}

.check-item {
    display: flex;
    align-items: center;
    gap: 8px;
}

.check-icon {
    width: 18px;
    height: 18px;
    color: #C8A96A;
}

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

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

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

@keyframes scaleIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.osc-animate,
.animate-on-scroll,
.slide-left,
.slide-right,
.scale-in {
    opacity: 0;
}

.osc-animate.animated,
.animate-on-scroll.animated {
    animation: fadeInUp 0.8s ease forwards;
}

.slide-left.animated {
    animation: slideInLeft 0.8s ease forwards;
}

.slide-right.animated {
    animation: slideInRight 0.8s ease forwards;
}

.scale-in.animated {
    animation: scaleIn 0.8s ease forwards;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1100px) {
    .osc-attractions-grid { grid-template-columns: repeat(2, 1fr); }
    .osc-attract-card--large { grid-column: span 2; }
}

@media (max-width: 900px) {
    .osc-intro-grid,
    .osc-blog-grid,
    .osc-homestay-grid,
    .osc-tools-grid,
    .osc-two-col { grid-template-columns: 1fr; gap: 40px; }

    .osc-intro-visual { height: 260px; }
    .osc-attractions-grid { grid-template-columns: 1fr; }
    .osc-attract-card--large { grid-column: span 1; }

    .osc-vision-box { position: static; }
}

@media (max-width: 768px) {
    .osc-blog-grid { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
    .osc-container { padding: 0 20px; }
    .osc-section { padding: 64px 0; }
    .osc-hero { padding: 100px 0 60px; }
    .osc-hero-title { font-size: 38px; }
    .osc-hero-pills { flex-direction: column; align-items: flex-start; }
    .osc-intro-stats { flex-direction: column; gap: 16px; }
    .osc-tool-img-wrap { aspect-ratio: 4/3; }
}