/* LocalCamGirl: warm paper, ink typography and a restrained coral signature.
   Presentation only. Shared by every page, including the guide and legal pages. */
:root {
    color-scheme: light;
    --bg-dark: #f5f3ef;
    --bg-card: #fffefa;
    --bg-hover: #ebe7e1;
    --text-main: #20211f;
    --text-light: #20211f;
    --text-muted: #62645e;
    --primary: #b83948;
    --primary-hover: #962b38;
    --primary-color: #b83948;
    --secondary: #30352f;
    --live-green: #23744b;
    --offline-gray: #62645e;
    --border-color: #dcd8d0;
    --border: #dcd8d0;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 12px;
    --shadow-soft: 0 8px 26px rgba(37, 30, 20, .08);
    --shadow-glow: none;
    --transition: color .18s ease, background-color .18s ease, border-color .18s ease;
    --font-base: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
}
body { background: var(--bg-dark); }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
    outline: 2px solid var(--primary); outline-offset: 4px;
}
img { max-width: 100%; }
h1, h2, h3, h4 { color: var(--text-main); line-height: 1.15; }
h1 { font-size: clamp(2rem, 4vw, 3.5rem); letter-spacing: -.045em; font-weight: 800; }
h2 { letter-spacing: -.03em; }
.container { max-width: 1360px; padding-inline: 36px; }
.page-spacing { padding-top: 36px; padding-bottom: 48px; }
.section-spacing { padding-block: 56px; }
.gradient-text { background: none; -webkit-text-fill-color: currentColor; color: var(--primary); }
.text-white { color: var(--text-main); }
.text-yellow { color: #83600a !important; }
.main-header { background: rgba(255, 254, 250, .97); backdrop-filter: none; padding: 15px 0; }
.nav-wrapper { gap: 28px; }
.logo { gap: 9px; font-size: 1.4rem; letter-spacing: -.06em; }
.logo-icon { background: var(--text-main); border-radius: 7px; width: 33px; height: 29px; position: relative; }
.logo-icon::after { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #f17d88; position: absolute; right: -3px; top: -3px; border: 2px solid var(--bg-card); }
.logo-icon svg { width: 19px; }
.nav-content { gap: 20px; }
.main-nav { gap: 4px; }
.nav-link, .dropbtn { color: #43463f; padding: 9px 10px; font-size: .85rem; }
.nav-link > svg { width: 16px; height: 16px; }
.search-form { width: 220px; border-radius: 6px; background: #f3f0eb; }
.search-form input { color: var(--text-main); min-width: 0; }
.search-form:focus-within { border-color: var(--primary); }
.search-form input::placeholder { color: #707269; }
.dropdown-content { max-height: min(70vh, 640px); overflow-y: auto; padding: 16px; }
.dropdown-content a { color: #43463f; }
.hero { padding: 54px 0 32px; background: none; text-align: left; }
.hero-content.text-center { text-align: left; }
.hero h1 { max-width: 880px; font-size: clamp(2.5rem, 5vw, 4.6rem); letter-spacing: -.055em; line-height: 1.02; margin-bottom: 20px; }
.hero p { max-width: 720px; font-size: 1.04rem; line-height: 1.7; margin: 0 0 24px; }
.hero-stats { justify-content: flex-start; gap: 0; margin-top: 24px; }
.stat-item { padding: 0 34px; border-right: 1px solid var(--border-color); }
.stat-item:first-child { padding-left: 0; }
.stat-item:last-child { border: 0; }
.stat-value { color: var(--text-main); font-size: 1.65rem; letter-spacing: -.04em; }
.stat-label { font-size: .68rem; font-weight: 600; letter-spacing: .08em; }
.section-header { margin-bottom: 24px; gap: 24px; }
.header-content { min-width: 0; }
.header-content h1 { margin-bottom: 14px; }
.header-content h2 { font-size: 1.8rem; gap: 10px; }
.header-content h2 svg { width: 21px; color: var(--primary); }
.section-desc { font-size: .98rem; line-height: 1.7; max-width: 850px; }
.model-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 20px; }
.model-card { min-width: 0; background: none; border: 0; border-radius: 0; overflow: visible; }
.model-card:hover { transform: none; box-shadow: none; border-color: transparent; }
.card-link { display: block; border-radius: 8px; overflow: hidden; }
.card-image-wrapper { aspect-ratio: 4 / 3; background: #e3dfd8; border-radius: 8px; }
.card-image-wrapper img { display: block; object-position: center 35%; }
.model-card:hover .card-image-wrapper img { transform: scale(1.025); }
.card-info { padding: 12px 1px 0; }
.card-info h3 { font-size: 1rem; letter-spacing: -.02em; margin-bottom: 9px; overflow-wrap: anywhere; }
.card-info h3 a:hover, .nat-tag:hover { color: var(--primary); }
.card-meta { font-size: .73rem; gap: 8px; align-items: center; flex-wrap: wrap; }
.card-meta span, .card-meta a { display: inline-flex; align-items: center; gap: 4px; }
.card-meta svg { width: 12px !important; height: 12px !important; }
.meta-divider { margin: 9px 0; }
.card-meta .nat-tag img { width: 15px; margin-right: 0 !important; }
.badge { top: 10px; left: 10px; border-radius: 4px; font-size: .6rem; letter-spacing: .06em; padding: 4px 7px; }
.badge-live { background: #23744b; }
.badge-offline { background: rgba(35, 38, 33, .85); }
.countries-grid { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin: 24px 0; }
.country-pill { flex-direction: row; padding: 15px 12px; gap: 10px; border-radius: 6px; font-size: .87rem; text-align: left; }
.country-pill:hover { transform: none; border-color: #b8afa4; background: #ede8e1; }
.pill-flag { width: 25px; height: 18px; box-shadow: none; border-radius: 2px; flex-shrink: 0; }
.btn-primary, .btn-secondary { border-radius: 6px; font-size: .86rem; min-height: 42px; padding: 10px 18px; }
.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { transform: none; box-shadow: none; }
.btn-secondary { color: var(--text-main); background: var(--bg-card); }
.btn-secondary:hover { background: var(--bg-hover); }
.btn-primary.large-btn { padding: 14px 20px; font-size: .92rem; }
.breadcrumb { gap: 8px; margin-bottom: 24px; font-size: .78rem; flex-wrap: wrap; }
.country-live-count { font-size: .8rem; font-weight: 700; color: var(--live-green); }
.country-filters { padding: 16px 0; margin-bottom: 26px; border-top: 1px solid var(--border-color); border-bottom: 1px solid var(--border-color); gap: 16px; }
.country-filters label { font-size: .72rem; color: var(--text-muted); font-weight: 600; gap: 5px; min-width: 160px; }
.country-filters select { color: var(--text-main); border-radius: 5px; min-height: 42px; padding: 8px 32px 8px 10px; font-size: .85rem; }
.country-filters > a { font-size: .82rem; text-decoration: underline; align-self: center; }
.listing-pagination { margin-top: 36px; font-size: .85rem; gap: 12px; }
.info-block { margin-top: 64px; padding: 36px; background: #edeae4; border: 0; border-radius: 8px; }
.info-block.no-image { text-align: left; }
.info-content.full-width { max-width: none; }
.info-content h2 { font-size: 2rem; }
.info-content p { font-size: .96rem; line-height: 1.8; margin-bottom: 24px; }
.feature-item { border-radius: 0; padding: 18px 0; background: none; border-top: 1px solid var(--border-color); }
.feature-item:hover { background: none; }
.feature-item svg { color: var(--primary); flex-shrink: 0; width: 20px; }
.country-content-section { max-width: 850px; }
.country-content-section h2 { font-size: 1.8rem; }
.country-content-section p { font-size: .98rem; }
.faq-section { max-width: 960px; }
.faq-section > h2 { margin-bottom: 24px; }
.faq-container { gap: 0; }
.faq-item { background: none; border: 0; border-top: 1px solid var(--border-color); border-radius: 0; box-shadow: none; }
.faq-item:last-child { border-bottom: 1px solid var(--border-color); }
.faq-question { padding: 22px 0; font-size: .96rem; line-height: 1.5; }
.faq-question:hover { background: none; color: var(--primary); }
.faq-question svg { width: 20px; height: 20px; background: var(--bg-card); border-radius: 50%; padding: 2px; }
.faq-answer { padding-inline: 0; max-width: 800px; font-size: .95rem; }
.faq-item.active .faq-answer { padding: 0 0 22px; }
.profile-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 28px; }
.profile-main, .profile-sidebar { min-width: 0; }
.video-container { box-shadow: none; border-radius: 8px; }
.profile-info-box { background: var(--bg-card); padding: 26px; border-radius: 8px; }
.profile-header-meta { gap: 16px; flex-wrap: wrap; }
.profile-header-meta h1 { font-size: clamp(1.8rem, 3vw, 2.7rem); overflow-wrap: anywhere; }
.profile-details-grid { gap: 20px; }
.detail-item .value { font-size: .95rem; }
.detail-item .value a { display: inline-flex; align-items: center; gap: 8px; }
.profile-description p { font-size: .95rem; }
.sidebar-card { border-radius: 8px; padding: 22px; }
.premium-card { background: #ece6df; border-color: #d8c9bf; }
.sidebar-card p { color: var(--text-muted); font-size: .9rem; }
.secure-badge { font-size: .75rem; display: flex; gap: 6px; align-items: center; color: var(--text-muted); }
.secure-badge svg { width: 15px; }
.mini-img { width: 80px; height: 60px; border-radius: 5px; }
.mini-info { min-width: 0; }
.mini-info h4 { overflow-wrap: anywhere; }
.mini-status { font-size: .48rem; }
.tag-pill { background: #eeeae3; color: #55594f; border-radius: 4px; }
.main-footer { background: #eae6df; margin-top: 52px; padding: 44px 0 24px; }
.footer-grid { gap: 36px; margin-bottom: 36px; }
.footer-col h4 { font-size: .75rem; text-transform: uppercase; letter-spacing: .1em; margin-bottom: 18px; }
.footer-col p { margin-top: 16px; font-size: .87rem; color: var(--text-muted); }
.footer-col ul li a { font-size: .82rem; }
.footer-col ul li img { vertical-align: middle; margin-right: 4px; }
.compliance-badges { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 18px; }
.compliance-badges .badge { position: static; background: #f7f4ef; color: #55594f; font-size: .65rem; }
.footer-bottom { padding-top: 22px; font-size: .74rem; }
body .guide-hero { background: none; border: 0; padding: 28px 0 44px; text-align: left; }
body .guide-title { font-size: clamp(2.2rem, 4vw, 3.5rem); color: var(--text-main); }
body .guide-subtitle { max-width: 800px; margin-left: 0; font-size: 1rem; }
body .badge-tag { position: static; display: inline-block; background: #e9e1d9; color: var(--primary); }
body .guide-step { border: 0; border-top: 1px solid var(--border-color); background: none; border-radius: 0; padding: 32px 0; gap: 28px; }
body .step-number { font-size: 3rem; color: var(--primary); opacity: .8; }
body .step-content { min-width: 0; }
body .step-content h3 { font-size: 1.5rem; }
body .benefit-card, body .equip-card { background: #eeeae4; border: 0; border-radius: 6px; }
body .cta-section { background: #eeeae4 !important; border: 0 !important; border-radius: 8px !important; padding: 32px !important; }
body .legal-content { max-width: 820px; }
body .legal-content h1 { color: var(--text-main); font-size: clamp(2rem, 4vw, 3rem); }
body .legal-content h2 { color: var(--text-main); }
body .legal-content p { color: var(--text-muted); opacity: 1; }
@media (max-width: 1100px) {
    .nav-content { gap: 10px; }
    .nav-wrapper { gap: 14px; }
    .search-form { width: 185px; }
    .countries-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 992px) {
    .nav-content { max-height: calc(100dvh - 60px); overflow-y: auto; gap: 16px; }
    .search-form { width: 100%; }
    .dropdown-content { max-height: none; }
    .model-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .profile-layout { grid-template-columns: minmax(0, 1fr); }
    .profile-sidebar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
    .hero h1 { font-size: clamp(2.6rem, 7vw, 4.2rem); }
}
@media (max-width: 640px) {
    .container { padding-inline: 18px; }
    .main-header { padding-block: 12px; }
    .logo { font-size: 1.25rem; }
    .page-spacing { padding-top: 24px; }
    .hero { padding: 32px 0 24px; }
    .hero h1 { font-size: 2.6rem; }
    .hero p { font-size: .94rem; }
    .hero-stats { flex-wrap: nowrap; gap: 0; }
    .stat-item { padding-inline: 14px; }
    .stat-value { font-size: 1.4rem; }
    .stat-label { font-size: .57rem; }
    .model-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
    .card-info h3 { font-size: .88rem; }
    .card-meta { font-size: .65rem; gap: 5px; }
    .card-meta svg { display: none; }
    .card-meta .nat-tag { gap: 3px; }
    .badge { top: 7px; left: 7px; font-size: .55rem; }
    .countries-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .header-content h2 { font-size: 1.5rem; }
    .country-filters { gap: 12px; }
    .country-filters label { min-width: 0; flex: 1 1 135px; }
    .country-filters select { width: 100%; }
    .info-block { padding: 24px 18px; }
    .info-content h2 { font-size: 1.7rem; }
    .feature-grid { grid-template-columns: minmax(0, 1fr); }
    .profile-sidebar { display: block; }
    .profile-info-box { padding: 18px; }
    .profile-details-grid { gap: 16px 10px; }
    .placeholder-overlay { padding: 12px; }
    .placeholder-overlay .large-btn { font-size: .75rem; padding: 10px 12px; }
    .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 18px; }
    .brand-col { grid-column: 1 / -1; }
    .listing-pagination { gap: 8px; }
    .listing-pagination .btn-secondary { padding: 8px 12px; font-size: .78rem; }
    body .guide-step { gap: 18px; }
}
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}
