/* =====================================================================
   Sira Le Seriw — UI Phase 2.2
   Brand Design System / Palette Consolidation

   Approved UI families:
   1) Forest     — identity, navigation, dark surfaces
   2) Ivory      — page canvas and light surfaces
   3) Gold       — premium/highlight/accent
   4) Terracotta — conversion/action emphasis only
   5) Ink/neutral— typography, dividers and secondary text

   Product imagery and portfolio artwork are content and are not palette-
   restricted. Semantic status colors remain reserved for system feedback.
   ===================================================================== */

:root{
  /* Core brand */
  --sira-forest-950:#071d15;
  --sira-forest-900:#0b2b1e;
  --sira-forest-800:#123d2b;
  --sira-forest-700:#1b5139;
  --sira-forest-600:#28684a;

  --sira-ivory-50:#fffaf2;
  --sira-ivory-100:#f8f2e7;
  --sira-ivory-200:#efe5d2;
  --sira-ivory-300:#e5d7bc;

  --sira-gold-300:#f0cd73;
  --sira-gold-500:#e3b94f;
  --sira-gold-700:#a77924;

  --sira-terracotta-400:#d76548;
  --sira-terracotta-500:#c94a34;
  --sira-terracotta-700:#9e3929;

  --sira-ink-900:#181914;
  --sira-ink-700:#45483f;
  --sira-ink-500:#716b60;
  --sira-line-light:rgba(24,25,20,.10);
  --sira-line-dark:rgba(255,255,255,.09);
  --sira-white:#fffdf8;

  /* Reserved semantic colors — not decorative palette colors. */
  --sira-success:#2f7b58;
  --sira-warning:#b37d22;
  --sira-danger:#b54135;
  --sira-info:#426b78;

  /* Legacy homepage aliases collapsed into the approved families. */
  --home-ink:var(--sira-ink-900);
  --home-ink-2:var(--sira-forest-900);
  --home-forest:var(--sira-forest-800);
  --home-forest-2:var(--sira-forest-700);
  --home-cream:var(--sira-ivory-100);
  --home-paper:var(--sira-ivory-50);
  --home-sand:var(--sira-ivory-200);
  --home-gold:var(--sira-gold-500);
  --home-gold-2:var(--sira-gold-300);
  --home-red:var(--sira-terracotta-500);
  --home-teal:var(--sira-forest-700);
  --home-blue:var(--sira-forest-800);
  --home-violet:var(--sira-forest-900);
  --home-mute:var(--sira-ink-500);
}

/* ---------------------------------------------------------------------
   HOME PAGE PALETTE NORMALIZATION ONLY
   No dimensions, DOM flow, responsive layout, loaders or interactions.
   --------------------------------------------------------------------- */
body{
  background:var(--sira-ivory-100);
  color:var(--sira-ink-900);
}

/* Primary brand surface */
.home-nav{
  background:rgba(7,29,21,.975);
  box-shadow:0 8px 30px rgba(4,18,12,.13);
}
.home-nav-dd-menu{
  background:var(--sira-ivory-50);
}
.home-nav-dd-menu a{color:var(--sira-forest-900)}
.home-nav-dd-menu a:hover{background:var(--sira-ivory-200)}
.home-nav-dd-ic{
  background:rgba(27,81,57,.10);
  color:var(--sira-forest-700);
}
.home-nav-join{
  background:linear-gradient(135deg,var(--sira-gold-300),var(--sira-terracotta-400));
  color:var(--sira-forest-950)!important;
}

/* Hero: warm canvas + brand green, no decorative teal. */
.home-hero{
  background:
    radial-gradient(circle at 78% 9%,rgba(227,185,79,.14),transparent 29%),
    radial-gradient(circle at 12% 100%,rgba(18,61,43,.075),transparent 35%),
    linear-gradient(180deg,#fbf8f0 0%,#f3ecdc 100%);
}
.hero-eyebrow{color:var(--sira-forest-700)}
.hero-eyebrow i{background:var(--sira-terracotta-500)}
.home-hero h1 em{color:var(--sira-terracotta-500)}
.hero-copy{color:var(--sira-ink-500)}
.hero-search button{
  background:linear-gradient(135deg,var(--sira-terracotta-500),var(--sira-terracotta-400));
}
.hero-path-primary{background:var(--sira-forest-800)}
.hero-path-secondary{color:var(--sira-forest-700)}

/* Sponsored hero uses brand forest, premium gold, conversion terracotta. */
.sponsored-shell{background:var(--sira-forest-950)}
.sponsored-media{background:linear-gradient(135deg,var(--sira-forest-700),var(--sira-forest-950))}
.sponsored-media:after{background:linear-gradient(180deg,transparent 28%,rgba(7,29,21,.1) 52%,var(--sira-forest-950) 100%)}
.sponsored-avatar{border-color:var(--sira-forest-950)}
.sponsored-btn{
  background:linear-gradient(135deg,var(--sira-gold-300),var(--sira-terracotta-400));
  color:var(--sira-forest-950);
}

/* Trust rail */
.home-proof-rail{background:var(--sira-forest-900)}
.proof-ic{color:var(--sira-gold-300)}

/* Common section language */
.section-kicker{color:var(--sira-gold-700)}
.section-copy{color:var(--sira-ink-500)}
.section-link{color:var(--sira-terracotta-700)}

/* Categories / Spotlight: content photos stay natural, chrome stays branded. */
.cat-v2,.spotlight-art,.creator-lead-media{background:var(--sira-forest-800)}
.cat-v2:hover .cat-v2-arrow{
  background:var(--sira-gold-300);
  color:var(--sira-forest-900);
}
.spotlight-card{
  background:linear-gradient(145deg,var(--sira-gold-300) 0%,var(--sira-gold-500) 58%,var(--sira-terracotta-400) 100%);
}
.spotlight-inner{background:var(--sira-forest-800)}
.spotlight-art:after{background:linear-gradient(180deg,transparent,var(--sira-forest-800))}
.spotlight-cta a,.spotlight-house a{
  background:var(--sira-gold-300);
  color:var(--sira-forest-900);
}

/* Job band: only warm ivory tones; CTA owns terracotta. */
.briefs-band{
  background:linear-gradient(115deg,#efe3cb 0%,#f8f2e7 56%,#f1e7d4 100%);
}
.brief-primary{background:var(--sira-terracotta-500)}
.brief-empty{background:var(--sira-forest-800)}
.brief-empty-icon,.brief-empty>a{
  background:var(--sira-gold-300);
  color:var(--sira-forest-800);
}

/* Digital Suq: remove violet/teal atmosphere. One dark forest universe. */
.suq-home{background:var(--sira-forest-950)}
.suq-home:before{
  background:
    radial-gradient(circle at 87% 15%,rgba(227,185,79,.10),transparent 31%),
    radial-gradient(circle at 18% 100%,rgba(27,81,57,.18),transparent 36%);
}
.suq-home .section-title{color:var(--sira-ivory-100)}
.suq-home .section-kicker{color:var(--sira-gold-300)}
.suq-home .section-copy{color:#aeb8b0}
.suq-card{background:#12271d}
.suq-card-media{background:linear-gradient(135deg,#1b4934,#0e241a)}
.suq-card-foot strong,.suq-arrow,.suq-browse-kicker,.suq-browse-card strong{color:var(--sira-gold-300)}
.suq-house a{background:var(--sira-terracotta-500)}

/* Top Creators: eliminate the independent slate-blue/teal palette. */
.creators-v2{
  background:linear-gradient(115deg,#173f2e 0%,#102f23 54%,#0a2118 100%);
  border-top-color:rgba(227,185,79,.12);
  border-bottom-color:rgba(227,185,79,.10);
}
.creators-v2:before{
  background:radial-gradient(circle,rgba(227,185,79,.10),transparent 68%);
}
.creators-v2 .section-copy{color:#b8c4bc}
.creator-tile{background:rgba(255,255,255,.045)}
.creator-tile-media{background:#17382a}
.creator-tile-person img{
  border-color:#17382a;
  background:#17382a;
}
.creator-tile.is-first .creator-tile-person img{border-color:var(--sira-gold-300)}
.creator-tile-foot strong,.creator-tile-person b span{color:var(--sira-gold-300)}

/* Escrow: keep the successful dark section and birr artwork, but remove
   the separate mint/teal accent. Gold now represents protected money flow. */
.escrow-v2{background:#082d22}
.escrow-v2 .section-kicker{color:var(--sira-gold-300)}
.escrow-arrow{color:var(--sira-gold-300)}
.escrow-arrow:before{
  background:linear-gradient(90deg,rgba(240,205,115,.06),var(--sira-gold-300),rgba(240,205,115,.06));
}
.escrow-arrow:after{
  background:var(--sira-gold-300);
  box-shadow:0 0 10px rgba(240,205,115,.78);
}

/* Creator CTA + final conversion + footer */
.creator-cta-v2{background:var(--sira-ivory-100)}
.creator-cta-card{background:linear-gradient(145deg,var(--sira-forest-800),var(--sira-forest-700))}
.creator-cta-card a{background:var(--sira-terracotta-500)}
.home-final{background:linear-gradient(135deg,var(--sira-gold-300),var(--sira-gold-500))}
.home-final h2{color:var(--sira-forest-800)!important}
.home-final-primary{background:var(--sira-forest-800)}
.home-footer{background:var(--sira-forest-900)}
