/* ═══════════════════════════════════════════════════
   ARTCORE WEBSYSTEMS – CONTENT LAYOUTS
   Hero, Sections, Cards, Accordion, Marquee, Rotator
   ═══════════════════════════════════════════════════ */

/* ─── HERO ─── */
.hero{
  min-height:100vh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  position:relative;padding:2rem;
}
.hero-logo{
  width:clamp(240px,30vw,400px);
  margin-bottom:2.5rem;
  opacity:0;animation:fadeUp 1s ease forwards;
  transition:filter var(--t);
}
[data-theme="dark"] .hero-logo{
  filter:brightness(.25) contrast(1.3) saturate(0);
}
.hero-title{
  font-size:clamp(2.8rem,5.5vw,5.2rem);
  opacity:0;animation:fadeUp 1s .2s ease forwards;
}
.hero-sub{
  font-size:clamp(1rem,2vw,1.6rem);
  margin-top:.15rem;
  opacity:0;animation:fadeUp 1s .4s ease forwards;
}

/* ─── SPLIT: ACCORDION + CONTENT ─── */
.split-section{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4rem;
  max-width:1100px;
  margin:0 auto;
  padding:6rem 3rem;
  align-items:start;
}

/* Accordion */
.accordion-side{display:flex;flex-direction:column;gap:0}
.accordion-item{
  border-top:1px solid var(--accent-line);
  padding:1.4rem 0;cursor:pointer;
  transition:all .3s ease;
}
.accordion-item:last-child{border-bottom:1px solid var(--accent-line)}
.accordion-header{
  font-family:'Rajdhani',sans-serif;
  font-weight:500;font-size:.82rem;letter-spacing:.15em;
  color:var(--text);
  display:flex;justify-content:space-between;align-items:center;
  transition:color var(--t);
}
.accordion-header:hover{color:var(--text-heading)}
.accordion-header .engraved-text{
  color:var(--text);
  text-shadow:0 1px 0 var(--engraved-light),0 -1px 0 var(--engraved-dark);
}
.accordion-header:hover .engraved-text{color:var(--text-heading)}
.accordion-arrow{font-size:.7rem;transition:transform .3s ease;color:var(--text-muted)}
.accordion-item.open .accordion-arrow{transform:rotate(180deg)}
.accordion-body{
  max-height:0;overflow:hidden;
  transition:max-height .4s cubic-bezier(.4,0,.2,1), padding .4s ease;
  font-size:.88rem;line-height:1.8;color:var(--text);
}
.accordion-item.open .accordion-body{max-height:300px;padding-top:1rem}

/* Content side (badge + text) */
.content-side{display:flex;flex-direction:column;gap:1.4rem}
.badge-row{display:flex;align-items:center;gap:1.2rem}
.badge-icon{
  width:70px;height:70px;
  background:radial-gradient(circle at 35% 35%,#d4a830,#8b6914 70%);
  border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-family:'Rajdhani',sans-serif;font-weight:700;font-size:1.6rem;
  color:#fff;
  box-shadow:2px 2px 8px rgba(0,0,0,.3),
             inset 0 -2px 4px rgba(0,0,0,.2),
             inset 0 2px 4px rgba(255,255,255,.2);
  flex-shrink:0;line-height:1;
}
.badge-icon small{font-size:.5rem;display:block;font-weight:400;letter-spacing:.1em}
.badge-title{
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
  font-weight:700;font-size:clamp(1.4rem,2.5vw,2rem);
  letter-spacing:.15em;text-transform:uppercase;
  color:var(--text-heading);transition:color var(--t);
}
.content-text{font-size:.92rem;line-height:1.85;color:var(--text);transition:color var(--t)}

/* ─── GENERIC SECTION ─── */
.section{
  min-height:80vh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:6rem 2rem;max-width:900px;margin:0 auto;text-align:center;
}
.section-label{
  font-family:'Rajdhani',sans-serif;font-weight:600;font-size:.78rem;
  letter-spacing:.4em;color:var(--text-muted);margin-bottom:2rem;
  opacity:0;transform:translateY(30px);transition:color var(--t);
}
.section-label.visible{animation:fadeUp .7s ease forwards}
.section-text{
  font-size:.95rem;line-height:1.9;color:var(--text);max-width:680px;
  opacity:0;transform:translateY(30px);transition:color var(--t);
}
.section-text.visible{animation:fadeUp .7s .2s ease forwards}

/* ─── CARDS ─── */
.cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:2.2rem;max-width:1000px;margin:4rem auto;padding:0 3rem;
}
.card{padding:2.6rem 2.2rem;text-align:center;opacity:0;transform:translateY(40px)}
.card.visible{animation:fadeUp .6s ease forwards}
.card:nth-child(2).visible{animation-delay:.12s}
.card:nth-child(3).visible{animation-delay:.24s}
.card-title{
  font-family:'Rajdhani',sans-serif;font-weight:600;font-size:.72rem;
  letter-spacing:.28em;margin-bottom:1.2rem;transition:color var(--t);
}
.card-text{font-size:.88rem;line-height:1.8;color:var(--text);transition:color var(--t)}

/* ─── MARQUEE ─── */
.marquee-wrap{width:100%;overflow:hidden;padding:3rem 0;position:relative}
.marquee-wrap::before,.marquee-wrap::after{
  content:'';position:absolute;top:0;width:140px;height:100%;z-index:2;pointer-events:none;
}
.marquee-wrap::before{left:0;background:linear-gradient(90deg,var(--bg),transparent)}
.marquee-wrap::after{right:0;background:linear-gradient(270deg,var(--bg),transparent)}
.marquee-track{display:flex;gap:3rem;animation:marquee 28s linear infinite;width:max-content}
.marquee-word{
  font-family:'Rajdhani',sans-serif;font-weight:300;font-size:.78rem;
  letter-spacing:.35em;white-space:nowrap;
  color:var(--engraved-color);
  text-shadow:0 1px 0 var(--engraved-light),0 -1px 0 var(--engraved-dark);
  transition:all var(--t);
}
.marquee-dot{color:var(--text-muted);font-size:.45rem;align-self:center;transition:color var(--t)}

/* ─── ROTATING WORDS ─── */
.rotate-label{
  font-family:'Rajdhani',sans-serif;font-weight:600;font-size:.75rem;
  letter-spacing:.4em;color:var(--text-muted);margin-bottom:.8rem;transition:color var(--t);
}
.rotate-container{height:3.2rem;overflow:hidden;position:relative}
.rotate-word{
  font-family:Inter,"Helvetica Neue",Arial,sans-serif;
  font-weight:700;font-size:clamp(1.4rem,2.8vw,2.2rem);
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--emboss-color);
  text-shadow:2px 2px 4px var(--emboss-shadow1),4px 4px 10px var(--emboss-shadow2);
  position:absolute;width:100%;text-align:center;
  opacity:0;transform:translateY(100%);
  transition:all .5s cubic-bezier(.4,0,.2,1);
}
.rotate-word.active{opacity:1;transform:translateY(0)}
.rotate-word.exit{opacity:0;transform:translateY(-100%)}

/* ─── STATEMENT (big centered text) ─── */
.statement{
  min-height:60vh;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  padding:5rem 2rem;text-align:center;
}
.statement-big{
  font-size:clamp(2.2rem,5.5vw,4.5rem);line-height:1.15;
  opacity:0;transform:translateY(40px);
}
.statement-big.visible{animation:fadeUp .8s ease forwards}
.statement-sub{
  font-size:.95rem;line-height:1.9;color:var(--text);max-width:700px;margin-top:2rem;
  opacity:0;transform:translateY(30px);transition:color var(--t);
}
.statement-sub.visible{animation:fadeUp .8s .2s ease forwards}

/* ─── Responsive ─── */
@media(max-width:900px){
  .cards{padding:0 1.5rem;gap:1.5rem}
}
