/*
Theme Name: Safari Gulf
Theme URI: https://safarigulf.com
Author: Ahmed
Description: Bilingual (EN/AR) SEO-first blog theme for Safari Gulf, built to evolve into a full safari-booking business site. Full RTL support.
Version: 1.0.0
Requires PHP: 7.4
Text Domain: safari-gulf
*/

:root{
  --sand: #E8DCC4;
  --sand-light: #F5EFE0;
  --forest: #2F3E2E;
  --forest-dark: #1D2A1C;
  --sunset: #D97F3D;
  --sunset-dark: #B85F1F;
  --text-dark: #23241F;
  --text-muted: #6B6858;
  --white: #FFFFFF;
  --radius: 10px;
  --font-heading: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-body-ar: 'Cairo', 'Inter', sans-serif;
}

*{box-sizing:border-box;}
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--text-dark);
  background: var(--sand-light);
  line-height:1.65;
}
body.rtl{ font-family: var(--font-body-ar); direction: rtl; }

h1,h2,h3,h4{ font-family: var(--font-heading); color: var(--forest-dark); line-height:1.2; margin:0 0 .5em; }
a{ color: var(--sunset-dark); text-decoration:none; }
a:hover{ color: var(--sunset); }
img{ max-width:100%; height:auto; display:block; border-radius: var(--radius); }
.container{ max-width:1120px; margin:0 auto; padding:0 20px; }

/* Header */
.site-header{ background: var(--forest-dark); padding:16px 0; position:sticky; top:0; z-index:50; }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; }
.site-branding a{ color: var(--sand-light); font-family: var(--font-heading); font-size:1.5rem; font-weight:600; }
.main-nav ul{ list-style:none; display:flex; gap:28px; margin:0; padding:0; }
.main-nav a{ color: var(--sand); font-weight:500; }
.main-nav a:hover{ color: var(--sunset); }
.lang-switch{ display:flex; gap:8px; margin-inline-start:24px; }
.lang-switch a{ color: var(--sand); border:1px solid rgba(255,255,255,.25); padding:4px 10px; border-radius:999px; font-size:.8rem; }
.lang-switch a.active{ background: var(--sunset); color:var(--white); border-color: var(--sunset); }

/* Hero */
.hero{ background: linear-gradient(180deg, rgba(29,42,28,.55), rgba(29,42,28,.75)), var(--forest); background-size:cover; background-position:center; color: var(--white); padding:110px 0 90px; text-align:center; }
.hero h1{ color: var(--white); font-size:2.75rem; max-width:820px; margin:0 auto .4em; }
.hero p{ font-size:1.15rem; color: var(--sand); max-width:620px; margin:0 auto 1.8em; }
.btn{ display:inline-block; background: var(--sunset); color: var(--white); padding:13px 30px; border-radius:999px; font-weight:600; transition:background .2s; }
.btn:hover{ background: var(--sunset-dark); color:var(--white); }
.btn-outline{ background:transparent; border:1.5px solid var(--sand); color: var(--sand); }

/* Sections */
.section{ padding:64px 0; }
.section-title{ text-align:center; font-size:2rem; margin-bottom:.3em; }
.section-subtitle{ text-align:center; color: var(--text-muted); max-width:600px; margin:0 auto 40px; }

/* Post grid */
.post-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:28px; }
.post-card{ background: var(--white); border-radius: var(--radius); overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,.06); transition:transform .2s; }
.post-card:hover{ transform: translateY(-4px); }
.post-card .post-thumb{ aspect-ratio:16/10; overflow:hidden; }
.post-card .post-thumb img{ width:100%; height:100%; object-fit:cover; border-radius:0; }
.post-card-body{ padding:20px; }
.post-card .cat{ color: var(--sunset-dark); font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.post-card h3{ font-size:1.15rem; margin:.35em 0; }
.post-card p{ color: var(--text-muted); font-size:.92rem; }

/* CTA band (booking teaser) */
.cta-band{ background: var(--forest-dark); color: var(--white); text-align:center; padding:70px 0; }
.cta-band h2{ color: var(--white); }
.cta-band p{ color: var(--sand); max-width:560px; margin:0 auto 1.6em; }

/* Single post */
.single-post{ max-width:760px; margin:0 auto; padding:50px 20px; }
.single-post .entry-meta{ color: var(--text-muted); font-size:.85rem; margin-bottom:1.5em; }
.single-post h1{ font-size:2.2rem; }
.single-post .content{ font-size:1.05rem; }
.single-post .content h2{ margin-top:1.6em; }

/* Sidebar / widgets */
.widget{ background: var(--white); border-radius: var(--radius); padding:22px; margin-bottom:24px; }
.widget h3{ font-size:1rem; text-transform:uppercase; letter-spacing:.04em; }

/* Footer */
.site-footer{ background: var(--forest-dark); color: var(--sand); padding:50px 0 26px; margin-top:60px; }
.site-footer .container{ display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:28px; }
.site-footer h4{ color: var(--white); font-size:.95rem; }
.site-footer a{ color: var(--sand); }
.footer-bottom{ text-align:center; color: rgba(232,220,196,.6); font-size:.8rem; margin-top:40px; }

@media (max-width:780px){
  .main-nav{ display:none; }
  .hero{ padding:70px 0 60px; }
  .hero h1{ font-size:2rem; }
}