@charset "UTF-8";

/* Reset & Global */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    line-height: 1.6;
    color: #333;
    background-color: #f9f9f9;
    font-size: 16px;
}

a {
    text-decoration: none;
    color: inherit;
    transition: color 0.3s ease;
}

ul {
    list-style: none;
}

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

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Header & Navigation */
header {
    background-color: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    position: sticky;
    top: 0;
    z-index: 1000;
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 70px;
}

.logo {
    display: flex;
    align-items: center;
    font-size: 24px;
    font-weight: bold;
    color: #d4af37; /* Gold color */
}

.logo img {
    height: 40px;
    margin-right: 10px;
    border-radius: 50%;
}

.nav-menu {
    display: flex;
    gap: 25px;
    align-items: center;
}

.nav-link {
    color: #555;
    font-weight: 500;
    font-size: 15px;
}

.nav-link:hover, .nav-link.active {
    color: #d4af37;
}

.mobile-menu-icon {
    display: none;
    cursor: pointer;
    font-size: 24px;
}

/* Buttons */
.btn {
    display: inline-block;
    padding: 12px 30px;
    border-radius: 50px;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
}

.btn-primary {
    background-color: #d4af37;
    color: #fff;
    border: 2px solid #d4af37;
}

.btn-primary:hover {
    background-color: #b5952f;
    border-color: #b5952f;
}

.btn-outline {
    background-color: transparent;
    color: #d4af37;
    border: 2px solid #d4af37;
}

.btn-outline:hover {
    background-color: #d4af37;
    color: #fff;
}

.btn-large {
    padding: 15px 40px;
    font-size: 19px;
}

/* Hero Section */
.hero {
    background: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.5)), url('images/jpsd.jpg'); /* Default fallback, overridden inline potentially */
    background-size: cover;
    background-position: center;
    height: 600px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
}

.hero-content {
    max-width: 800px;
    padding: 20px;
}

.hero h1 {
    font-size: 48px;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.2;
}

.hero h2 {
    font-size: 24px;
    margin-bottom: 30px;
    font-weight: 300;
}

/* Sections General */
section {
    padding: 20px 0;
}

.section-title {
    text-align: center;
    margin-bottom: 50px;
}

.section-title h2 {
    font-size: 36px;
    color: #222;
    margin: 25px;
}

.section-title p {
    color: #666;
    max-width: 700px;
    margin: 0 auto;
}

/* Features (SVG) */
.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}

.feature-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s;
}

.feature-card:hover {
    transform: translateY(-5px);
}

.feature-icon {
    width: 60px;
    height: 60px;
    margin-bottom: 20px;
    fill: #d4af37;
}

.feature-card h3 {
    margin-bottom: 15px;
    font-size: 20px;
}

/* Content Layouts */
.content-block {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 80px;
}

.content-block.reverse {
    flex-direction: row-reverse;
}

.content-text {
    flex: 1;
}

.content-image {
    flex: 1;
}

.content-image img {
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

/* Profiles */
.profiles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 30px;
}

.profile-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

.profile-img {
    height: 300px;
    overflow: hidden;
}

.profile-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s;
}

.profile-card:hover .profile-img img {
    transform: scale(1.05);
}

.profile-info {
    padding: 20px;
}

.profile-name {
    font-size: 20px;
    font-weight: bold;
    margin-bottom: 5px;
}

.profile-location {
    color: #888;
    font-size: 14px;
    margin-bottom: 10px;
}

/* Cities */
.cities-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.city-card {
    position: relative;
    height: 300px;
    border-radius: 8px;
    overflow: hidden;
    display: flex;
    align-items: flex-end;
    background-color: #333;
}

a.city-card {
    text-decoration: none;
    color: inherit;
}

.city-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.7;
    transition: transform 0.5s, opacity 0.3s;
}

.city-card:hover .city-bg {
    transform: scale(1.1);
    opacity: 0.5;
}

.city-content {
    position: relative;
    z-index: 2;
    padding: 20px;
    width: 100%;
    background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.6) 50%, transparent 100%);
    color: #fff;
}

.city-name {
    display: block;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.city-desc {
    font-size: 14px;
    line-height: 1.5;
    opacity: 0.9;
}

/* Pricing */
.pricing-container {
    display: flex;
    justify-content: center;
    gap: 30px;
    flex-wrap: wrap;
}

.pricing-column {
    background: #fff;
    border-radius: 15px;
    padding: 40px;
    width: 100%;
    max-width: 400px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    text-align: center;
}

.pricing-header h3 {
    font-size: 24px;
    margin-bottom: 10px;
    color: #d4af37;
}

.price-item {
    margin: 20px 0;
    padding: 15px;
    border-bottom: 1px solid #eee;
}

.price-item:last-child {
    border-bottom: none;
}

.price-amount {
    font-size: 28px;
    font-weight: bold;
    color: #333;
}

.price-duration {
    color: #777;
    font-size: 14px;
}

/* App Section */
.app-section {
    background-color: #1a1a1a;
    color: #fff;
    overflow: hidden;
}

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

.app-text {
    flex: 1;
    padding-right: 50px;
}

.app-text h2 {
    color: #fff;
}

.app-text p {
    color: #ccc;
    margin-bottom: 30px;
}

.app-image {
    flex: 1;
    text-align: center;
}

.app-image img {
    max-height: 500px;
    display: inline-block;
}

/* Footer */
footer {
    background-color: #222;
    color: #bbb;
    padding: 60px 0 20px;
}

.footer-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 40px;
    margin-bottom: 40px;
}

.footer-col h4 {
    color: #fff;
    margin-bottom: 20px;
    font-size: 19px;
}

.footer-links li {
    margin-bottom: 10px;
}

.footer-links a:hover {
    color: #d4af37;
}

.copyright {
    text-align: center;
    padding-top: 20px;
    border-top: 1px solid #444;
    font-size: 14px;
}

/* Forms */
.auth-container {
    max-width: 500px;
    margin: 50px auto;
    background: #fff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}

.form-group {
    margin-bottom: 20px;
}

.form-group label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
}

.form-control {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 16px;
}

.form-control:focus {
    border-color: #d4af37;
    outline: none;
}

/* Blog */
.blog-section {
    background-color: #111;
    padding: 80px 0;
    color: #fff;
}

.blog-section .section-title h2 {
    color: #fff;
}

.blog-section .section-title p {
    color: #aaa;
}

.blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
}

.blog-list {
    display: flex;
    flex-direction: column;
    gap: 30px;
}

.blog-card {
    background: #1a1a1a;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    transition: transform 0.3s;
    border: 1px solid #333;
}

.blog-card:hover {
    transform: translateY(-5px);
    border-color: #444;
}

.blog-card.horizontal {
    display: flex;
    flex-direction: row;
    align-items: center;
    min-height: 200px;
    padding: 30px;
    gap: 30px;
}

.blog-card.horizontal img {
    width: 220px;
    height: 220px;
    object-fit: cover;
    border-radius: 15px;
    flex-shrink: 0;
}

.blog-card.horizontal .blog-content {
    width: auto;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 0;
}

.blog-content {
    padding: 20px;
}

.blog-title {
    display: block;
    font-size: 26px;
    margin-bottom: 15px;
    font-weight: bold;
    color: #d4af37;
    font-family: "Times New Roman", serif;
    font-style: italic;
    text-decoration: none;
}

.blog-title:hover {
    color: #fff;
}

.blog-excerpt {
    font-size: 16px;
    color: #ccc;
    margin-bottom: 0;
    line-height: 1.8;
}

.blog-section .blog-excerpt {
    position: relative;
    padding-left: 30px;
}

.blog-section .blog-excerpt::before {
    content: "❝";
    position: absolute;
    left: 0;
    top: -5px;
    font-size: 30px;
    color: #e91e63;
    font-family: serif;
    line-height: 1;
}

/* FAQ */
.faq-item {
    background: #fff;
    margin-bottom: 15px;
    padding: 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.faq-question {
    font-weight: bold;
    font-size: 19px;
    margin-bottom: 10px;
    cursor: pointer;
    position: relative;
}

.faq-answer {
    color: #555;
    line-height: 1.6;
}

/* Mobile Responsive */
@media (max-width: 768px) {
    .hero {
        height: auto;
        min-height: 500px;
        padding: 100px 20px 60px;
    }

    .hero h1 {
        font-size: 28px;
    }
    
    .nav-menu {
        display: none;
        position: absolute;
        top: 70px;
        left: 0;
        width: 100%;
        background: #fff;
        flex-direction: column;
        padding: 20px;
        box-shadow: 0 5px 10px rgba(0,0,0,0.1);
    }
    
    .nav-menu.active {
        display: flex;
    }
    
    .mobile-menu-icon {
        display: block;
    }

    .content-block, .content-block.reverse {
        flex-direction: column;
    }
    
    .app-container {
        flex-direction: column;
    }
    
    .app-text {
        padding-right: 0;
        text-align: center;
        margin-bottom: 40px;
    }
    
    .cities-grid {
        grid-template-columns: 1fr;
    }
    
    .blog-card.horizontal {
        flex-direction: column;
        padding: 20px;
        gap: 20px;
    }
    
    .blog-card.horizontal img {
        width: 100%;
        height: 200px;
        border-radius: 10px;
    }
    
    .blog-card.horizontal .blog-content {
        width: 100%;
    }
}

/* Sugar Daddy Japan Page Specific Styles */
.grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.card-simple {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    text-align: center;
    padding-bottom: 20px;
    transition: transform 0.3s ease;
}

.card-simple:hover {
    transform: translateY(-5px);
}

.card-simple img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    margin-bottom: 15px;
}

.card-simple h3 {
    font-size: 20px;
    margin-bottom: 10px;
    color: #d4af37;
    padding: 0 15px;
}

.card-simple p {
    padding: 0 20px;
    color: #555;
    font-size: 14px;
    line-height: 1.6;
}

/* Other specific styles for sugar-daddy-japan.html */
.styled-list {
    list-style: none;
    padding-left: 0;
}

.styled-list li {
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
}

.styled-list li::before {
    content: "✔";
    color: #d4af37;
    position: absolute;
    left: 0;
    top: 2px;
}

.comparison-table-container {
    overflow-x: auto;
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.comparison-table th, .comparison-table td {
    padding: 15px;
    border: 1px solid #eee;
    text-align: left;
}

.comparison-table th {
    background-color: #f4f4f4;
    font-weight: bold;
    color: #333;
}

.types-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
    margin-top: 30px;
}

.type-item {
    background: #f9f9f9;
    padding: 25px;
    border-radius: 8px;
    border-left: 4px solid #d4af37;
}

.type-item h3 {
    margin-bottom: 10px;
    color: #333;
}

.alert-box {
    background-color: #fff3f3;
    border: 1px solid #ffcdd2;
    padding: 20px;
    border-radius: 5px;
    color: #b71c1c;
}

.alert-box ul {
    list-style: disc;
    padding-left: 20px;
    margin-top: 10px;
}

.alert-box li {
    margin-bottom: 10px;
}

.comparison-list {
    margin-top: 20px;
}

.city-feature {
    margin-bottom: 30px;
}

.city-feature h3 {
    border-bottom: 2px solid #d4af37;
    padding-bottom: 5px;
    display: inline-block;
    margin-bottom: 15px;
}

.city-feature ul {
    list-style: disc;
    padding-left: 20px;
}

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

/* Sugar Baby Japan Page Styles */

.sb-hero {
    height: 60vh;
    min-height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    margin-top: 0;
}

.sb-hero-content {
    z-index: 1;
    padding: 20px;
    max-width: 800px;
}

.sb-hero h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
}

.sb-hero p {
    font-size: 1.2rem;
    margin-bottom: 30px;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
}

.sb-section {
    padding: 60px 0;
}

.sb-bg-light {
    background-color: #f9f9f9;
}

.sb-bg-dark {
    background-color: #222;
    color: #fff;
}

.sb-content-block {
    display: flex;
    align-items: center;
    gap: 40px;
    margin-bottom: 40px;
}

.sb-content-block.sb-reverse {
    flex-direction: row-reverse;
}

.sb-text {
    flex: 1;
}

.sb-text p {
    margin-bottom: 20px;
    line-height: 1.8;
    color: inherit;
}

.sb-image {
    flex: 1;
}

.sb-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.sb-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}

.sb-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
    text-align: center;
    padding-bottom: 20px;
}

.sb-card:hover {
    transform: translateY(-5px);
}

.sb-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.sb-card h3 {
    padding: 15px 15px 5px;
    color: #d4af37;
    font-size: 1.2rem;
}

.sb-card p {
    padding: 0 15px;
    font-size: 0.95rem;
    color: #666;
}

.sb-list-check, .sb-list-dot {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 20px;
}

.sb-list-check li, .sb-list-dot li {
    position: relative;
    padding-left: 30px;
    line-height: 1.6;
}

.sb-list-check li::before {
    content: "✔";
    color: #d4af37;
    position: absolute;
    left: 0;
    top: 0;
}

.sb-list-dot li::before {
    content: "●";
    color: #d4af37;
    font-size: 0.8em;
    position: absolute;
    left: 5px;
    top: 2px;
}

.sb-feature-box {
    background: #fff;
    padding: 20px;
    border-left: 4px solid #d4af37;
    margin-bottom: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.sb-alert-box {
    background: #fff;
    padding: 20px;
    border-left: 4px solid #e91e63;
    margin-bottom: 20px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.sb-alert-box h4 {
    margin-bottom: 10px;
    color: #e91e63;
    font-size: 1.1rem;
}

.sb-alert-box p {
    margin-bottom: 0;
    color: #555;
}

.sb-feature-box h3 {
    margin-bottom: 10px;
    color: #333;
}

.sb-feature-box p {
    margin-bottom: 0;
    color: #555;
}

.sb-profile-card {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.1);
}

.sb-profile-card img {
    width: 100%;
    height: 350px;
    object-fit: cover;
}

.sb-profile-info {
    padding: 15px;
}

.sb-profile-info h4 {
    color: #d4af37;
    margin-bottom: 5px;
    font-size: 1.1rem;
}

.sb-profile-info p {
    font-size: 0.9rem;
    color: #666;
    line-height: 1.5;
}

.sb-table-container {
    overflow-x: auto;
}

.sb-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.sb-table th, .sb-table td {
    padding: 15px;
    border: 1px solid #eee;
    text-align: left;
}

.sb-table th {
    background-color: #333;
    color: #fff;
}

.sb-table tr:nth-child(even) {
    background-color: #f9f9f9;
}

.sb-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 30px;
}

.sb-step-item {
    text-align: center;
}

.sb-step-num {
    font-size: 2.5rem;
    font-weight: bold;
    color: #d4af37;
    margin-bottom: 10px;
    opacity: 0.8;
}

.sb-step-item h3 {
    margin-bottom: 15px;
    font-size: 1.2rem;
}

.sb-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.sb-place-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 3px 10px rgba(0,0,0,0.1);
}

.sb-place-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.sb-place-card h3 {
    padding: 15px 20px 5px;
    color: #d4af37;
}

.sb-place-card p {
    padding: 0 20px 20px;
    color: #666;
    line-height: 1.6;
}

.sb-terms-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}

.sb-term-item {
    background: #f4f4f4;
    padding: 20px;
    border-radius: 5px;
}

.sb-term-item h4 {
    color: #d4af37;
    margin-bottom: 10px;
}

.sb-faq-list {
    max-width: 800px;
    margin: 0 auto;
}

.sb-faq-item {
    background: #fff;
    border: 1px solid #eee;
    margin-bottom: 15px;
    border-radius: 5px;
    padding: 20px;
}

.sb-faq-q {
    font-weight: bold;
    color: #333;
    margin-bottom: 10px;
    font-size: 1.1rem;
}

.sb-faq-a {
    color: #666;
    line-height: 1.6;
}

/* Mobile Responsiveness for Sugar Baby Page */
@media (max-width: 768px) {
    .sb-hero h1 {
        font-size: 2rem;
    }
    
    .sb-content-block, .sb-content-block.sb-reverse {
        flex-direction: column;
    }
    
    .sb-grid-3, .sb-grid-2 {
        grid-template-columns: 1fr;
    }
    
    .sb-image img {
        height: auto;
    }
}

/* Sugar Daddy App Page Styles */

.app-hero {
    height: 70vh;
    min-height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    margin-top: 0;
}

.app-hero-content {
    z-index: 1;
    padding: 20px;
    max-width: 800px;
}

.app-hero h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.6);
    line-height: 1.2;
}

.app-hero p {
    font-size: 1.3rem;
    margin-bottom: 30px;
    text-shadow: 0 1px 2px rgba(0,0,0,0.6);
}

.app-hero-btns {
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

.app-btn {
    padding: 15px 40px;
    font-size: 1.1rem;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
}

.app-btn-outline {
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
}

.app-btn-outline:hover {
    background: #fff;
    color: #333;
}

.app-section {
    padding: 80px 0;
}

.app-bg-light {
    background-color: #f8f9fa;
}

.app-bg-dark {
    background-color: #1a1a1a;
    color: #fff;
}

.app-content-block {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 40px;
}

.app-content-block.app-reverse {
    flex-direction: row-reverse;
}

.app-text-content {
    flex: 1;
}

.app-text-content h2 {
    margin-bottom: 20px;
    font-size: 2rem;
    color: inherit;
}

.app-text-content p {
    margin-bottom: 20px;
    line-height: 1.8;
    color: inherit;
    font-size: 1.05rem;
}

.app-img-content {
    flex: 1;
}

.app-img-content img {
    width: 100%;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
}

.app-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.app-feature-card {
    background: #fff;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
    text-align: center;
}

.app-feature-card:hover {
    transform: translateY(-10px);
}

.app-icon {
    font-size: 3rem;
    margin-bottom: 20px;
}

.app-feature-card h3 {
    margin-bottom: 15px;
    color: #333;
    font-size: 1.3rem;
}

.app-feature-card p {
    color: #666;
    line-height: 1.6;
}

.app-features-list-container {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}

.app-features-list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.app-features-list li {
    padding-left: 25px;
    position: relative;
    line-height: 1.6;
    color: #000;
}

.app-features-list li::before {
    content: "★";
    color: #d4af37;
    position: absolute;
    left: 0;
    top: 0;
}

.app-check-list {
    list-style: none;
}

.app-check-list li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 15px;
    line-height: 1.6;
}

.app-check-list li::before {
    content: "✓";
    color: #4CAF50;
    position: absolute;
    left: 0;
    font-weight: bold;
}

.app-download-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 40px;
    margin-top: 40px;
}

.app-download-card {
    background: #fff;
    padding: 40px;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    border-top: 5px solid #d4af37;
}

.app-os-icon {
    font-size: 4rem;
    margin-bottom: 20px;
    text-align: center;
}

.app-download-card h3 {
    text-align: center;
    margin-bottom: 20px;
    font-size: 1.5rem;
}

.app-steps-list {
    margin-left: 20px;
    margin-top: 20px;
}

.app-steps-list li {
    margin-bottom: 15px;
    line-height: 1.6;
    color: #555;
}

.app-info-box {
    background: rgba(212, 175, 55, 0.1);
    padding: 20px;
    border-radius: 10px;
    margin-top: 20px;
    border-left: 4px solid #d4af37;
}

.app-info-box h4 {
    color: #b89628;
    margin-bottom: 10px;
}

.app-info-box p {
    margin-bottom: 0;
    font-size: 0.95rem;
}

.app-usage-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 40px;
}

.app-usage-item {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    transition: transform 0.3s ease;
}

.app-usage-item:hover {
    transform: translateY(-5px);
}

.app-usage-item img {
    width: 100%;
    height: 190px;
    object-fit: cover;
}

.app-usage-item h4 {
    padding: 15px 15px 5px;
    font-size: 1.1rem;
    color: #333;
}

.app-usage-item p {
    padding: 0 15px 20px;
    font-size: 0.9rem;
    color: #666;
    line-height: 1.5;
}

.app-dot-list {
    list-style: none;
}

.app-dot-list li {
    padding-left: 25px;
    position: relative;
    margin-bottom: 15px;
    line-height: 1.6;
}

.app-dot-list li::before {
    content: "●";
    color: #d4af37;
    position: absolute;
    left: 5px;
    top: 5px;
    font-size: 0.8em;
}

.app-faq-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.app-faq-item {
    background: rgba(255,255,255,0.05);
    padding: 25px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.1);
}

.app-faq-item h4 {
    color: #d4af37;
    margin-bottom: 15px;
    font-size: 1.1rem;
}

.app-faq-item p {
    color: #ccc;
    margin-bottom: 0;
    line-height: 1.6;
}

/* Mobile Responsiveness for App Page */
@media (max-width: 768px) {
    .app-hero h1 {
        font-size: 2.2rem;
    }
    
    .app-content-block, .app-content-block.app-reverse {
        flex-direction: column;
        gap: 30px;
    }
    
    .app-grid-3, .app-download-grid, .app-features-list, .app-usage-grid, .app-faq-grid {
        grid-template-columns: 1fr;
    }
    
    .app-usage-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .app-section {
        padding: 50px 0;
    }
    
    .app-img-content img {
        height: auto;
    }
}

@media (max-width: 480px) {
    .app-usage-grid {
        grid-template-columns: 1fr;
    }
    
    .app-hero-btns {
        flex-direction: column;
    }
    
    .app-btn {
        width: 100%;
        text-align: center;
    }
}

/* Fix for Sugar Daddy App Page Styles Contrast */

/* Override section title color for dark app sections */
.app-section .section-title h2 {
    color: #fff;
}
.app-section .section-title p {
    color: #ccc;
}

/* Specific styles for light background sections */
.app-bg-light {
    background-color: #f8f9fa;
    color: #333; /* Ensure text is dark on light background */
}

/* Override section title color for light app sections */
.app-bg-light .section-title h2 {
    color: #222;
}
.app-bg-light .section-title p {
    color: #666;
}

/* Ensure download cards have dark text */
.app-download-card {
    color: #333;
}
.app-download-card h3 {
    color: #333;
}
.app-download-card p {
    color: #555;
}

/* Ensure feature cards have dark text */
.app-feature-card {
    color: #333;
}

/* Ensure usage items have dark text */
.app-usage-item {
    color: #333;
}

/* FAQ Page Styles */
.faq-hero {
    height: 40vh;
    min-height: 300px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    margin-top: 0;
}

.faq-hero-content {
    z-index: 1;
    padding: 20px;
}

.faq-hero h1 {
    font-size: 2.5rem;
    margin-bottom: 10px;
    text-shadow: 0 2px 4px rgba(0,0,0,0.5);
    color: #fff;
}

.faq-hero p {
    font-size: 1.2rem;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    color: #fff;
}

.faq-intro-section {
    padding: 60px 0 40px;
    text-align: center;
}

.faq-intro-text {
    max-width: 800px;
    margin: 0 auto;
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
}

.faq-container {
    max-width: 800px;
    margin: 0 auto;
    padding-bottom: 60px;
}

.faq-category {
    margin-bottom: 40px;
}

.faq-category h3 {
    border-bottom: 2px solid #d4af37;
    padding-bottom: 10px;
    margin-bottom: 20px;
    color: #333;
    display: flex;
    align-items: center;
    gap: 10px;
}

.faq-icon {
    font-size: 1.5rem;
}

.faq-item {
    border: 1px solid #eee;
    border-radius: 5px;
    margin-bottom: 10px;
    background: #fff;
    overflow: hidden;
    transition: all 0.3s ease;
}

.faq-item:hover {
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

.faq-question {
    padding: 15px 20px;
    background: #f9f9f9;
    cursor: pointer;
    font-weight: bold;
    color: #333;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: background 0.3s ease;
}

.faq-question:hover {
    background: #f0f0f0;
}

.faq-toggle {
    font-size: 1.2rem;
    color: #d4af37;
    font-weight: bold;
    transition: transform 0.3s ease;
}

.faq-item.active .faq-toggle {
    transform: rotate(45deg);
}

.faq-answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0 20px;
    background: #fff;
}

.faq-item.active .faq-answer {
    max-height: 500px; /* Arbitrary large height */
    padding: 20px;
    border-top: 1px solid #eee;
}

.faq-answer p {
    margin-bottom: 0;
    color: #555;
    line-height: 1.6;
}

.faq-cta-section {
    padding: 60px 0;
    text-align: center;
}

.faq-cta-box {
    background: #333;
    color: #fff;
    padding: 40px;
    border-radius: 10px;
    max-width: 800px;
    margin: 0 auto;
}

.faq-cta-box h2 {
    color: #d4af37;
    margin-bottom: 15px;
}

.faq-cta-buttons {
    margin-top: 30px;
    display: flex;
    gap: 20px;
    justify-content: center;
    flex-wrap: wrap;
}

@media (max-width: 768px) {
    .faq-hero h1 {
        font-size: 2rem;
    }
    
    .faq-cta-buttons {
        flex-direction: column;
        gap: 10px;
    }
}

/* =========================================
   Contact Page Styles
   ========================================= */
.contact-hero {
    height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 50px;
}

.contact-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 800px;
}

.contact-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.contact-hero-content p {
    font-size: 1.2rem;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.contact-section {
    padding-bottom: 80px;
}

.contact-grid {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 50px;
    margin-top: 40px;
}

.contact-form-wrapper {
    background: #fff;
    padding: 40px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.contact-form .form-group {
    margin-bottom: 25px;
}

.contact-form label {
    display: block;
    margin-bottom: 8px;
    font-weight: 600;
    color: #333;
}

.contact-form .form-control {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 16px;
    transition: border-color 0.3s;
}

.contact-form .form-control:focus {
    border-color: #d4af37;
    outline: none;
}

.contact-form textarea.form-control {
    resize: vertical;
    min-height: 150px;
}

.contact-info-box {
    background: #f9f9f9;
    padding: 30px;
    border-radius: 10px;
    border-left: 4px solid #d4af37;
}

.contact-info-item {
    margin-bottom: 30px;
}

.contact-info-item h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
}

.contact-info-item p {
    color: #666;
    line-height: 1.6;
}

.faq-link-box {
    margin-top: 40px;
    padding-top: 30px;
    border-top: 1px solid #eee;
}

/* =========================================
   Privacy & Terms Pages Styles
   ========================================= */
.privacy-hero, .terms-hero {
    height: 350px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.privacy-hero-content, .terms-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 800px;
}

.privacy-hero-content h1, .terms-hero-content h1 {
    font-size: 3rem;
    margin-bottom: 15px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.privacy-content-section, .terms-content-section {
    padding-bottom: 100px;
}

.policy-wrapper {
    background: #fff;
    padding: 60px;
    border-radius: 10px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
    max-width: 900px;
    margin: 0 auto;
}

.policy-intro {
    margin-bottom: 50px;
    padding-bottom: 30px;
    border-bottom: 1px solid #eee;
}

.policy-intro h2 {
    font-size: 1.8rem;
    margin-bottom: 20px;
    color: #333;
    padding-left: 15px;
    border-left: 4px solid #d4af37; /* Consistent with other styles */
}

.policy-block {
    margin-bottom: 40px;
}

.policy-block h3 {
    font-size: 1.4rem;
    margin-bottom: 15px;
    color: #333;
    padding-left: 15px;
    border-left: 4px solid #d4af37;
}

.policy-block p {
    color: #555;
    line-height: 1.8;
    margin-bottom: 15px;
}

.policy-list {
    list-style-type: disc;
    padding-left: 20px;
    margin-bottom: 20px;
}

.policy-list li {
    margin-bottom: 10px;
    color: #555;
    line-height: 1.6;
}

.terms-updated {
    text-align: right;
    color: #888;
    font-size: 0.9rem;
    margin-bottom: 30px;
    font-style: italic;
}

/* =========================================
   Responsive Adjustments for New Pages
   ========================================= */
@media (max-width: 768px) {
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 40px;
    }
    
    .contact-hero, .privacy-hero, .terms-hero {
        height: 300px;
    }
    
    .contact-hero-content h1, .privacy-hero-content h1, .terms-hero-content h1 {
        font-size: 2.2rem;
    }
    
    .policy-wrapper {
        padding: 30px 20px;
    }
    
    .contact-form-wrapper {
        padding: 25px;
    }
}

/* =========================================
   Tokyo Landing Page Styles
   ========================================= */
.tokyo-hero {
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.tokyo-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.4);
}

.tokyo-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.tokyo-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-weight: 700;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.6);
}

.tokyo-hero-content p {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}

.tokyo-intro-section {
    padding-bottom: 80px;
}

.tokyo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.tokyo-grid.reverse .tokyo-text {
    order: 2;
}

.tokyo-grid.reverse .tokyo-image {
    order: 1;
}

.tokyo-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.tokyo-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.tokyo-gray-section {
    background-color: #f9f9f9;
    padding: 80px 0;
    margin-bottom: 80px;
}

.tokyo-content-block {
    max-width: 800px;
    margin: 0 auto;
}

.tokyo-feature-list {
    list-style: none;
    padding: 0;
    margin: 30px 0;
}

.tokyo-feature-list li {
    background: #fff;
    padding: 20px;
    margin-bottom: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.03);
    border-left: 5px solid #d4af37;
}

.tokyo-lifestyle-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
    margin-bottom: 80px;
}

.lifestyle-item {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
}

.lifestyle-item:hover {
    transform: translateY(-5px);
}

.lifestyle-item h3 {
    color: #d4af37;
    margin-bottom: 15px;
    font-size: 1.3rem;
}

.steps-container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 50px;
    margin-bottom: 80px;
}

.step-card {
    background: #fff;
    padding: 30px 20px;
    text-align: center;
    border: 1px solid #eee;
    border-radius: 10px;
}

.step-number {
    width: 50px;
    height: 50px;
    background: #d4af37;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: bold;
    margin: 0 auto 20px;
}

.club-table-wrapper {
    overflow-x: auto;
    background: #fff;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    padding: 20px;
}

.club-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
}

.club-table th, .club-table td {
    padding: 15px;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.club-table th {
    background-color: #333;
    color: #fff;
    font-weight: 600;
}

.club-table tr:last-child td {
    border-bottom: none;
}

.safety-list {
    list-style: none;
    padding: 0;
    max-width: 800px;
    margin: 40px auto 80px;
}

.safety-list li {
    position: relative;
    padding-left: 35px;
    margin-bottom: 20px;
    line-height: 1.6;
}

.safety-list li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: #28a745;
    font-weight: bold;
    font-size: 1.2rem;
}

.faq-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
    margin-top: 40px;
    margin-bottom: 80px;
}

.faq-item-box {
    background: #fff;
    padding: 30px;
    border: 1px solid #eee;
    border-radius: 8px;
}

.faq-item-box h4 {
    color: #d4af37;
    margin-bottom: 15px;
}

.myth-reality-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

.myth-box {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.myth-box h3 {
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.myth-box .cross {
    color: #dc3545;
    font-size: 1.5rem;
}

.approach-steps ol {
    max-width: 800px;
    margin: 40px auto 80px;
    counter-reset: approach-counter;
    list-style: none;
    padding: 0;
}

.approach-steps li {
    position: relative;
    padding-left: 50px;
    margin-bottom: 25px;
}

.approach-steps li::before {
    counter-increment: approach-counter;
    content: counter(approach-counter);
    position: absolute;
    left: 0;
    top: 0;
    width: 35px;
    height: 35px;
    background: #333;
    color: #fff;
    border-radius: 50%;
    text-align: center;
    line-height: 35px;
    font-weight: bold;
}

.tokyo-cta-final {
    background: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url('images/sugardaddiescom38-627x614.jpg'); /* Reusing hero image for consistency */
    background-size: cover;
    background-position: center;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.tokyo-cta-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #d4af37;
}

.tokyo-cta-content p {
    font-size: 1.2rem;
    margin-bottom: 40px;
}

/* Tokyo Mobile Responsiveness */
@media (max-width: 768px) {
    .tokyo-hero {
        height: 400px;
    }

    .tokyo-hero-content h1 {
        font-size: 2.2rem;
    }

    .tokyo-grid, .tokyo-lifestyle-grid, .faq-grid, .myth-reality-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .tokyo-grid.reverse .tokyo-text {
        order: 1; /* Reset order on mobile for natural flow */
    }
    
    .tokyo-grid.reverse .tokyo-image {
        order: 2;
    }

    .club-table th, .club-table td {
        padding: 10px;
        font-size: 0.9rem;
    }

    .tokyo-cta-content h2 {
        font-size: 1.8rem;
    }
}

/* =========================================
   Osaka Landing Page Styles
   ========================================= */
.osaka-hero {
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.osaka-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.osaka-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-weight: 700;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.6);
}

.osaka-hero-content p {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}

.osaka-intro-section {
    padding-bottom: 80px;
}

.osaka-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.osaka-grid.reverse .osaka-text {
    order: 2;
}

.osaka-grid.reverse .osaka-image {
    order: 1;
}

.osaka-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.osaka-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.osaka-gray-section {
    background-color: #f9f9f9;
    padding: 80px 0;
    margin-bottom: 80px;
}

.osaka-culture-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.culture-item {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
    text-align: center;
}

.culture-item h3 {
    color: #d4af37;
    margin-bottom: 15px;
    font-size: 1.3rem;
}

.profile-list-wrapper {
    background: #fdfdfd;
    padding: 40px;
    border: 1px solid #eee;
    border-radius: 10px;
    max-width: 800px;
    margin: 0 auto 60px;
}

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

.profile-list li {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #d4af37;
    line-height: 1.6;
}

.types-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.type-card {
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    border-top: 4px solid #333;
}

.type-card h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
}

.why-list {
    margin-top: 20px;
    padding-left: 20px;
    list-style-type: disc;
}

.why-list li {
    margin-bottom: 10px;
    color: #555;
}

.steps-tips-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    margin-top: 40px;
}

.steps-box, .tips-box {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.steps-box h3, .tips-box h3 {
    color: #d4af37;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    padding-bottom: 10px;
}

.steps-box ol, .tips-box ul {
    padding-left: 20px;
}

.steps-box li, .tips-box li {
    margin-bottom: 15px;
    line-height: 1.6;
}

.spots-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
    margin-bottom: 80px;
}

.spot-item {
    background: #f9f9f9;
    padding: 25px;
    border-radius: 8px;
    border-left: 5px solid #d4af37;
}

.spot-item h4 {
    margin-bottom: 10px;
    font-size: 1.1rem;
    color: #333;
}

.comparison-table-wrapper {
    overflow-x: auto;
    background: #fff;
    padding: 20px;
    border-radius: 10px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.05);
}

.comparison-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
}

.comparison-table th, .comparison-table td {
    padding: 15px;
    text-align: left;
    border-bottom: 1px solid #eee;
}

.comparison-table th {
    background-color: #333;
    color: #fff;
}

.app-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    margin-bottom: 80px;
    align-items: center;
}

.app-info, .verification-info {
    padding: 30px;
    background: #fdfdfd;
    border: 1px solid #eee;
    border-radius: 10px;
}

.app-info h2, .verification-info h2 {
    font-size: 1.5rem;
    margin-bottom: 20px;
    color: #d4af37;
}

.app-info ul, .verification-info ul {
    list-style-type: none;
    padding: 0;
    margin-bottom: 25px;
}

.app-info li, .verification-info li {
    margin-bottom: 10px;
    padding-left: 25px;
    position: relative;
}

.app-info li::before, .verification-info li::before {
    content: '★';
    color: #d4af37;
    position: absolute;
    left: 0;
}

.privacy-list {
    list-style: none;
    padding: 0;
    max-width: 800px;
    margin: 30px auto;
}

.privacy-list li {
    background: #fff;
    padding: 15px 20px;
    margin-bottom: 10px;
    border-radius: 5px;
    border-left: 4px solid #28a745;
}

.stories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
    margin-bottom: 80px;
}

.story-card {
    background: #fff;
    padding: 30px;
    border: 1px solid #eee;
    border-radius: 10px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.05);
}

.story-card h3 {
    font-size: 1.2rem;
    margin-bottom: 15px;
    color: #d4af37;
}

.story-card p {
    font-style: italic;
    color: #666;
}

.osaka-cta-final {
    background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('images/sugardaddiescom20-595x609.jpg');
    background-size: cover;
    background-position: center;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.osaka-cta-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #d4af37;
}

.osaka-cta-content p {
    font-size: 1.5rem;
    margin-bottom: 40px;
    font-weight: 300;
}

.btn-outline-white {
    background: transparent;
    border: 2px solid #fff;
    color: #fff;
    padding: 12px 30px;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: all 0.3s;
}

.btn-outline-white:hover {
    background: #fff;
    color: #333;
}

/* Osaka Mobile Responsiveness */
.osaka-text a,
.section-title a,
.tips-box a,
.osaka-app-section a:not(.btn) {
    color: #d4af37;
    text-decoration: underline;
}

.osaka-text a:hover,
.section-title a:hover,
.tips-box a:hover,
.osaka-app-section a:not(.btn):hover {
    color: #b8962e;
}

@media (max-width: 768px) {
    .osaka-hero {
        height: 400px;
    }
    
    .osaka-hero-content h1 {
        font-size: 2.2rem;
    }
    
    .osaka-grid, .osaka-culture-grid, .steps-tips-wrapper, .app-grid, .stories-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .osaka-grid.reverse .osaka-text {
        order: 1;
    }
    
    .osaka-grid.reverse .osaka-image {
        order: 2;
    }
    
    .comparison-table th, .comparison-table td {
        padding: 10px;
        font-size: 0.9rem;
    }
    
    .osaka-cta-content h2 {
        font-size: 1.8rem;
    }
}

/* =========================================
   Kyoto Landing Page Styles
   ========================================= */
.kyoto-hero {
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.kyoto-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.kyoto-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-weight: 700;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.6);
}

.kyoto-hero-content p {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}

.kyoto-intro-section, .kyoto-lifestyle-section, .kyoto-steps-section {
    padding-bottom: 80px;
}

.kyoto-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.kyoto-grid.reverse .kyoto-text {
    order: 2;
}

.kyoto-grid.reverse .kyoto-image {
    order: 1;
}

.kyoto-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.kyoto-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.kyoto-gray-section {
    background-color: #f9f9f9;
    padding: 80px 0;
    margin-bottom: 80px;
}

.kyoto-cta-final {
    background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('images/sugardaddybenefits-503x584.jpeg');
    background-size: cover;
    background-position: center;
    padding: 100px 20px;
    text-align: center;
    color: #fff;
}

.kyoto-cta-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #d4af37;
}

.kyoto-cta-content p {
    font-size: 1.5rem;
    margin-bottom: 40px;
    font-weight: 300;
}

/* Kyoto Links Color */
.kyoto-text a,
.kyoto-gray-section a,
.kyoto-intro-section a,
.verification-info a {
    color: #d4af37;
    text-decoration: underline;
}

.kyoto-text a:hover,
.kyoto-gray-section a:hover,
.kyoto-intro-section a:hover,
.verification-info a:hover {
    color: #b8962e;
}

/* Kyoto Mobile Responsiveness */
@media (max-width: 768px) {
    .kyoto-hero {
        height: 400px;
    }
    
    .kyoto-hero-content h1 {
        font-size: 2.2rem;
    }
    
    .kyoto-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .kyoto-grid.reverse .kyoto-text {
        order: 1;
    }
    
    .kyoto-grid.reverse .kyoto-image {
        order: 2;
    }
    
    .kyoto-cta-content h2 {
        font-size: 1.8rem;
    }
}

/* =========================================
   Yokohama Landing Page Styles
   ========================================= */
.yokohama-hero {
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.yokohama-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.yokohama-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-weight: 700;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.6);
}

.yokohama-hero-content p {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}

.yokohama-intro-section, .yokohama-clubs-section, .yokohama-tips-section, .yokohama-allowance-section, .yokohama-stories-section {
    padding-bottom: 80px;
}

.yokohama-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.yokohama-grid.reverse .yokohama-text {
    order: 2;
}

.yokohama-grid.reverse .yokohama-image {
    order: 1;
}

.yokohama-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.yokohama-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.yokohama-gray-section {
    background-color: #f9f9f9;
    padding: 80px 0;
    margin-bottom: 80px;
}

/* Clubs Grid */
.yokohama-clubs-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.club-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s ease;
    border-top: 3px solid #d4af37;
}

.club-card:hover {
    transform: translateY(-5px);
}

.club-card h3 {
    font-size: 1.5rem;
    margin-bottom: 15px;
    color: #333;
}

.club-info {
    color: #d4af37;
    font-weight: bold;
    margin-bottom: 10px;
}

.club-desc {
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
    margin-bottom: 15px;
}

.club-target {
    font-size: 0.9rem;
    color: #888;
    font-style: italic;
}

/* Tips Grid */
.yokohama-tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
    margin-bottom: 40px;
}

.tip-item {
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    text-align: center;
}

.tip-item h3 {
    color: #d4af37;
    margin-bottom: 15px;
    font-size: 1.2rem;
}

/* Comparison Table */
.yokohama-comparison-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 40px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.yokohama-comparison-table th, .yokohama-comparison-table td {
    padding: 20px;
    border: 1px solid #eee;
    text-align: left;
}

.yokohama-comparison-table th {
    background-color: #333;
    color: #fff;
    font-weight: 600;
    width: 50%;
}

/* Myths Grid */
.yokohama-myths-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.myth-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.myth-card h3 {
    font-size: 1.2rem;
    margin-bottom: 15px;
    color: #333;
    border-bottom: 2px solid #d4af37;
    padding-bottom: 10px;
    display: inline-block;
}

/* Stories Grid */
.yokohama-stories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.story-card {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.story-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.story-card h3 {
    padding: 20px 20px 10px;
    font-size: 1.3rem;
    color: #333;
}

.story-card p {
    padding: 0 20px 20px;
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
}

/* Steps Grid */
.yokohama-steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
    margin-top: 40px;
    text-align: center;
}

.step-item .step-number {
    width: 50px;
    height: 50px;
    background: #d4af37;
    color: #fff;
    border-radius: 50%;
    font-size: 1.5rem;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 20px;
}

/* CTA Section */
.yokohama-cta-section {
    padding: 100px 0;
    text-align: center;
    color: #fff;
    background-size: cover;
    background-position: center;
    position: relative;
}

.yokohama-cta-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.yokohama-cta-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    font-weight: 700;
}

.yokohama-cta-content p {
    font-size: 1.3rem;
    margin-bottom: 40px;
}

/* Media Queries (Yokohama) */
@media (max-width: 768px) {
    .yokohama-hero {
        height: 400px;
    }
    
    .yokohama-hero-content h1 {
        font-size: 2.2rem;
    }
    
    .yokohama-grid, .yokohama-clubs-grid, .yokohama-tips-grid, .yokohama-myths-grid, .yokohama-stories-grid, .yokohama-steps-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .yokohama-grid.reverse .yokohama-text {
        order: 1;
    }
    
    .yokohama-grid.reverse .yokohama-image {
        order: 2;
    }
    
    .yokohama-comparison-table th, .yokohama-comparison-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    
    .yokohama-comparison-table th {
        text-align: center;
    }

    .yokohama-cta-content h2 {
        font-size: 1.8rem;
    }
}

/* =========================================
   Nagoya Landing Page Styles
   ========================================= */
.nagoya-hero {
    height: 500px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    margin-bottom: 60px;
}

.nagoya-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.nagoya-hero-content h1 {
    font-size: 3.5rem;
    margin-bottom: 20px;
    font-weight: 700;
    text-shadow: 2px 2px 10px rgba(0,0,0,0.6);
}

.nagoya-hero-content p {
    font-size: 1.4rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 4px rgba(0,0,0,0.6);
}

.nagoya-intro-section, .nagoya-psychology-section, .nagoya-comparison-section, .nagoya-culture-section, .nagoya-cta-section {
    padding-bottom: 80px;
}

.nagoya-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.nagoya-grid.reverse .nagoya-text {
    order: 2;
}

.nagoya-grid.reverse .nagoya-image {
    order: 1;
}

.nagoya-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.nagoya-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.nagoya-gray-section {
    background-color: #f9f9f9;
    padding: 80px 0;
    margin-bottom: 80px;
}

/* Features Grid (Psychology) */
.nagoya-features-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.feature-card { /* Scoped within nagoya page context via HTML structure if needed, but unique enough for now or I'll rename in HTML if conflict arises. Wait, I used class="feature-card" in HTML. Let's make it specific here or assume no conflict if not used elsewhere. Better to be safe: .nagoya-features-grid .feature-card */
}

.nagoya-features-grid .feature-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border-left: 5px solid #d4af37;
}

.nagoya-features-grid .feature-card h3 {
    font-size: 1.4rem;
    margin-bottom: 15px;
    color: #333;
}

/* Activities Grid */
.nagoya-activities-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.activity-item { /* Again, scope it */
}

.nagoya-activities-grid .activity-item {
    background: #fff;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.nagoya-activities-grid .activity-item:hover {
    transform: translateY(-5px);
}

.nagoya-activities-grid .activity-item img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.nagoya-activities-grid .activity-item h3 {
    padding: 20px 20px 10px;
    font-size: 1.3rem;
    color: #333;
}

.nagoya-activities-grid .activity-item p {
    padding: 0 20px 20px;
    font-size: 0.95rem;
    color: #666;
    line-height: 1.6;
}

/* Comparison Table */
.nagoya-comparison-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 40px;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.nagoya-comparison-table th, .nagoya-comparison-table td {
    padding: 20px;
    border: 1px solid #eee;
    text-align: left;
}

.nagoya-comparison-table th {
    background-color: #333;
    color: #fff;
    font-weight: 600;
}

/* Tips Grid */
.nagoya-tips-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.tip-card { /* Scope it */
}

.nagoya-tips-grid .tip-card {
    background: #fff;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border-top: 3px solid #d4af37;
}

.nagoya-tips-grid .tip-card h3 {
    font-size: 1.3rem;
    margin-bottom: 15px;
    color: #d4af37;
}

/* FAQ List */
.nagoya-faq-list {
    max-width: 800px;
    margin: 40px auto 0;
}

.faq-item { /* Scope it */
}

.nagoya-faq-list .faq-item {
    background: #fff;
    padding: 25px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
}

.nagoya-faq-list .faq-item h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
    cursor: pointer; /* imply interactive if JS added later, but fine as static */
}

/* CTA Section */
.nagoya-cta-section {
    padding: 100px 0;
    text-align: center;
    color: #fff;
    background-size: cover;
    background-position: center;
    position: relative;
}

.nagoya-cta-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 20px;
}

.nagoya-cta-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    font-weight: 700;
}

.nagoya-cta-content p {
    font-size: 1.3rem;
    margin-bottom: 40px;
}

/* Media Queries (Nagoya) */
@media (max-width: 768px) {
    .nagoya-hero {
        height: 400px;
    }
    
    .nagoya-hero-content h1 {
        font-size: 2.2rem;
    }
    
    .nagoya-grid, .nagoya-features-grid, .nagoya-activities-grid, .nagoya-tips-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .nagoya-grid.reverse .nagoya-text {
        order: 1;
    }
    
    .nagoya-grid.reverse .nagoya-image {
        order: 2;
    }
    
    .nagoya-comparison-table th, .nagoya-comparison-table td {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
    
    .nagoya-comparison-table th {
        text-align: center;
    }

    .nagoya-cta-content h2 {
        font-size: 1.8rem;
    }
}

/* Fukuoka Page Styles */
.fukuoka-hero {
    height: 60vh;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
    position: relative;
}

.fukuoka-hero::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.4);
    z-index: 1;
}

.fukuoka-hero-content {
    position: relative;
    z-index: 2;
    padding: 0 20px;
    max-width: 900px;
}

.fukuoka-hero-content h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
    font-weight: 700;
}

.fukuoka-hero-content p {
    font-size: 1.5rem;
    margin-bottom: 30px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.fukuoka-intro-section {
    padding: 80px 20px;
}

.fukuoka-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 50px;
    align-items: center;
    margin-top: 40px;
}

.fukuoka-grid.reverse .fukuoka-text {
    order: 2;
}

.fukuoka-text h2, .fukuoka-text h3 {
    margin-bottom: 20px;
    color: #333;
}

.fukuoka-text p {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.fukuoka-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.fukuoka-gray-section {
    background-color: #f9f9f9;
    padding: 80px 20px;
}

.fukuoka-features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.fukuoka-features-grid .feature-card {
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    text-align: center;
    transition: transform 0.3s ease;
}

.fukuoka-features-grid .feature-card:hover {
    transform: translateY(-5px);
}

.fukuoka-features-grid .feature-card h3 {
    color: #d4af37;
    margin-bottom: 15px;
}

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

.why-list li {
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
    line-height: 1.6;
}

.why-list li::before {
    content: "✔";
    color: #e91e63;
    position: absolute;
    left: 0;
    top: 0;
}

.fukuoka-text-block {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    font-size: 1.1rem;
    line-height: 1.8;
}

.fukuoka-tips-section {
    padding: 80px 20px;
}

.expectations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.expectation-item {
    background: white;
    padding: 25px;
    border-radius: 8px;
    border-left: 4px solid #e91e63;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.expectation-item h3 {
    margin-bottom: 10px;
    color: #333;
}

.fukuoka-network-section {
    padding: 80px 20px;
    text-align: center;
}

.network-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 30px;
    margin-top: 50px;
}

.step-icon {
    font-size: 3rem;
    margin-bottom: 20px;
}

.spots-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.spot-card {
    background: white;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.spot-card h3 {
    color: #e91e63;
    margin-bottom: 15px;
}

.psychology-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.psych-item {
    background: white;
    padding: 25px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.fukuoka-luxury-section {
    padding: 80px 20px;
}

.luxury-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.luxury-item {
    background: #fff0f5;
    padding: 30px;
    border-radius: 10px;
    text-align: center;
}

.luxury-item h3 {
    color: #c2195b;
    margin-bottom: 15px;
}

.profile-tips-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
    margin-top: 40px;
}

.tip {
    background: white;
    padding: 25px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.tip h3 {
    border-bottom: 2px solid #e91e63;
    padding-bottom: 10px;
    margin-bottom: 15px;
    display: inline-block;
}

.fukuoka-join-section {
    padding: 100px 20px;
    background-size: cover;
    background-position: center;
    color: white;
    text-align: center;
    position: relative;
}

.fukuoka-join-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(233, 30, 99, 0.9);
    z-index: 1;
}

.join-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
}

.join-content h2 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #fff;
}

.discretion-note {
    font-size: 0.9rem;
    margin-top: 20px;
    opacity: 0.8;
}

.fukuoka-faq-section {
    padding: 80px 20px;
}

.fukuoka-faq-list {
    max-width: 800px;
    margin: 40px auto 0;
}

.fukuoka-faq-list .faq-item {
    background: #fff;
    padding: 25px;
    margin-bottom: 20px;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
}

.fukuoka-faq-list .faq-item h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
}

/* Mobile Responsiveness for Fukuoka */
@media (max-width: 768px) {
    .fukuoka-hero-content h1 {
        font-size: 2rem;
    }
    
    .fukuoka-grid {
        grid-template-columns: 1fr;
    }
    
    .fukuoka-grid.reverse .fukuoka-text {
        order: 1;
    }
    
    .psychology-grid {
        grid-template-columns: 1fr;
    }
    
    .fukuoka-join-section {
        padding: 60px 20px;
    }
    
    .join-content h2 {
        font-size: 1.8rem;
    }
}

/* Find Sugar Daddy Tokyo Blog Styles */
.find-tokyo-breadcrumbs {
    padding: 20px 0;
    font-size: 0.9rem;
    color: #666;
}

.find-tokyo-breadcrumbs a {
    color: #e91e63;
    text-decoration: none;
}

.find-tokyo-breadcrumbs a:hover {
    text-decoration: underline;
}

.find-tokyo-article {
    padding: 40px 20px;
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
    border-radius: 10px;
}

.find-tokyo-article h1 {
    font-size: 2.2rem;
    color: #333;
    margin-bottom: 30px;
    text-align: center;
    line-height: 1.4;
}

.find-tokyo-section {
    margin-bottom: 60px;
}

.find-tokyo-section h2 {
    font-size: 1.8rem;
    color: #d4af37;
    border-bottom: 2px solid #f4f4f4;
    padding-bottom: 15px;
    margin-bottom: 25px;
    margin-top: 30px;
}

.find-tokyo-section h3 {
    font-size: 1.4rem;
    color: #444;
    margin-bottom: 15px;
    margin-top: 30px;
}

.find-tokyo-section p {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.find-tokyo-hero-img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.find-tokyo-list {
    list-style: none;
    padding: 0;
}

.find-tokyo-list li {
    margin-bottom: 15px;
    padding-left: 20px;
    border-left: 3px solid #e91e63;
}

.find-tokyo-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    margin-top: 30px;
}

.find-tokyo-grid.reverse {
    direction: rtl;
}

.find-tokyo-grid.reverse .find-tokyo-text {
    direction: ltr;
}

.find-tokyo-img-container img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.find-tokyo-comparison {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.find-tokyo-comparison-item {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border-top: 3px solid #d4af37;
}

.find-tokyo-comparison-item h3 {
    color: #333;
    margin-top: 0;
    font-size: 1.2rem;
}

.final-thought {
    text-align: center;
    background: #fafafa;
    padding: 40px;
    border-radius: 10px;
}

.cta-container {
    margin-top: 30px;
}

/* Mobile Responsiveness for Blog */
@media (max-width: 768px) {
    .find-tokyo-article h1 {
        font-size: 1.8rem;
    }

    .find-tokyo-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .find-tokyo-comparison {
        grid-template-columns: 1fr;
    }
}

.find-tokyo-faq {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #eee;
}

.find-tokyo-faq .faq-item {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #f4f4f4;
}

.find-tokyo-faq .faq-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.find-tokyo-faq h3 {
    color: #e91e63;
    font-size: 1.1rem;
    margin-bottom: 10px;
    margin-top: 0;
}

.find-tokyo-faq p {
    margin-bottom: 0;
    font-size: 1rem;
    color: #555;
}

/* Age Gap Dating Japan Blog Styles */
.age-gap-breadcrumbs {
    padding: 20px 0;
    font-size: 0.9rem;
    color: #666;
}

.age-gap-breadcrumbs a {
    color: #e91e63;
    text-decoration: none;
}

.age-gap-breadcrumbs a:hover {
    text-decoration: underline;
}

.age-gap-article {
    padding: 40px 20px;
    max-width: 900px;
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
    border-radius: 10px;
}

.age-gap-article h1 {
    font-size: 2.2rem;
    color: #333;
    margin-bottom: 30px;
    text-align: center;
    line-height: 1.4;
}

.age-gap-section {
    margin-bottom: 60px;
}

.age-gap-section h2 {
    font-size: 1.8rem;
    color: #d4af37;
    border-bottom: 2px solid #f4f4f4;
    padding-bottom: 15px;
    margin-bottom: 25px;
    margin-top: 30px;
}

.age-gap-section h3 {
    font-size: 1.4rem;
    color: #444;
    margin-bottom: 15px;
    margin-top: 30px;
}

.age-gap-section p {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.age-gap-hero-img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.age-gap-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    margin-top: 30px;
}

.age-gap-grid.reverse {
    direction: rtl;
}

.age-gap-grid.reverse .age-gap-text {
    direction: ltr;
}

.age-gap-img-container img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(0,0,0,0.1);
}

.age-gap-alert {
    background: #fff3e0;
    border-left: 5px solid #ff9800;
    padding: 20px;
    border-radius: 4px;
}

.age-gap-alert h3 {
    color: #e65100;
    margin-top: 0;
}

.age-gap-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

.age-gap-feature-card {
    background: #f9f9f9;
    padding: 20px;
    border-radius: 8px;
    border-top: 3px solid #e91e63;
}

.age-gap-misconceptions {
    list-style: none;
    padding: 0;
}

.age-gap-misconceptions li {
    background: #f4f4f4;
    padding: 20px;
    margin-bottom: 15px;
    border-radius: 8px;
}

.age-gap-warning-list {
    list-style: none;
    padding: 0;
}

.age-gap-warning-list li {
    padding-left: 30px;
    position: relative;
    margin-bottom: 10px;
    color: #d32f2f;
}

.age-gap-warning-list li::before {
    content: "⚠️";
    position: absolute;
    left: 0;
}

.age-gap-faq {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    border: 1px solid #eee;
}

.age-gap-faq .faq-item {
    margin-bottom: 25px;
    padding-bottom: 25px;
    border-bottom: 1px solid #f4f4f4;
}

.age-gap-faq .faq-item:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.age-gap-faq h3 {
    color: #e91e63;
    font-size: 1.1rem;
    margin-bottom: 10px;
    margin-top: 0;
}

.age-gap-faq p {
    margin-bottom: 0;
    font-size: 1rem;
    color: #555;
}

/* Mobile Responsiveness for Age Gap Blog */
@media (max-width: 768px) {
    .age-gap-article h1 {
        font-size: 1.8rem;
    }

    .age-gap-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    
    .age-gap-features {
        grid-template-columns: 1fr;
    }
}

/* Office Lady Experience Blog Styles */
.ol-exp-breadcrumbs {
    padding: 20px 0;
    font-size: 0.9rem;
    color: #666;
}

.ol-exp-breadcrumbs a {
    color: #e91e63;
    text-decoration: none;
}

.ol-exp-breadcrumbs a:hover {
    text-decoration: underline;
}

.ol-exp-article {
    padding: 50px 30px;
    max-width: 800px; /* Slightly narrower for reading experience */
    margin: 0 auto;
    background: #fff;
    box-shadow: 0 10px 30px rgba(0,0,0,0.08);
    border-radius: 12px;
    font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
}

.ol-exp-article h1 {
    font-size: 2.0rem;
    color: #333;
    margin-bottom: 40px;
    text-align: center;
    line-height: 1.5;
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}

.ol-exp-section {
    margin-bottom: 50px;
}

.ol-exp-section h2 {
    font-size: 1.6rem;
    color: #2c3e50;
    border-left: 5px solid #e91e63;
    padding-left: 15px;
    margin-bottom: 20px;
    margin-top: 40px;
}

.ol-exp-section h3 {
    font-size: 1.3rem;
    color: #444;
    margin-bottom: 15px;
}

.ol-exp-section p {
    font-size: 1.05rem;
    line-height: 1.9;
    color: #555;
    margin-bottom: 25px;
}

.ol-exp-hero-img {
    width: 100%;
    height: auto;
    border-radius: 8px;
    margin-bottom: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

.ol-exp-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
    margin-top: 30px;
}

.ol-exp-grid.reverse {
    direction: rtl;
}

.ol-exp-grid.reverse .ol-exp-text {
    direction: ltr;
}

.ol-exp-img-container img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.ol-exp-img-container img:hover {
    transform: scale(1.02);
}

.ol-exp-features {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
    margin-top: 30px;
}

.ol-exp-feature-card {
    background: #fff;
    padding: 25px;
    border-radius: 8px;
    border: 1px solid #eee;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
    text-align: center;
}

.ol-exp-feature-card h3 {
    color: #e91e63;
    margin-top: 0;
    font-size: 1.2rem;
}

.ol-exp-feature-card p {
    font-size: 0.95rem;
    margin-bottom: 0;
}

.ol-exp-lessons {
    list-style: none;
    padding: 0;
    background: #f9f9f9;
    padding: 30px;
    border-radius: 10px;
}

.ol-exp-lessons li {
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
    font-weight: bold;
    color: #333;
}

.ol-exp-lessons li::before {
    content: "✔";
    color: #e91e63;
    position: absolute;
    left: 0;
    top: 2px;
}

.ol-exp-lessons li span {
    font-weight: normal;
    color: #666;
    display: block;
    margin-top: 5px;
    font-size: 0.95rem;
}

.cta-container {
    text-align: center;
    margin-top: 50px;
}

/* Mobile Responsiveness for Office Lady Experience Blog */
@media (max-width: 768px) {
    .ol-exp-article {
        padding: 30px 20px;
    }

    .ol-exp-article h1 {
        font-size: 1.6rem;
    }

    .ol-exp-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
    
    .ol-exp-features {
        grid-template-columns: 1fr;
    }

    .ol-exp-section h2 {
        font-size: 1.4rem;
    }
}

/* Enjoy Sugar Dating Blog Styles - Scoped with .enjoy- prefix */
.enjoy-breadcrumbs {
    background: #f8f9fa;
    padding: 15px 0;
    margin-bottom: 30px;
    border-bottom: 1px solid #e9ecef;
}

.enjoy-breadcrumbs a {
    color: #6c757d;
    text-decoration: none;
    font-size: 0.9rem;
}

.enjoy-breadcrumbs a:hover {
    color: #e91e63;
    text-decoration: underline;
}

.enjoy-breadcrumbs span {
    color: #343a40;
    font-weight: 600;
    font-size: 0.9rem;
}

.enjoy-article {
    max-width: 900px;
    margin: 0 auto;
    padding: 40px 20px;
    background: #fff;
    box-shadow: 0 5px 25px rgba(0,0,0,0.05);
    border-radius: 10px;
}

.enjoy-article h1 {
    font-size: 2.2rem;
    color: #333;
    margin-bottom: 20px;
    line-height: 1.3;
    text-align: center;
}

.enjoy-intro {
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
    margin-bottom: 40px;
    text-align: center;
}

.enjoy-toc {
    background: #fdf2f6;
    padding: 30px;
    border-radius: 10px;
    margin-bottom: 50px;
    border-left: 5px solid #e91e63;
}

.enjoy-toc h3 {
    font-size: 1.2rem;
    color: #e91e63;
    margin-bottom: 15px;
    margin-top: 0;
}

.enjoy-toc ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.enjoy-toc li a {
    color: #444;
    text-decoration: none;
    font-size: 0.95rem;
    display: block;
    padding: 5px 0;
    transition: color 0.3s;
}

.enjoy-toc li a:hover {
    color: #e91e63;
    transform: translateX(5px);
}

.enjoy-section {
    margin-bottom: 60px;
}

.enjoy-section h2 {
    font-size: 1.8rem;
    color: #2c3e50;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
    position: relative;
}

.enjoy-section h2::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: #e91e63;
}

.enjoy-section p {
    font-size: 1.05rem;
    line-height: 1.8;
    color: #444;
    margin-bottom: 20px;
}

.enjoy-grid-2 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
    margin: 30px 0;
}

.enjoy-card {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.3s, box-shadow 0.3s;
}

.enjoy-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.08);
}

.enjoy-card img {
    width: 100%;
    height: 220px;
    object-fit: cover;
}

.enjoy-card-content {
    padding: 20px;
}

.enjoy-card h3 {
    font-size: 1.2rem;
    color: #333;
    margin-top: 0;
    margin-bottom: 10px;
}

.enjoy-list-check {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.enjoy-list-check li {
    position: relative;
    padding-left: 30px;
    margin-bottom: 12px;
    line-height: 1.6;
    color: #555;
}

.enjoy-list-check li::before {
    content: '✓';
    position: absolute;
    left: 0;
    top: 0;
    color: #4caf50;
    font-weight: bold;
}

.enjoy-highlight-box {
    background: #e3f2fd;
    padding: 25px;
    border-radius: 8px;
    margin: 30px 0;
    border-left: 4px solid #2196f3;
}

.enjoy-highlight-box h3 {
    color: #1976d2;
    margin-top: 0;
    font-size: 1.2rem;
}

.enjoy-table-wrapper {
    overflow-x: auto;
    margin: 30px 0;
}

.enjoy-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 600px;
}

.enjoy-table th, .enjoy-table td {
    padding: 15px;
    border-bottom: 1px solid #eee;
    text-align: left;
}

.enjoy-table th {
    background: #f8f9fa;
    color: #333;
    font-weight: 600;
}

.enjoy-table tr:hover {
    background: #fdfdfd;
}

.enjoy-cta {
    background: linear-gradient(135deg, #e91e63 0%, #ff4081 100%);
    padding: 40px;
    border-radius: 15px;
    text-align: center;
    color: white;
    margin-top: 60px;
}

.enjoy-cta h2 {
    color: white;
    margin-top: 0;
    border: none;
}

.enjoy-cta h2::after {
    display: none;
}

.enjoy-cta p {
    color: rgba(255,255,255,0.9);
    font-size: 1.1rem;
    margin-bottom: 30px;
}

.enjoy-btn {
    display: inline-block;
    background: white;
    color: #e91e63;
    padding: 15px 40px;
    border-radius: 30px;
    font-weight: bold;
    text-decoration: none;
    transition: transform 0.3s, box-shadow 0.3s;
    font-size: 1.1rem;
}

.enjoy-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0,0,0,0.2);
    color: #c2185b;
}

/* Mobile Responsiveness for Enjoy Blog */
@media (max-width: 768px) {
    .enjoy-article {
        padding: 30px 15px;
    }

    .enjoy-article h1 {
        font-size: 1.8rem;
    }

    .enjoy-toc ul {
        grid-template-columns: 1fr;
    }

    .enjoy-grid-2 {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .enjoy-section h2 {
        font-size: 1.5rem;
    }
    
    .enjoy-cta {
        padding: 30px 20px;
    }
}

/* Additional Enjoy Sugar Dating Styles */
.enjoy-hero {
    height: 60vh;
    min-height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: white;
}

.enjoy-hero-content {
    max-width: 800px;
    padding: 30px;
    z-index: 2;
    background: rgba(0,0,0,0.4);
    border-radius: 10px;
}

.enjoy-hero-content h1 {
    font-size: 3rem;
    margin-bottom: 20px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
    color: white;
}

.enjoy-hero-content p {
    font-size: 1.5rem;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
    color: white;
}

.enjoy-bg-light {
    background-color: #f9f9f9;
}

.enjoy-bg-dark {
    background-color: #333;
    color: white;
    padding: 60px 0;
}

.enjoy-text-white, .enjoy-text-white h2, .enjoy-text-white p, .enjoy-text-white .enjoy-section-title h2, .enjoy-text-white .enjoy-section-title p {
    color: white !important;
    border-bottom-color: rgba(255,255,255,0.3);
}

.enjoy-section-title {
    text-align: center;
    margin-bottom: 50px;
}

.enjoy-section-title h2 {
    font-size: 2.5rem;
    margin-bottom: 15px;
    display: inline-block;
    border-bottom: 3px solid #e91e63;
    padding-bottom: 10px;
}

.enjoy-section-title p {
    font-size: 1.2rem;
    opacity: 0.8;
}

.enjoy-content-block {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 80px;
}

.enjoy-content-block.enjoy-reverse {
    flex-direction: row-reverse;
}

.enjoy-text {
    flex: 1;
}

.enjoy-image {
    flex: 1;
}

.enjoy-image img {
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}

.enjoy-list {
    list-style: none;
    padding: 0;
    margin-top: 20px;
}

.enjoy-list li {
    margin-bottom: 15px;
    padding-left: 25px;
    position: relative;
    font-size: 1.05rem;
}

.enjoy-list li::before {
    content: "•";
    color: #e91e63;
    position: absolute;
    left: 0;
    font-weight: bold;
    font-size: 1.5rem;
    line-height: 1;
}

.enjoy-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
    margin-top: 40px;
}

.enjoy-card-simple {
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    text-align: center;
    transition: transform 0.3s;
}

.enjoy-card-simple:hover {
    transform: translateY(-5px);
}

.enjoy-card-simple img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 5px;
    margin-bottom: 20px;
}

.enjoy-card-simple h3 {
    font-size: 1.2rem;
    margin-bottom: 10px;
    color: #333;
}

.enjoy-steps {
    display: flex;
    justify-content: space-between;
    gap: 30px;
    margin-top: 40px;
}

.enjoy-step-item {
    flex: 1;
    background: rgba(255,255,255,0.05);
    padding: 30px;
    border-radius: 10px;
    border: 1px solid rgba(255,255,255,0.1);
}

.enjoy-step-num {
    font-size: 3rem;
    font-weight: bold;
    color: #e91e63;
    margin-bottom: 15px;
    opacity: 0.8;
}

.enjoy-step-item h3 {
    color: white;
    margin-bottom: 15px;
    font-size: 1.3rem;
}

.enjoy-step-item p {
    color: rgba(255,255,255,0.8);
    font-size: 1rem;
}

.enjoy-legal-box {
    border: 2px solid rgba(255,255,255,0.2);
    padding: 40px;
    border-radius: 10px;
    background: rgba(0,0,0,0.2);
    margin-top: 30px;
}

.enjoy-link {
    color: #e91e63;
    text-decoration: none;
    font-weight: bold;
}

.enjoy-link:hover {
    text-decoration: underline;
}

.enjoy-text-box {
    background: white;
    padding: 30px;
    border-radius: 10px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.enjoy-text-box h3 {
    color: #e91e63;
    margin-top: 0;
    margin-bottom: 15px;
}

/* Mobile Responsive Adjustments */
@media (max-width: 768px) {
    .enjoy-hero {
        height: 50vh;
    }
    .enjoy-hero-content h1 {
        font-size: 2rem;
    }
    .enjoy-hero-content p {
        font-size: 1.1rem;
    }
    .enjoy-content-block, .enjoy-content-block.enjoy-reverse {
        flex-direction: column;
        gap: 30px;
    }
    .enjoy-grid-3 {
        grid-template-columns: 1fr;
    }
    .enjoy-steps {
        flex-direction: column;
    }
    .enjoy-section-title h2 {
        font-size: 2rem;
    }
}

/* Scoped Styles for beauty-fashion-for-sugar-babies.html */
.beauty-breadcrumbs {
    padding: 20px 0;
    font-size: 0.9rem;
    color: #666;
    background-color: #f9f9f9;
}
.beauty-breadcrumbs a {
    color: #e91e63;
    text-decoration: none;
}
.beauty-hero {
    height: 50vh;
    min-height: 400px;
    background-size: cover;
    background-position: center;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
    margin-bottom: 0;
}
.beauty-hero-content {
    z-index: 1;
    padding: 20px;
    max-width: 900px;
}
.beauty-hero h1 {
    font-size: 2.8rem;
    margin-bottom: 20px;
    text-shadow: 0 2px 5px rgba(0,0,0,0.5);
    line-height: 1.3;
}
.beauty-hero p {
    font-size: 1.3rem;
    text-shadow: 0 1px 3px rgba(0,0,0,0.5);
}
.beauty-section {
    padding: 60px 0;
}
.beauty-section-header {
    text-align: center;
    margin-bottom: 50px;
}
.beauty-section-header h2 {
    font-size: 2.2rem;
    color: #333;
    display: inline-block;
    border-bottom: 3px solid #d4af37; /* Gold accent */
    padding-bottom: 10px;
}
.beauty-content-block {
    display: flex;
    align-items: center;
    gap: 50px;
    margin-bottom: 40px;
}
.beauty-content-block.beauty-reverse {
    flex-direction: row-reverse;
}
.beauty-text {
    flex: 1;
    font-size: 1.1rem;
    line-height: 1.8;
    color: #555;
}
.beauty-image {
    flex: 1;
}
.beauty-image img {
    width: 100%;
    border-radius: 8px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.beauty-bg-light {
    background-color: #f9f9f9;
}
.beauty-bg-cream {
    background-color: #fffaf0; /* Light cream for elegance */
}
.beauty-grid-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
}
.beauty-card {
    background: #fff;
    padding: 40px;
    border-radius: 8px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    border-top: 3px solid #e91e63;
}
.beauty-card h3 {
    color: #333;
    margin-bottom: 20px;
    font-size: 1.4rem;
}
.beauty-card p {
    color: #666;
    line-height: 1.7;
}
.beauty-wardrobe-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.beauty-wardrobe-item {
    text-align: center;
}
.beauty-wardrobe-item img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 20px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.beauty-wardrobe-item h4 {
    font-size: 1.2rem;
    color: #333;
    margin-bottom: 10px;
}
.beauty-list {
    list-style: none;
    padding: 0;
}
.beauty-list li {
    margin-bottom: 15px;
    padding-left: 20px;
    position: relative;
}
.beauty-list li::before {
    content: "•";
    color: #d4af37;
    font-weight: bold;
    position: absolute;
    left: 0;
}
.beauty-intro-text {
    max-width: 800px;
    margin: 0 auto;
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.8;
    color: #555;
    font-style: italic;
    border-left: 4px solid #d4af37;
    padding-left: 20px;
}
.beauty-grid-3 {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 30px;
}
.beauty-tip-box {
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
}
.beauty-tip-box h4 {
    color: #e91e63;
    margin-bottom: 15px;
    font-size: 1.2rem;
}
.beauty-card-image {
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.beauty-card-image img {
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.beauty-card-content {
    padding: 30px;
}
.beauty-bg-dark {
    background-color: #222;
    color: #fff;
}
.beauty-text-white, .beauty-text-white h2 {
    color: #fff !important;
}
.beauty-accessories-list {
    display: flex;
    justify-content: space-around;
    gap: 30px;
    flex-wrap: wrap;
}
.beauty-acc-item {
    flex: 1;
    min-width: 250px;
    text-align: center;
    background: rgba(255,255,255,0.05);
    padding: 30px;
    border-radius: 10px;
}
.beauty-icon {
    font-size: 3rem;
    display: block;
    margin-bottom: 20px;
}
.beauty-table {
    width: 100%;
    border-collapse: collapse;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}
.beauty-table th, .beauty-table td {
    padding: 20px;
    border: 1px solid #eee;
    text-align: left;
}
.beauty-table th {
    background-color: #f4f4f4;
    color: #333;
    font-weight: bold;
}
.beauty-link {
    color: #e91e63;
    text-decoration: underline;
}
.beauty-info-box {
    background: #e3f2fd;
    padding: 30px;
    border-radius: 8px;
    border-left: 5px solid #2196f3;
}
.beauty-alert-box {
    background: #ffebee;
    padding: 30px;
    border-radius: 8px;
    border-left: 5px solid #f44336;
}
.beauty-alert-box ul {
    list-style: none;
    padding: 0;
}
.beauty-alert-box li {
    margin-bottom: 10px;
    color: #d32f2f;
}
.beauty-footer-hero {
    height: 60vh;
}
.beauty-footer-hero .beauty-hero-content {
    background: rgba(0,0,0,0.5);
    padding: 40px;
    border-radius: 10px;
}

/* Fix for Enjoy Sugar Dating Page Text Color */
.enjoy-text-dark-mode .enjoy-section-title h2 {
    color: #333;
}
.enjoy-step-item.light-theme {
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}
.enjoy-step-item.light-theme h3 {
    color: #333;
}
.enjoy-step-item.light-theme p {
    color: #333;
}
.enjoy-step-item.light-theme .enjoy-step-num {
    color: #e91e63;
}

/* Mobile Responsive for Beauty Page */
@media (max-width: 768px) {
    .beauty-hero h1 {
        font-size: 2rem;
    }
    .beauty-content-block, .beauty-content-block.beauty-reverse {
        flex-direction: column;
    }
    .beauty-grid-2, .beauty-grid-3, .beauty-wardrobe-grid {
        grid-template-columns: 1fr;
    }
    .beauty-accessories-list {
        flex-direction: column;
    }
    .beauty-table {
        display: block;
        overflow-x: auto;
    }
    .beauty-section {
        padding: 40px 0;
    }
}