/* Breathtaking Lagoon v6.0.7 — premium AI category hero artwork */
.cc-ai-hero{
  position:relative;
  overflow:hidden;
  padding:62px 20px;
  background:
    radial-gradient(circle at 12% 10%,rgba(29,158,117,.24),transparent 34%),
    linear-gradient(125deg,#041d20 0%,#075f52 62%,#0b8875 100%);
}
.cc-ai-hero::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(110deg,rgba(0,0,0,.16),transparent 50%);
}
.cc-ai-hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  align-items:center;
  gap:clamp(30px,5vw,68px);
}
.cc-ai-hero-copy{min-width:0}
.cc-ai-hero .cc-ai-hero-copy h1{
  max-width:720px;
  font-size:clamp(2.45rem,5vw,4.7rem);
}
.cc-ai-hero .cc-ai-hero-copy p{max-width:680px}
.cc-ai-hero-media{
  position:relative;
  width:100%;
  margin:0;
  overflow:hidden;
  aspect-ratio:3/2;
  border:1px solid rgba(255,255,255,.28);
  border-radius:26px;
  background:#083b35;
  box-shadow:0 28px 64px rgba(0,18,19,.36),0 0 0 7px rgba(255,255,255,.06);
}
.cc-ai-hero-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(150deg,rgba(255,255,255,.11),transparent 34%,rgba(0,35,34,.08));
}
.cc-ai-hero-media img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
html[data-theme="night"] .cc-ai-hero{
  background:
    radial-gradient(circle at 12% 10%,rgba(29,158,117,.16),transparent 34%),
    linear-gradient(125deg,#020f10 0%,#063d35 62%,#075f52 100%);
}
html[data-theme="night"] .cc-ai-hero-media{
  border-color:rgba(142,247,219,.25);
  box-shadow:0 30px 70px rgba(0,0,0,.46),0 0 0 7px rgba(142,247,219,.04);
}
@media(max-width:900px){
  .cc-ai-hero{padding:34px 20px 46px}
  .cc-ai-hero-grid{grid-template-columns:1fr;gap:28px}
  .cc-ai-hero-media{order:-1;max-width:760px;justify-self:center}
  .cc-ai-hero .cc-ai-hero-copy h1{max-width:800px}
}
@media(max-width:620px){
  .cc-ai-hero{padding:22px 16px 36px!important}
  .cc-ai-hero-grid{gap:22px}
  .cc-ai-hero-media{border-radius:18px;box-shadow:0 18px 44px rgba(0,18,19,.34),0 0 0 4px rgba(255,255,255,.05)}
  .cc-ai-hero .cc-ai-hero-copy h1{font-size:clamp(2rem,10vw,2.7rem)!important}
}
@media print{.cc-ai-hero-media{display:none}.cc-ai-hero-grid{display:block}}
