/* ==========================================================
   ICODE MEDIA · BEIGE ART DIRECTION V1
   Site-wide warm editorial palette.
   Background target: #F3F0EC
   ========================================================== */

:root{
  --icode-bg:#f3f0ec!important;
  --icode-surface:#fbf8f3!important;
  --icode-surface-2:#eee7de!important;
  --icode-surface-3:#e4dacd!important;
  --icode-ink:#171310!important;
  --icode-muted:#70665e!important;
  --icode-soft:#968a80!important;
  --icode-copper:#b87445!important;
  --icode-copper-light:#dca06f!important;
  --icode-blue:#375a78!important;
  --icode-green:#2f7d5a!important;
  --icode-line:rgba(36,27,20,.13)!important;

  --v5-bg:var(--icode-bg)!important;
  --v5-panel:var(--icode-surface)!important;
  --v5-panel2:var(--icode-surface-2)!important;
  --v5-ink:var(--icode-ink)!important;
  --v5-muted:var(--icode-muted)!important;
  --v5-accent:var(--icode-copper)!important;
  --v5-line:var(--icode-line)!important;

  --pub-accent:var(--icode-copper)!important;
  --pub-ink:var(--icode-ink)!important;
  --pub-muted:var(--icode-muted)!important;
  --pub-line:var(--icode-line)!important;
  --pub-panel:var(--icode-surface)!important;
  --pub-panel2:var(--icode-surface-2)!important;

  --bg:var(--icode-bg)!important;
  --panel:var(--icode-surface)!important;
  --panel2:var(--icode-surface-2)!important;
  --ink:var(--icode-ink)!important;
  --muted:var(--icode-muted)!important;
  --accent:var(--icode-copper)!important;
  --bronze:var(--icode-copper)!important;
  --line:var(--icode-line)!important;

  color-scheme:light!important;
}

html{
  background:#f3f0ec!important;
}
body{
  background:
    radial-gradient(circle at 92% -5%,rgba(184,116,69,.13),transparent 27%),
    radial-gradient(circle at 4% 14%,rgba(55,90,120,.065),transparent 24%),
    linear-gradient(180deg,#f7f3ee 0,#f3f0ec 22%,#f1ece6 100%)!important;
  color:var(--icode-ink)!important;
}
main{
  background:transparent!important;
  color:var(--icode-ink)!important;
}

/* A faint paper-grid treatment. It keeps the page bright without feeling empty. */
body:before{
  content:"";
  position:fixed;
  z-index:-1;
  inset:0;
  pointer-events:none;
  opacity:.18;
  background-image:
    linear-gradient(rgba(44,34,26,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(44,34,26,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(180deg,#000,transparent 85%);
}

/* ----------------------------- HEADER ----------------------------- */
.cinema-header{
  border-color:rgba(63,47,34,.13)!important;
  background:rgba(247,243,238,.86)!important;
  box-shadow:0 18px 55px rgba(54,40,28,.075)!important;
  backdrop-filter:blur(20px)!important;
}
.cinema-header.scrolled{
  background:rgba(247,243,238,.96)!important;
  box-shadow:0 18px 60px rgba(54,40,28,.11)!important;
}
.cinema-logo img,
.mobile-scene-logo img{
  content:url('/icode-assets/brand/icode-logo-dark.webp')!important;
  filter:none!important;
}
.simple-main-nav>a,
.cinema-desktop-nav>a,
.cinema-mega>summary{
  color:#30271f!important;
}
.simple-main-nav>a:hover,
.cinema-desktop-nav>a:hover,
.cinema-mega>summary:hover,
.cinema-desktop-nav>a.active{
  color:var(--icode-copper)!important;
}
.simple-main-nav>a:after{
  background:var(--icode-copper)!important;
}
.cinema-project-btn{
  background:#1b1714!important;
  color:#fffaf5!important;
  border:1px solid #1b1714!important;
  box-shadow:0 12px 30px rgba(41,31,23,.12)!important;
}
.cinema-project-btn:hover{
  background:var(--icode-copper)!important;
  border-color:var(--icode-copper)!important;
  color:#fff!important;
}
.cinema-mobile-trigger{
  border-color:rgba(36,27,20,.15)!important;
  background:#ebe3da!important;
}
.cinema-mobile-trigger span{background:#171310!important}

/* -------------------------- MOBILE MENU --------------------------- */
.mobile-scene{
  background:
    radial-gradient(circle at 88% 0,rgba(184,116,69,.16),transparent 34%),
    #f3f0ec!important;
  color:var(--icode-ink)!important;
}
.mobile-scene-top,
.mobile-scene-bottom,
.mobile-scene-section,
.mobile-scene-link{
  border-color:var(--icode-line)!important;
}
.mobile-scene-top button{
  background:#e9e0d6!important;
  border-color:var(--icode-line)!important;
  color:#171310!important;
}
.mobile-scene-label{color:var(--icode-copper)!important}
.simple-mobile-nav .mobile-scene-link>span,
.mobile-scene-section summary,
.mobile-scene-link{
  color:#171310!important;
}
.simple-mobile-nav .mobile-scene-link>b,
.mobile-scene-section>summary b,
.mobile-scene-link>b{
  color:#9a8d82!important;
}
.mobile-scene-section>div a{
  color:#6f655d!important;
  border-color:rgba(36,27,20,.07)!important;
}
.mobile-scene-section>div a:hover{color:var(--icode-copper)!important}
.mobile-scene-bottom{
  background:linear-gradient(180deg,rgba(243,240,236,0),#f3f0ec 19%)!important;
}
.mobile-scene-bottom>a{
  color:#4c423a!important;
  background:rgba(251,248,243,.72)!important;
  border-color:var(--icode-line)!important;
}
.mobile-scene-bottom .mobile-start{
  background:#1b1714!important;
  color:#fff!important;
  border-color:#1b1714!important;
}

/* ----------------------------- HERO ------------------------------- */
.v5-hero,
.v5-services,
.v5-work,
.v63-work,
.v66-work,
.v5-partners,
.v51-erp,
.v5-contact{
  color:var(--icode-ink)!important;
  background:transparent!important;
}
.v5-hero-grid{
  opacity:.34!important;
  background-image:
    linear-gradient(rgba(36,27,20,.045) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,27,20,.045) 1px,transparent 1px)!important;
}
.v5-hero-aura{
  background:
    radial-gradient(circle at 34% 28%,rgba(55,90,120,.10),transparent 34%),
    radial-gradient(circle at 67% 55%,rgba(184,116,69,.20),transparent 32%)!important;
  filter:blur(115px)!important;
}
.v5-hero h1,
.v5-hero-copy,
.v5-hero-stage{
  color:#171310!important;
}
.v5-hero-copy>p{
  color:#70665e!important;
}
.v5-secondary{
  border-color:rgba(36,27,20,.16)!important;
  color:#2d241d!important;
  background:rgba(251,248,243,.78)!important;
}
.v5-secondary:hover{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.42)!important;
}
.v5-primary{
  background:#1b1714!important;
  color:#fff!important;
}
.v5-primary:hover{background:var(--icode-copper)!important}
.v5-hero-proof{color:#8d8177!important}
.v5-hero-proof i{background:#cfc3b7!important}

.hero-stage-ring{
  border-color:rgba(126,82,50,.18)!important;
}
.hero-stage-center{
  background:#1b1714!important;
  border-color:rgba(184,116,69,.48)!important;
  color:#fff!important;
  box-shadow:0 24px 70px rgba(60,40,25,.16)!important;
}
.hero-stage-center small{color:#dca06f!important}
.hero-stage-center b{color:#fff!important}

/* V6.8 / V6.8.1 hero service objects */
.v68-service-node{
  border-color:rgba(96,70,49,.16)!important;
  background:
    radial-gradient(circle at 28% 20%,rgba(255,255,255,.9),transparent 34%),
    radial-gradient(circle at 78% 82%,rgba(184,116,69,.09),transparent 38%),
    rgba(251,248,243,.90)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.5),
    0 22px 58px rgba(70,51,36,.11)!important;
  color:#171310!important;
}
.v68-service-node strong{color:#171310!important;text-shadow:none!important}
.v68-service-node small{color:#8f8176!important}
.v68-service-node>span{
  background:rgba(184,116,69,.12)!important;
  border-color:rgba(184,116,69,.18)!important;
}
.v68-service-node>span b{color:#9a5c33!important}
.v68-service-node:before,
.v68-service-node:after{
  border-color:rgba(126,82,50,.14)!important;
}
.v68-service-node:hover,
.v68-service-node.v681-selected,
.v68-service-node.v681-dragging{
  border-color:rgba(184,116,69,.55)!important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.6),
    0 28px 74px rgba(78,54,37,.17),
    0 0 0 9px rgba(184,116,69,.045)!important;
}
.v681-play-hint{
  background:rgba(247,243,238,.78)!important;
  border-color:rgba(36,27,20,.10)!important;
  color:#8b7e73!important;
}
.v681-reset{color:#a55f32!important}

/* ---------------------------- PARTNERS ---------------------------- */
.v5-partners{
  background:#efe8df!important;
  border-top:1px solid rgba(36,27,20,.07)!important;
  border-bottom:1px solid rgba(36,27,20,.07)!important;
}
.v5-partners h2,
.v5-partners h3,
.v5-partners strong{color:#171310!important}
.v5-partners p{color:#746a61!important}
.v5-logo-mosaic figure,
.logo-track figure{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.10)!important;
  box-shadow:0 15px 38px rgba(68,49,34,.055)!important;
}
.v5-logo-mosaic figure:hover,
.logo-track figure:hover{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.30)!important;
  box-shadow:0 18px 45px rgba(68,49,34,.095)!important;
}

/* If some partner assets are white, keep their tile usable without darkening the whole section. */
.v5-logo-mosaic figure img,
.logo-track figure img{
  filter:none!important;
  opacity:.92!important;
}

/* ----------------------------- ABOUT ------------------------------ */
.about-premium{
  --ab-bg:#f3f0ec!important;
  --ab-panel:#fbf8f3!important;
  --ab-panel2:#eee7de!important;
  --ab-line:rgba(36,27,20,.13)!important;
  --ab-muted:#70665e!important;
  --ab-copper:#b87445!important;
  --ab-copper-light:#dca06f!important;
  --ab-ink:#171310!important;
  background:
    radial-gradient(circle at 82% 4%,rgba(55,90,120,.08),transparent 29%),
    radial-gradient(circle at 0 24%,rgba(184,116,69,.11),transparent 25%),
    #f3f0ec!important;
  color:#171310!important;
}
.about-hero-copy>p,
.about-section-head>p,
.about-method-copy>p,
.about-manifesto-copy>p,
.about-final>div>p,
.about-pillar-grid p{
  color:#70665e!important;
}
.about-btn.ghost{
  border-color:rgba(126,82,50,.30)!important;
  color:#2c241e!important;
  background:rgba(251,248,243,.76)!important;
}
.about-btn.ghost:hover{
  background:#1b1714!important;
  color:#fff!important;
  border-color:#1b1714!important;
}
.about-system{
  background:
    radial-gradient(circle at 50% 50%,rgba(55,90,120,.07),transparent 34%),
    #eee7de!important;
  border-color:var(--ab-line)!important;
  box-shadow:0 40px 100px rgba(67,48,34,.12)!important;
}
.about-system-grid{
  background-image:
    linear-gradient(rgba(36,27,20,.055) 1px,transparent 1px),
    linear-gradient(90deg,rgba(36,27,20,.055) 1px,transparent 1px)!important;
}
.about-center{
  background:rgba(251,248,243,.90)!important;
  border-color:rgba(184,116,69,.28)!important;
  box-shadow:0 18px 65px rgba(63,44,31,.12)!important;
}
.about-center small{color:#8d8177!important}
.about-node,
.about-pillar-grid article,
.about-capability-board>a{
  background:#fbf8f3!important;
  color:#171310!important;
  border-color:var(--ab-line)!important;
  box-shadow:0 16px 44px rgba(66,47,33,.055)!important;
}
.about-node:hover,
.about-pillar-grid article:hover,
.about-capability-board>a:hover{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.34)!important;
}
.about-node small,
.about-node span,
.about-tags,
.about-statement>b{color:#8d8177!important}
.about-capability-board>a:before{
  background:rgba(184,116,69,.08)!important;
}

/* ---------------------------- SERVICES ---------------------------- */
.service-index-grid>a,
.process-grid article,
.desk-world,
.creative-table,
.studio-board,
.service-work-link,
.service-related a,
.industry-cards a{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
  color:#171310!important;
  box-shadow:0 14px 42px rgba(65,47,33,.045)!important;
}
.service-index-grid>a:hover,
.process-grid article:hover,
.service-related a:hover,
.industry-cards a:hover{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.34)!important;
  box-shadow:0 20px 54px rgba(65,47,33,.08)!important;
}
.service-index-grid p,
.process-grid p,
.archive-head p,
.service-detail-hero p,
.service-next p,
.service-faq p,
.industry-cards p{
  color:#70665e!important;
}
.service-detail-hero h1,
.service-detail-hero h2,
.service-next h2,
.service-faq h2,
.archive-head h1,
.archive-head h2{
  color:#171310!important;
}
.service-detail-includes>div:last-child span,
.portfolio-service-nav a,
.portfolio-filters a{
  background:#eee7de!important;
  border-color:rgba(36,27,20,.10)!important;
  color:#40352d!important;
}
.portfolio-service-nav a:hover,
.portfolio-filters a.active{
  background:#1b1714!important;
  color:#fff!important;
  border-color:#1b1714!important;
}

/* --------------------------- PORTFOLIO ---------------------------- */
.portfolio-hub-grid>a,
.portfolio-service-card,
.portfolio-card>div,
.archive-card>button{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
  color:#171310!important;
}
.portfolio-studio-hero h1,
.portfolio-studio-hero h2,
.portfolio-card h2,
.portfolio-card h3{
  color:#171310!important;
}
.portfolio-studio-hero p,
.portfolio-card h3{color:#70665e!important}

/* V6.3 portfolio */
.v63-work-head h2,
.v63-work-head>p,
.v63-work-option,
.v63-work-bottom{
  color:#171310!important;
}
.v63-work-head>p{color:#70665e!important}
.v63-work-option{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
}
.v63-work-option:hover,
.v63-work-option:focus-visible,
.v63-work-option.active{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.34)!important;
}
.v63-work-option small,
.v63-work-option em{color:#8b7e73!important}
.v63-work-option i{color:#9c8f84!important}
.v63-work-bottom{
  background:#eee7de!important;
  border-color:rgba(36,27,20,.10)!important;
}
.v63-work-feature{
  border-color:rgba(98,66,44,.18)!important;
  box-shadow:0 30px 80px rgba(61,43,29,.13)!important;
}
.v63-work-media img{
  filter:none!important;
  opacity:1!important;
}
.v63-work-shade{
  background:
    linear-gradient(180deg,rgba(23,19,16,0) 0%,rgba(23,19,16,.02) 42%,rgba(23,19,16,.70) 100%)!important;
}

/* V6.6 portfolio */
.v66-section-head h2{color:#171310!important}
.v66-section-head>p{color:#70665e!important}
.v66-section-foot{
  background:#eee7de!important;
  border-color:rgba(36,27,20,.10)!important;
}
.v66-section-foot span{color:#8b7e73!important}
.v66-work-ghost{
  border-color:rgba(36,27,20,.08)!important;
  background:linear-gradient(145deg,#e7ddd2,#f8f4ef)!important;
}
.v66-work-card{
  border-color:rgba(184,116,69,.25)!important;
  box-shadow:0 35px 85px rgba(62,44,30,.14)!important;
}
.v66-work-image img{
  filter:none!important;
  opacity:1!important;
}
.v66-work-shade{
  background:
    linear-gradient(180deg,rgba(23,19,16,0) 0%,rgba(23,19,16,.02) 44%,rgba(23,19,16,.67) 100%)!important;
}
.v66-work-tab{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
  color:#171310!important;
}
.v66-work-tab:hover,
.v66-work-tab.active{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.36)!important;
}
.v66-work-tab small{color:#91857a!important}
.v66-work-arrow{
  background:rgba(251,248,243,.90)!important;
  border-color:rgba(184,116,69,.35)!important;
  color:#171310!important;
  box-shadow:0 10px 35px rgba(58,41,28,.10)!important;
}
.v66-work-meter{background:rgba(36,27,20,.07)!important}

/* -------------------------- ERP / CRM HOME ------------------------ */
.v51-erp{
  background:
    radial-gradient(circle at 88% 5%,rgba(55,90,120,.08),transparent 34%),
    linear-gradient(145deg,#eee7de,#f7f3ee)!important;
  border-top:1px solid rgba(36,27,20,.07)!important;
  border-bottom:1px solid rgba(36,27,20,.07)!important;
}
.v51-erp h2,
.v51-erp h3,
.v51-erp strong{
  color:#171310!important;
}
.v51-erp p{color:#70665e!important}
.v51-os-window,
.os-window-shell,
.v5-cockpit{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
  box-shadow:0 25px 70px rgba(62,44,30,.09)!important;
}

/* ------------------------------ BLOG ------------------------------ */
.blog-grid a{
  background:#fbf8f3!important;
  border-color:rgba(36,27,20,.11)!important;
  color:#171310!important;
  box-shadow:0 15px 42px rgba(65,47,33,.045)!important;
}
.blog-grid a:hover{
  background:#fffaf6!important;
  border-color:rgba(184,116,69,.34)!important;
  transform:translateY(-3px);
}
.blog-grid h2,
.blog-grid h3,
.article-v2 h1,
.article-v2 h2,
.article-v2 h3,
.article-v1 h1,
.article-v1 h2,
.article-v1 h3{
  color:#171310!important;
}
.blog-grid p,
.article-v2 header>p,
.article-v1 header>p,
.legacy-content{
  color:#70665e!important;
}
.legacy-content h2,
.legacy-content h3,
.legacy-content h4{color:#171310!important}
.legacy-content a{color:#9b5a31!important}

/* ----------------------------- CONTACT ---------------------------- */
.v5-contact,
.v2-start{
  background:
    radial-gradient(circle at 12% 10%,rgba(184,116,69,.11),transparent 30%),
    #e9e0d6!important;
  color:#171310!important;
  border-color:rgba(36,27,20,.10)!important;
  box-shadow:none!important;
}
.v5-contact h2,
.v5-contact h3,
.v2-start h2,
.v2-start h3{
  color:#171310!important;
}
.v5-contact p,
.v2-start p{color:#70665e!important}
.v5-contact input,
.v5-contact select,
.v5-contact textarea,
.v2-start input,
.v2-start select,
.v2-start textarea{
  background:#fbf8f3!important;
  color:#171310!important;
  border-color:rgba(36,27,20,.13)!important;
  box-shadow:none!important;
}
.v5-contact input::placeholder,
.v5-contact textarea::placeholder,
.v2-start input::placeholder,
.v2-start textarea::placeholder{
  color:#9c8f84!important;
}
.v5-contact button,
.v2-start button{
  background:#1b1714!important;
  color:#fff!important;
  border-color:#1b1714!important;
}
.v5-contact button:hover,
.v2-start button:hover{
  background:var(--icode-copper)!important;
  border-color:var(--icode-copper)!important;
}

/* ------------------------- GENERIC CONTENT ------------------------ */
.page-v2,
.page-v1,
.article-v2,
.article-v1{
  color:#171310!important;
}
.page-v2>span,
.article-v2 header>span,
.page-v1>span,
.article-v1 header>span{
  color:var(--icode-copper)!important;
}
.page-v2>p,
.page-v1>p{
  color:#70665e!important;
}

/* Generic dark panels left by earlier iterations. */
main [style*="background:#0"],
main [style*="background: #0"]{
  border-color:rgba(36,27,20,.10);
}

/* ----------------------------- FOOTER ----------------------------- */
.v2-footer{
  background:
    radial-gradient(circle at 0 0,rgba(184,116,69,.09),transparent 32%),
    #e8dfd4!important;
  color:#171310!important;
  border-color:rgba(36,27,20,.10)!important;
}
.v2-footer>section,
.footer-bottom{border-color:rgba(36,27,20,.10)!important}
.v2-footer h2,
.footer-grid b{color:#171310!important}
.footer-grid>div,
.footer-bottom,
.footer-grid p{color:#70665e!important}
.footer-grid a{color:#51463d!important}
.footer-grid a:hover,
.v2-footer>section a{color:#9c5c34!important}

/* -------------------------- MICRO DETAILS ------------------------- */
a{transition:color .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease}
hr{border-color:rgba(36,27,20,.10)!important}

*{
  scrollbar-color:rgba(184,116,69,.48) #ebe3da!important;
}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-track{background:#ebe3da!important}
*::-webkit-scrollbar-thumb{
  background:rgba(184,116,69,.42)!important;
  border-radius:999px;
  border:2px solid #ebe3da!important;
}
::selection{
  background:#b87445!important;
  color:#fff!important;
}

/* WhatsApp remains familiar and instantly recognizable. */
.floating-whatsapp{
  box-shadow:0 17px 42px rgba(34,108,69,.18)!important;
}

/* ------------------------------ MOBILE ---------------------------- */
@media(max-width:920px){
  .cinema-header{
    background:rgba(247,243,238,.94)!important;
  }
}
@media(max-width:700px){
  body{
    background:
      radial-gradient(circle at 100% 0,rgba(184,116,69,.12),transparent 26%),
      #f3f0ec!important;
  }
  .v5-hero{
    background:transparent!important;
  }
  .v5-hero h1{color:#171310!important}
  .v66-work-card,
  .v63-work-feature{
    box-shadow:0 24px 60px rgba(63,44,31,.13)!important;
  }
  .v66-work-ghost{
    opacity:.52!important;
  }
}