/* ==========================================================================
   皮肤 · 包豪斯 BAuhaus
   --------------------------------------------------------------------------
   取自参考视频「下载 (2).mp4」的那一帧（1920×1080）：
     奶油纸 #ECE5D3（88.6%）/ 朱红 #E6371E（7.5%）/ 墨黑 #141414（1.9%）
   规则：只用这三种颜色；只用圆、方、三角三个基本形；
         全部硬边、粗线、零圆角、零阴影、零倾斜；靠负空间和字号对比说话。
   挂载方式：<html data-theme="bauhaus">，必须排在 site.css 之后。
   ========================================================================== */

:root[data-theme="bauhaus"] {
  --bh-cream: #ece5d3;
  --bh-red: #e6371e;
  --bh-black: #141414;

  /* 把原站五色映射到三色：所有"底色"变奶油，"重色"变墨黑，"强调色"变朱红 */
  --sky: #ece5d3;
  --paper: #ece5d3;
  --butter: #ece5d3;
  --ink: #141414;
  --pink: #e6371e;
  --rose: #e6371e;
  --wine: #e6371e;

  --ease: cubic-bezier(.2, .8, .2, 1);
}

[data-theme="bauhaus"] body { background: var(--bh-cream); }

[data-theme="bauhaus"] :focus-visible {
  outline: 3px solid var(--bh-red);
  outline-offset: 4px;
}

/* ---------- 硬边：拆掉所有圆角、倾斜、阴影 ---------- */
[data-theme="bauhaus"] .brand,
[data-theme="bauhaus"] .brand:hover,
[data-theme="bauhaus"] .menu__link--cta,
[data-theme="bauhaus"] .btn,
[data-theme="bauhaus"] .btn:hover,
[data-theme="bauhaus"] .chips li,
[data-theme="bauhaus"] .copybtn,
[data-theme="bauhaus"] .art__tag,
[data-theme="bauhaus"] .curtain__meta,
[data-theme="bauhaus"] .curtain__count,
[data-theme="bauhaus"] .curtain__skip,
[data-theme="bauhaus"] .cursor span,
[data-theme="bauhaus"] .toast {
  transform: none;
  border-radius: 0;
}

[data-theme="bauhaus"] .art__frame {
  box-shadow: none;
  border-width: 6px;
}

[data-theme="bauhaus"] .display em {
  color: var(--bh-red);
  text-shadow: none;
}

/* 联系区整块是朱红，强调字必须反过来用奶油色，否则红上加红 */
[data-theme="bauhaus"] .display--light em {
  color: var(--bh-cream);
  text-shadow: none;
}

[data-theme="bauhaus"] .curtain__title span {
  color: var(--bh-cream);
  text-shadow: 6px 6px 0 var(--bh-red);
}

/* ---------- 字体：更紧、更黑、更响 ---------- */
[data-theme="bauhaus"] .display,
[data-theme="bauhaus"] .hero__title,
[data-theme="bauhaus"] .row__name,
[data-theme="bauhaus"] .acc__title {
  letter-spacing: -.035em;
  font-weight: 800;
}

[data-theme="bauhaus"] .kicker {
  color: var(--bh-black);
  letter-spacing: .14em;
  gap: 10px;
}
[data-theme="bauhaus"] .kicker b {
  font-size: 1.9rem;
  line-height: 1;
  color: var(--bh-red);
  letter-spacing: -.02em;
}
[data-theme="bauhaus"] .kicker--light { color: var(--bh-cream); }
[data-theme="bauhaus"] .kicker--light b { color: var(--bh-cream); }

/* 顶栏 / 页脚 / 跑马灯 / 流程带：墨黑横条，靠色块切分版面 */
[data-theme="bauhaus"] .ticker { border-block: 3px solid var(--bh-black); }
[data-theme="bauhaus"] .ticker__run i { color: var(--bh-red); }

[data-theme="bauhaus"] .topbar { border-bottom: 3px solid var(--bh-black); }
[data-theme="bauhaus"] .topbar.is-stuck {
  background: rgba(236, 229, 211, .96);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
[data-theme="bauhaus"] .menu__link:hover,
[data-theme="bauhaus"] .menu__link[aria-current="true"] { color: var(--bh-red); }
[data-theme="bauhaus"] .menu__link--cta {
  background: var(--bh-black);
  color: var(--bh-cream);
  padding: 9px 14px;
}
[data-theme="bauhaus"] .menu__link--cta:hover,
[data-theme="bauhaus"] .menu__link--cta[aria-current="true"] {
  background: var(--bh-red);
  color: var(--bh-cream);
}

[data-theme="bauhaus"] .brand { background: var(--bh-black); color: var(--bh-cream); }
[data-theme="bauhaus"] .brand:hover { background: var(--bh-red); }
[data-theme="bauhaus"] .brand__dot { color: var(--bh-red); }
[data-theme="bauhaus"] .brand:hover .brand__dot { color: var(--bh-cream); }

/* ---------- 按钮：实心块，没有影子 ---------- */
[data-theme="bauhaus"] .btn {
  background: var(--bh-black);
  color: var(--bh-cream);
  border: 3px solid var(--bh-black);
}
[data-theme="bauhaus"] .btn:hover {
  background: var(--bh-red);
  border-color: var(--bh-red);
  color: var(--bh-cream);
}
[data-theme="bauhaus"] .ghostlink:hover { color: var(--bh-red); }

[data-theme="bauhaus"] .chips li {
  background: transparent;
  color: var(--bh-black);
  border: 2px solid var(--bh-black);
  font-weight: 700;
}

/* ---------- 章节分隔：粗线 + 留白，不再用整块换色 ---------- */
[data-theme="bauhaus"] .services,
[data-theme="bauhaus"] .skills,
[data-theme="bauhaus"] .flow {
  border-top: 3px solid var(--bh-black);
}

[data-theme="bauhaus"] .rows,
[data-theme="bauhaus"] .rows__item { border-color: var(--bh-black); }
[data-theme="bauhaus"] .rows { border-top-width: 4px; }
[data-theme="bauhaus"] .rows__item { border-bottom-width: 3px; }
[data-theme="bauhaus"] .row__idx,
[data-theme="bauhaus"] .acc__idx { color: var(--bh-red); opacity: 1; font-weight: 700; }

[data-theme="bauhaus"] .acc__btn:hover {
  background: var(--bh-red);
  color: var(--bh-cream);
}
[data-theme="bauhaus"] .acc__plus { background: var(--bh-black); color: var(--bh-cream); }
[data-theme="bauhaus"] .acc__item.is-open .acc__plus {
  background: var(--bh-red);
  color: var(--bh-cream);
}

/* ---------- 首屏插画：朱红正圆 + 硬边方框 + 墨黑方块 ---------- */
[data-theme="bauhaus"] .art__slab {
  --rest: rotate(0deg);
  background: var(--bh-red);
  left: -1%;
  top: 16%;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
  border-radius: 50%;
}
[data-theme="bauhaus"] .art__ring { display: none; }
[data-theme="bauhaus"] .art__cube {
  --rest: rotate(0deg);
  background: var(--bh-black);
  border-radius: 0;
}
[data-theme="bauhaus"] .art__pip {
  background: var(--bh-red);
  border: 5px solid var(--bh-black);
  left: 4%;
  bottom: 2%;
  width: clamp(44px, 13%, 76px);
}
[data-theme="bauhaus"] .art__frame { --rest: rotate(0deg); }
[data-theme="bauhaus"] .art__tag {
  background: var(--bh-black);
  color: var(--bh-cream);
}
[data-theme="bauhaus"] .art__tag span { color: var(--bh-cream); }
[data-theme="bauhaus"] .art__badge { display: none; }
/* 竖排的 PORTFOLIO 标记在包豪斯里没有位置：正面、正交才是它要的 */
[data-theme="bauhaus"] .hero__stamp { display: none; }

/* ---------- 关于：右上角一个朱红正圆（呼应参考帧的红圆） ---------- */
[data-theme="bauhaus"] .about {
  background: var(--bh-cream);
  border-top: 8px solid var(--bh-black);
}
[data-theme="bauhaus"] .about::before {
  width: clamp(140px, 24vw, 330px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--bh-red);
  transform: translate(24%, -34%);
}
[data-theme="bauhaus"] .facts { border-color: var(--bh-black); }
[data-theme="bauhaus"] .facts > * { border-color: rgba(20, 20, 20, .28); }

/* ---------- 联系：奶油圆压在朱红块上 ---------- */
[data-theme="bauhaus"] .contact {
  background: var(--bh-red);
  color: var(--bh-cream);
  border-top: 8px solid var(--bh-black);
}
[data-theme="bauhaus"] .contact::after {
  content: "";
  right: -8%;
  top: -22%;
  width: clamp(180px, 32vw, 440px);
  aspect-ratio: 1 / 1;
  border-radius: 50%;
  background: var(--bh-cream);
  opacity: .18;
  font-size: 0;
  line-height: 0;
}
[data-theme="bauhaus"] .mail {
  color: var(--bh-cream);
  background-image: linear-gradient(var(--bh-cream), var(--bh-cream));
}
[data-theme="bauhaus"] .mail:hover { color: var(--bh-black); background-image: linear-gradient(var(--bh-black), var(--bh-black)); }
[data-theme="bauhaus"] .copybtn {
  background: var(--bh-cream);
  color: var(--bh-red);
  border: 3px solid var(--bh-cream);
}
[data-theme="bauhaus"] .copybtn:hover { background: var(--bh-black); color: var(--bh-cream); border-color: var(--bh-black); }
[data-theme="bauhaus"] .copybtn.is-done { background: var(--bh-black); color: var(--bh-cream); border-color: var(--bh-black); }
[data-theme="bauhaus"] .tel { color: var(--bh-cream); border-color: var(--bh-cream); }
[data-theme="bauhaus"] .tel:hover { background: var(--bh-cream); color: var(--bh-red); }
[data-theme="bauhaus"] .note--light { color: rgba(236, 229, 211, .82); }

/* ---------- 进度条 / 指针标签 ---------- */
[data-theme="bauhaus"] .ruler i { background: var(--bh-red); }
[data-theme="bauhaus"] .cursor span {
  background: var(--bh-black);
  color: var(--bh-cream);
  border-radius: 0;
}
[data-theme="bauhaus"] .toast {
  background: var(--bh-black);
  color: var(--bh-cream);
  border-radius: 0;
}

/* ---------- 开场：星换成正圆，颜色只留朱红 ---------- */
[data-theme="bauhaus"] .curtain { background: var(--bh-cream); color: var(--bh-black); }
[data-theme="bauhaus"] .curtain__star { color: var(--bh-red); }
[data-theme="bauhaus"] .curtain__sky { background: var(--bh-black); }

@media (max-width: 720px) {
  [data-theme="bauhaus"] .kicker b { font-size: 1.5rem; }
  [data-theme="bauhaus"] .about::before { transform: translate(30%, -30%); }
}

/* --- 字体 --- */
:root[data-theme="bauhaus"] {
  --sans: "Jost", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC", sans-serif;
  --display: "Jost", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC", sans-serif;
}
