/* =========================================================
   RACHANATMAK — OCEAN MIST PREMIUM HOME CSS
   Pink + Ocean Mist Cinematic Background
========================================================= */

:root {

  --summer-sun: #E1B053;
  --oranges: #CD6200;
  --sand: #E3D6AD;
  --sky-blue: #93C3DB;
  --blood-orange: #CD5000;

  --mist-blue: #c9e7f2;
  --mist-sky: #d8eef7;
  --mist-lilac: #e5dcf7;
  --mist-pink: #f3d7ea;
  --mist-rose: #f8dceb;
}

/* =========================================================
   HERO
========================================================= */

.hero {

  position: relative;

  overflow: hidden;

  isolation: isolate;
}


/* =====================================================
   HERO VIDEO BACKGROUND
===================================================== */

.hero-left{

    position:relative;

    overflow:hidden;
}

.hero-bg-video {

    position: absolute !important;

    top: 0 !important;
    left: 0 !important;

    width: 100% !important;
    height: 100% !important;

    object-fit: cover !important;

    z-index: 0 !important;

    opacity: 0.45 !important;

    pointer-events: none !important;
}
.gradient-overlay {

    position: absolute;

    inset: 0;

    background:
      rgba(255,255,255,0.55);

    z-index: 1;
}
/* CONTENT ABOVE VIDEO */

.hero-eyebrow,
.hero-title,
.hero-desc,
.hero-services,
.hero-cta{

    position:relative;

    z-index:2;
}

/* =========================================================
   CONTENT ABOVE EFFECT
========================================================= */

.hero-left {

    position: relative;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    justify-content: flex-end;

    padding: 120px 48px 60px;

    min-height: 100vh;
}
/* =========================================================
   TITLE
========================================================= */

.hero-title {

  color: #CD5000 !important;

  opacity: 1 !important;

  filter: none !important;

  text-shadow:
    5px 5px 0 rgba(147,195,219,0.92);
}

/* =========================================================
   TEXT
========================================================= */

.hero-desc,
.hero-eyebrow,
.hero-services,
.hero-cta,
.hero-cta a {

  color: #6b5b4d !important;

  opacity: 1 !important;
}

/* =========================================================
   MOBILE
========================================================= */

@media (max-width: 700px) {

  .home-gradient-blob1,
  .home-gradient-blob2,
  .home-gradient-blob3 {

    min-width: 120px;
    min-height: 120px;
  }
}
/* =====================================================
   ARTIST INTRO SECTION
===================================================== */

.artist-section{

    display:grid;

    grid-template-columns:
      0.95fr 1.05fr;

    gap:80px;

    align-items:center;

    padding:
      120px 8vw;

    position:relative;

   background: #E1B053;

background-size: cover;
background-position: center;
background-repeat: no-repeat;

    overflow:hidden;
}

/* IMAGE */

.artist-image-wrap{

    position:relative;

    overflow:hidden;

    border-radius:6px;

    box-shadow:
      0 20px 60px rgba(0,0,0,0.08);
}

.artist-image{

    width:100%;

    display:block;

    object-fit:cover;

    transition:
      transform 1.2s ease,
      filter 1.2s ease;
}

.artist-image-wrap:hover .artist-image{

    transform:scale(1.03);

    filter:saturate(1.04);
}

/* CONTENT */

.artist-content{

    max-width:620px;

    position:relative;

    z-index:2;
}

.artist-eyebrow{

    font-size:12px;

    letter-spacing:4px;

    text-transform:uppercase;

    color:#1b1b1b;

    margin-bottom:24px;

    opacity:0.75;
}

.artist-title{

    font-size:clamp(2.8rem,4.6vw,5.2rem);

    line-height:1.02;

    font-weight:600;

    color:#111111;

    margin-bottom:34px;

    max-width:720px;
}

.artist-description{

    font-size:1.08rem;

    line-height:1.95;

    color:#151515;

    margin-bottom:42px;

    max-width:620px;

    font-weight:400;
}

/* BUTTON */

.artist-button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:
      16px 34px;

    border:
      1px solid #CD6200;

    color:#CD6200;

    text-decoration:none;

    letter-spacing:2px;

    font-size:0.82rem;

    transition:
      all 0.35s ease;

    background:
      rgba(255,255,255,0.5);

    backdrop-filter: blur(8px);
}

.artist-button:hover{

    background:#CD6200;

    color:#fff;

    transform:
      translateY(-2px);
}

/* =====================================================
   OCEAN MIST BACKGROUND
===================================================== */

.artist-section::before{

    content:"";

    position:absolute;

    inset:0;

    z-index:0;

    background:

      radial-gradient(
        circle at 15% 20%,
        rgba(147,195,219,0.10),
        transparent 42%
      ),

      radial-gradient(
        circle at 85% 70%,
        rgba(243,215,234,0.12),
        transparent 45%
      ),

      radial-gradient(
        circle at 50% 50%,
        rgba(229,220,247,0.08),
        transparent 50%
      );
}

/* =====================================================
   PORTFOLIO TITLE
===================================================== */

.featured-head h2{

    font-size:clamp(4rem,7vw,6.8rem);

    color:#2f1d13;

    font-weight:800;

    letter-spacing:-0.05em;

    text-transform:none;

    line-height:0.95;

    font-family:
      "Inter",
      "Helvetica Neue",
      sans-serif;

    margin:0 0 28px 0;
}

/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 900px){

    .artist-section{

        grid-template-columns:1fr;

        gap:50px;

        padding:
          80px 7vw;
    }

    .artist-title{

        font-size:2.4rem;
    }

    .artist-description{

        font-size:1rem;
    }
}