/*
Theme Name: Singing Camel – Divi 5 Child
Theme URI: https://example.com/
Description: Vintage Land Rover restoration-inspired Divi 5 child theme for Singing Camel.
Author: Singing Camel
Template: Divi
Version: 1.0.0
Text Domain: singing-camel
*/

/* =========================================================
   SINGING CAMEL DESIGN SYSTEM
   ========================================================= */
:root {
  --sc-rover: #28382f;
  --sc-rover-2: #485a48;
  --sc-cream: #f1ebdd;
  --sc-paper: #f8f4ea;
  --sc-sand: #c8b996;
  --sc-leather: #795a3c;
  --sc-brass: #a58a56;
  --sc-charcoal: #252623;
  --sc-muted: #6f7169;
  --sc-line: rgba(40,56,47,.18);
  --sc-shadow: 0 18px 45px rgba(27,32,27,.10);
  --sc-radius: 2px;
  --sc-content: 1280px;
  --sc-serif: "Libre Baskerville", Georgia, "Times New Roman", serif;
  --sc-sans: "IBM Plex Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html { scroll-behavior: smooth; }
body {
  background: var(--sc-paper);
  color: var(--sc-charcoal);
  font-family: var(--sc-sans);
  font-size: 17px;
  line-height: 1.7;
}
body:before {
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:9999;
  opacity:.055;
  background-image:url("assets/paper-grain.svg");
  background-size:280px 280px;
}
h1,h2,h3,h4,h5,h6,
.et_pb_module_heading {
  color: var(--sc-charcoal);
  font-family: var(--sc-serif);
  font-weight: 400;
  letter-spacing: -.025em;
}
h1 { font-size: clamp(3rem,7vw,6.8rem); line-height:.98; }
h2 { font-size: clamp(2.3rem,4.4vw,4.4rem); line-height:1.06; }
h3 { font-size: clamp(1.45rem,2vw,2rem); line-height:1.18; }
a { color: var(--sc-rover-2); }
::selection { background: var(--sc-sand); color: var(--sc-charcoal); }

/* Divi container */
.et_pb_row { width:min(92%, var(--sc-content)); }
#main-content { background:var(--sc-paper); }

/* Header */
#main-header, .et-l--header {
  background:rgba(248,244,234,.96);
}
#main-header {
  box-shadow:0 1px 0 var(--sc-line);
}
#top-menu a, .et-menu a {
  font-family:var(--sc-sans);
  font-size:13px;
  font-weight:600;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--sc-charcoal);
}
#top-menu li.current-menu-item>a,
.et-menu li.current-menu-item>a { color:var(--sc-leather); }

/* Buttons */
.et_pb_button,
.sc-button,
input[type=submit],
button[type=submit] {
  border:1px solid var(--sc-rover)!important;
  border-radius:var(--sc-radius)!important;
  background:var(--sc-rover)!important;
  color:#fff!important;
  font-family:var(--sc-sans)!important;
  font-size:12px!important;
  font-weight:700!important;
  letter-spacing:.11em!important;
  line-height:1.2!important;
  padding:15px 22px!important;
  text-transform:uppercase!important;
  transition:.2s ease!important;
}
.et_pb_button:hover,.sc-button:hover,input[type=submit]:hover,button[type=submit]:hover {
  background:var(--sc-leather)!important;
  border-color:var(--sc-leather)!important;
  transform:translateY(-1px);
}
.sc-button--light {
  background:transparent!important;
  color:var(--sc-rover)!important;
}

/* Utility/preset classes for Divi modules */
.sc-kicker {
  font-family:var(--sc-sans)!important;
  font-size:11px!important;
  font-weight:700!important;
  letter-spacing:.19em!important;
  text-transform:uppercase;
}
.sc-paper { background:var(--sc-paper)!important; }
.sc-cream { background:var(--sc-cream)!important; }
.sc-green { background:var(--sc-rover)!important; color:#fff; }
.sc-green h1,.sc-green h2,.sc-green h3,.sc-green h4 { color:#fff; }
.sc-sand { background:var(--sc-sand)!important; }
.sc-rule { border-top:1px solid var(--sc-line); }
.sc-narrow { max-width:780px; margin-inline:auto; }
.sc-section { padding-block:clamp(70px,8vw,125px)!important; }

/* Hero */
.sc-hero {
  min-height:min(780px,84vh);
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
}
.sc-hero:after {
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(90deg,rgba(241,235,221,.96) 0%,rgba(241,235,221,.78) 40%,rgba(241,235,221,.08) 72%);
  pointer-events:none;
}
.sc-hero .et_pb_row { z-index:2; }
.sc-hero-copy { max-width:620px; }
.sc-hero .sc-kicker { color:var(--sc-leather); }
.sc-hero p { max-width:560px; font-size:18px; }

/* Cards */
.sc-card,
.sc-project-card,
.sc-market-card {
  background:rgba(255,255,255,.32);
  border:1px solid var(--sc-line);
  box-shadow:none;
  height:100%;
  overflow:hidden;
  transition:.22s ease;
}
.sc-card:hover,.sc-project-card:hover,.sc-market-card:hover {
  transform:translateY(-4px);
  box-shadow:var(--sc-shadow);
}
.sc-card img,.sc-project-card img,.sc-market-card img {
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  filter:saturate(.82) contrast(1.03);
}
.sc-card-body { padding:24px; }
.sc-status {
  display:inline-block;
  background:var(--sc-brass);
  color:#fff;
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
  padding:6px 9px;
  text-transform:uppercase;
}
.sc-status--complete { background:var(--sc-rover-2); }
.sc-price {
  font-family:var(--sc-serif);
  font-size:clamp(1.8rem,3vw,2.7rem);
  line-height:1;
}

/* Marketplace category grid */
.sc-category-grid {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-left:1px solid var(--sc-line);
  border-top:1px solid var(--sc-line);
}
.sc-category {
  padding:30px 20px;
  min-height:145px;
  border-right:1px solid var(--sc-line);
  border-bottom:1px solid var(--sc-line);
  background:rgba(255,255,255,.18);
  text-align:center;
}
.sc-category:hover { background:var(--sc-cream); }
.sc-category strong {
  display:block;
  margin-top:12px;
  font-family:var(--sc-serif);
  font-weight:400;
  font-size:18px;
}

/* Project timeline */
.sc-timeline {
  position:relative;
  margin:35px 0;
  padding-left:38px;
}
.sc-timeline:before {
  content:"";
  position:absolute;
  left:8px; top:5px; bottom:5px;
  width:1px; background:var(--sc-line);
}
.sc-update {
  position:relative;
  margin:0 0 45px;
  padding:0 0 0 12px;
}
.sc-update:before {
  content:"";
  position:absolute;
  left:-35px; top:8px;
  width:11px; height:11px;
  border-radius:50%;
  background:var(--sc-brass);
  box-shadow:0 0 0 5px var(--sc-paper);
}
.sc-update-date {
  color:var(--sc-leather);
  font-size:11px;
  font-weight:700;
  letter-spacing:.13em;
  text-transform:uppercase;
}

/* Gallery */
.sc-gallery {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
}
.sc-gallery img { width:100%; aspect-ratio:4/3; object-fit:cover; }

/* Forms */
input[type=text],input[type=email],input[type=tel],input[type=url],
input[type=number],select,textarea {
  width:100%;
  border:1px solid var(--sc-line)!important;
  border-radius:0!important;
  background:#fffdf7!important;
  color:var(--sc-charcoal)!important;
  font-family:var(--sc-sans)!important;
  padding:14px 15px!important;
}
label {
  color:var(--sc-charcoal);
  font-size:12px;
  font-weight:700;
  letter-spacing:.07em;
  text-transform:uppercase;
}

/* Plugin compatibility – common project/market wrappers */
.camel-projects-grid,.camel-marketplace-grid,
.sc-projects-grid,.sc-marketplace-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:28px;
}
.camel-projects-grid article,.camel-marketplace-grid article {
  background:rgba(255,255,255,.3);
  border:1px solid var(--sc-line);
  padding:0;
  overflow:hidden;
}
.camel-projects-grid article img,.camel-marketplace-grid article img {
  width:100%; aspect-ratio:4/3; object-fit:cover;
}

/* Footer */
#main-footer,.et-l--footer {
  background:var(--sc-rover);
  color:rgba(255,255,255,.78);
}
#main-footer a,.et-l--footer a { color:#fff; }
#footer-bottom { background:#1d2a23; }

/* Responsive */
@media (max-width:980px) {
  .sc-category-grid { grid-template-columns:repeat(2,1fr); }
  .camel-projects-grid,.camel-marketplace-grid,.sc-projects-grid,.sc-marketplace-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .sc-gallery { grid-template-columns:repeat(2,1fr); }
  .sc-hero:after { background:linear-gradient(90deg,rgba(241,235,221,.96),rgba(241,235,221,.65)); }
}
@media (max-width:600px) {
  body { font-size:16px; }
  .sc-category-grid,.camel-projects-grid,.camel-marketplace-grid,
  .sc-projects-grid,.sc-marketplace-grid { grid-template-columns:1fr; }
  .sc-gallery { grid-template-columns:1fr 1fr; }
  .sc-hero { min-height:680px; }
}
