/*
Theme Name: FH Site lily-wang
Template: fh-base
Version: 1.0.0
Description: Child-Theme lily-wang.com — Lilys Entwurf (personal-site, Stand 2026-10-03) als Block-Theme: Startseite, Services, Kontaktformular, Rechtsseiten.
*/

/* Quelle der Gestaltung: Lilys statischer Entwurf personal-site/assets/site.css (Stand 2026-10-03).
   Abweichungen fuer WordPress stehen in den Bloecken "WordPress" (oben) und "Ergaenzungen" (unten);
   dazwischen ist der Entwurf unveraendert bis auf: .stagger statt [data-stagger] (Core-Bloecke tragen
   kein data-*), .lw-footer statt footer, Pfad des Hero-Standbilds, Pfeile der Leistungslisten per CSS. */

/* ---------- Schriften (selbst gehostet, kein Abruf bei Google; OFL) ---------- */
@font-face{font-family:"Manrope";font-style:normal;font-weight:300 800;font-display:swap;src:url(assets/fonts/manrope-300-800.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Spectral";font-style:italic;font-weight:400;font-display:swap;src:url(assets/fonts/spectral-400-italic.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Spectral";font-style:italic;font-weight:500;font-display:swap;src:url(assets/fonts/spectral-500-italic.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Spectral";font-style:normal;font-weight:600;font-display:swap;src:url(assets/fonts/spectral-600.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family:"Spectral";font-style:normal;font-weight:700;font-display:swap;src:url(assets/fonts/spectral-700.woff2) format("woff2");unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

/* ---------- WordPress: Core- und fh-base-Abstaende neutralisieren ---------- */
.wp-site-blocks>*{margin-block-start:0;}
.fh-main{padding-block:0;}
.fh-main :where(.is-layout-flow)>*{margin-block-start:0;margin-block-end:0;}
.fh-main .wp-block-image{margin:0;}
.fh-main :where(.wp-block-list){margin:0;}

:root{
  /* Neutral paper body. Red = China, pine = Europe, brass = the only colour that bridges them.
     Never blend red into green inside one object (the midpoint turns to mud). */
  /* v9 palette: white + cream, red, gold, warm ink (the hero pins its own values below) */
  --bg:#FFFFFF; --bg-2:#FFFFFF; --bg-3:#FFF9F0; --cream-deep:#FAEFD9;
  --ink:#2B201A; --ink-soft:#5A4A42; --ink-faint:#75665E;
  --line:#EDE9E4; --line-2:#E0D9D1; --line-gold:rgba(201,152,95,.4);
  --red:#C9342E; --red-deep:#A12826; --red-darker:#6E1A1A; --red-tint:#FBEAE6;
  --gold:#C9985F; --gold-bright:#D4A24C; --gold-soft:#EFD9B0; --gold-tint:#FAEFD9; --gold-ink:#85622B;
  --teal:#1C6B60; /* hero only: the Europe label */
  --grad-warm:linear-gradient(120deg,#A12826 0%,#C9342E 30%,#D4A24C 100%); /* v9 --grad-text-warm, the one text gradient */
  --grad-line:linear-gradient(90deg,#C9342E 0%,#C9985F 100%);
  --grad-red:linear-gradient(160deg,#6E1A1A 0%,#A12826 50%,#C9342E 100%);
  --grad-ink:linear-gradient(160deg,#2B201A 0%,#45342A 100%);
  --display:"Spectral",Georgia,"Times New Roman",serif; --sans:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease:cubic-bezier(.22,1,.36,1); --maxw:78rem; --gutter:clamp(1.25rem,4vw,3rem);
  --radius:1.25rem;
  --lift:0 1px 2px rgba(40,30,20,.05),0 18px 40px -24px rgba(40,30,20,.28);
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:5rem;scrollbar-color:#D9CFC4 var(--bg);}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:1rem;font-weight:400;line-height:1.7;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
h1,h2,h3{margin:0;font-family:var(--display);font-weight:600;line-height:1.15;letter-spacing:-.005em;text-wrap:balance;}
p{margin:0;text-wrap:pretty;}
img{max-width:100%;display:block;}
a{color:inherit;}
::selection{background:var(--red);color:#fff;}
:focus-visible{outline:2px solid var(--red);outline-offset:3px;}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.ico{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);}

/* ---------- buttons ---------- */
.btn{font-family:var(--sans);font-weight:700;font-size:.92rem;text-decoration:none;white-space:nowrap;display:inline-flex;align-items:center;gap:.65rem;
  padding:.6rem .62rem .6rem 1.3rem;border-radius:100px;border:1.5px solid var(--line-2);color:var(--ink);background:var(--bg-2);cursor:pointer;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .3s,border-color .3s,color .3s;}
.btn .ic{width:1.9rem;height:1.9rem;border-radius:50%;background:rgba(34,31,27,.07);display:inline-flex;align-items:center;justify-content:center;transition:transform .45s var(--ease);}
.btn .ic svg{width:1rem;height:1rem;}
.btn:hover .ic{transform:translateX(3px);}
.btn:active{transform:scale(.98);}
.btn.solid{background:var(--red-deep);border-color:transparent;color:#fff;}
.btn.solid:hover{background:var(--red-darker);transform:translateY(-2px);box-shadow:0 14px 28px -16px rgba(30,22,16,.55);}
.btn.solid .ic{background:rgba(255,255,255,.2);}
.btn.ghost{padding:.66rem 1.3rem;}
.btn.ghost:hover{border-color:var(--ink-faint);transform:translateY(-2px);}

#progress{position:fixed;top:0;left:0;height:2px;width:100%;transform:scaleX(0);transform-origin:left;z-index:130;background:var(--grad-line);}

/* ---------- nav ---------- */
.nav{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;align-items:center;justify-content:space-between;gap:1rem;
  height:4.4rem;padding-inline:var(--gutter);border-bottom:1px solid transparent;transition:background-color .4s var(--ease),border-color .4s;}
.nav.stuck{background:rgba(255,255,255,.94);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-color:var(--line);}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--ink);}
.brand img{width:2.3rem;height:2.3rem;border-radius:9px;}
.brand .nm{font-family:var(--display);font-weight:700;font-size:1.2rem;letter-spacing:-.01em;}
.nav .links{display:flex;gap:1.5rem;align-items:center;}
.nav .links a:not(.btn){text-decoration:none;font-weight:600;font-size:.9rem;color:var(--ink-soft);transition:color .25s;}
.nav .links a:not(.btn):hover{color:var(--ink);}
.nav .links a[aria-current="page"]{color:var(--red-deep);}
@media(max-width:860px){.nav .links a:not(.btn){display:none;}}
@media(max-width:340px){.brand .nm{display:none;}}

/* ---------- reveal (only when JS runs, so content never hides without it) ---------- */
.js .reveal{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.js .reveal.in{opacity:1;transform:none;}
.js .stagger.reveal{opacity:1;transform:none;}
.js .stagger > *{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease),transform .7s var(--ease);}
.js .stagger.in > *{opacity:1;transform:none;}
.js .stagger.in > *:nth-child(2){transition-delay:.08s;}
.js .stagger.in > *:nth-child(3){transition-delay:.16s;}
.js .stagger.in > *:nth-child(4){transition-delay:.24s;}
@media (prefers-reduced-motion:reduce){.js .reveal,.js .stagger > *{opacity:1;transform:none;transition:none;}}

/* ---------- section rhythm ---------- */
.band{padding-block:clamp(3.8rem,9vh,6.5rem);}
.band.alt{background:var(--bg-3);}
.band.white{background:var(--bg-2);}
.band.rule{border-top:1px solid var(--line);}
.b-head{max-width:44rem;margin-bottom:clamp(2rem,4vw,3rem);}
.b-head h2{font-size:clamp(1.85rem,3vw,2.5rem);line-height:1.12;letter-spacing:-.018em;}
/* v9: key words in section titles are Spectral italic in the red-to-gold gradient */
h2 em{font-style:italic;font-weight:500;padding-inline-end:.06em;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}
.b-head p{color:var(--ink-soft);margin-top:1.1rem;font-size:1rem;line-height:1.75;max-width:38rem;}
.b-head.split{max-width:none;display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(1.5rem,5vw,5rem);align-items:end;}
.b-head.split p{margin-top:0;}
/* v9 centred section header: label with a line either side, one-line title, two-line intro */
.b-head.v9{max-width:none;text-align:center;margin-bottom:clamp(2.6rem,5vw,3.75rem);}
.b-head.v9 .eyebrow{display:inline-flex;align-items:center;gap:1rem;margin:0 0 1.1rem;font-size:.84rem;font-weight:600;letter-spacing:.08em;color:var(--ink-soft);}
.b-head.v9 .eyebrow::before,.b-head.v9 .eyebrow::after{content:"";width:2.6rem;height:1px;background:var(--grad-line);}
.b-head.v9 .eyebrow::after{background:linear-gradient(90deg,var(--gold),var(--red));}
.b-head.v9 p{max-width:58rem;margin-inline:auto;text-wrap:balance;}
@media(min-width:761px){.b-head.v9 h2{white-space:nowrap;}}
@media(max-width:820px){.b-head.split{grid-template-columns:1fr;gap:1rem;}}

/* ================= HERO ================= */
.hero{--red:#C0392B;--gold:#A17A22;--ink:#1C1B18;--ink-soft:#565049;--ink-faint:#655F55;--line-2:#D5D2C8;
  position:relative;min-height:max(38rem,100svh);overflow:hidden;background:var(--bg);isolation:isolate;}
.hero-img{position:absolute;inset:0;z-index:-2;background:url(assets/hero/hero-end.webp) center bottom/cover no-repeat;transform:scale(1.04);transition:transform 1.2s var(--ease);}
.hero-img::after{content:"";position:absolute;inset:0;background:
  linear-gradient(180deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.1) 16%,rgba(255,255,255,0) 40%,rgba(255,255,255,0) 64%,rgba(255,255,255,.6) 86%,var(--bg) 100%);}
.hero::before{content:"";position:absolute;left:50%;top:36%;transform:translate(-50%,-50%);z-index:-1;
  width:min(120%,66rem);height:64%;pointer-events:none;
  background:radial-gradient(ellipse at center,rgba(255,255,255,.94),rgba(255,255,255,.6) 46%,transparent 72%);}
/* hero film: plays over the still end frame; overlays and copy arrive once it settles */
.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center bottom;transition:object-position 1.4s var(--ease);}
/* the film opens framed from the top (so the head is whole), then glides to its bottom-anchored framing as the camera pushes in */
.hero-vid.at-top{object-position:center top;transition:none;}
.hero-vid[hidden]{display:none;}
.hero-img::after,.hero::before,.hero-c,.zones,.seam,.hint{transition:opacity .9s var(--ease);}
.js .hero:not(.done) .hero-img::after,.js .hero:not(.done)::before,.js .hero:not(.done) .hero-c,
.js .hero:not(.done) .zones,.js .hero:not(.done) .seam,.js .hero:not(.done) .hint{opacity:0;pointer-events:none;}
.film-meta{position:absolute;right:var(--gutter);bottom:1.1rem;z-index:3;display:flex;align-items:center;gap:.8rem;
  font-size:.72rem;font-weight:600;letter-spacing:.02em;color:var(--ink-faint);}
.replay{font:inherit;color:var(--ink-soft);background:rgba(255,255,255,.75);border:1px solid var(--line-2);border-radius:999px;padding:.3rem .8rem;cursor:pointer;transition:color .25s,border-color .25s;}
.replay:hover{color:var(--ink);border-color:var(--ink-faint);}
.seam{position:absolute;left:50%;top:60%;bottom:9%;width:1px;z-index:1;pointer-events:none;background:linear-gradient(transparent,var(--gold) 30%,var(--gold) 70%,transparent);opacity:.55;}

.zones{position:absolute;inset:0;display:flex;z-index:1;}
.zone{flex:1;position:relative;transition:flex .6s var(--ease);}
.zone::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .6s var(--ease);}
.zone.cn::before{background:linear-gradient(180deg,transparent 40%,rgba(192,57,43,.16));}
.zone.eu::before{background:linear-gradient(180deg,transparent 40%,rgba(28,107,96,.16));}
.zones:hover .zone{flex:.88;} .zone:hover{flex:1.24;} .zone:hover::before{opacity:1;}
.zlab{position:absolute;left:50%;bottom:6%;width:min(88%,21rem);transform:translate(-50%,12px);opacity:0;
  padding:1rem 1.2rem;border-radius:1rem;background:rgba(255,255,255,.88);border:1px solid var(--line-2);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:opacity .5s var(--ease),transform .5s var(--ease);}
.zone:hover .zlab{opacity:1;transform:translate(-50%,0);}
.zlab .t{font-weight:800;font-size:.8rem;letter-spacing:.02em;}
.zone.cn .zlab .t{color:var(--red);} .zone.eu .zlab .t{color:var(--teal);}
.zlab h3{font-size:1.2rem;margin-top:.3rem;color:var(--ink);}
.zlab p{color:var(--ink-soft);font-size:.9rem;line-height:1.5;margin-top:.35rem;}

.hero-c{position:absolute;left:50%;top:19%;transform:translateX(-50%);z-index:2;width:min(96%,70rem);text-align:center;pointer-events:none;}
.hero-c h1{font-size:clamp(2.2rem,3.9vw,3.6rem);line-height:1.08;letter-spacing:-.035em;color:var(--ink);}
.hero-c h1 span{display:block;}
@media(min-width:761px){.hero-c h1 span{white-space:nowrap;}}
.hero-c h1 .g{margin-top:.08em;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;padding-bottom:.06em;}
.hero-c .lede{margin:1.3rem auto 0;color:var(--ink-soft);max-width:34rem;font-size:1.14rem;}
.hero-c .cta{margin-top:1.8rem;display:flex;flex-wrap:wrap;gap:.7rem;justify-content:center;pointer-events:auto;}
.hint{position:absolute;bottom:1.4rem;left:50%;transform:translateX(-50%);z-index:2;color:var(--ink-faint);font-size:.8rem;font-weight:600;letter-spacing:.02em;transition:opacity .4s;}
.zones:hover ~ .hint{opacity:0;}

/* one authored entrance: the headline arrives, then the bridge settles */
@keyframes up{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
.js .hero.done .hero-c h1 span,.js .hero.done .hero-c .lede,.js .hero.done .hero-c .cta{animation:up .9s var(--ease) both;}
.js .hero-c h1 span:nth-child(2){animation-delay:.12s;}
.js .hero-c .lede{animation-delay:.26s;}
.js .hero-c .cta{animation-delay:.38s;}
@media (prefers-reduced-motion:reduce){.js .hero.done .hero-c h1 span,.js .hero.done .hero-c .lede,.js .hero.done .hero-c .cta{animation:none;}.hero-img{transition:none;}}

/* touch and narrow screens: no hover, so the two paths sit visibly under the bridge */
@media (hover:none),(max-width:760px){
  .zones{inset:auto var(--gutter) 1.1rem;display:grid;grid-template-columns:1fr 1fr;gap:.6rem;}
  .zone::before{display:none;}
  .zlab{position:static;width:auto;transform:none;opacity:1;padding:.8rem .9rem;}
  .zlab h3{font-size:1rem;}
  .zlab p,.hint{display:none;}
  .seam{display:none;}
}
@media(max-width:760px){
  .hero{min-height:max(46rem,100svh);}
  .hero-img{inset:auto 0 0 0;height:68%;background-size:auto 100%;background-position:50% 100%;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 32%);mask-image:linear-gradient(180deg,transparent 0,#000 32%);}
  .hero-c{top:6.4rem;}
  .hero-c h1{font-size:clamp(2rem,8.8vw,2.5rem);}
  .hero-c .lede{font-size:1.04rem;}
}

/* ================= SERVICES: v9 umbrella cards ================= */
.umbrella-stack{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,2.2vw,1.75rem);}
.umbrella{position:relative;isolation:isolate;display:flex;flex-direction:column;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:12px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;}
.umbrella::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:2;background:var(--grad-line);transform:scaleX(0);transform-origin:left;transition:transform .35s var(--ease);}
.umbrella:hover{transform:translateY(-5px);box-shadow:0 24px 60px rgba(43,32,26,.1);border-color:transparent;}
.umbrella:hover::before{transform:scaleX(1);}
.u-img{aspect-ratio:5/3;overflow:hidden;background:var(--cream-deep);}
.u-img img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease;}
.umbrella:hover .u-img img{transform:scale(1.04);}
.u-body{flex:1;display:flex;flex-direction:column;padding:clamp(1.8rem,3vw,2.4rem) clamp(1.5rem,3vw,2.3rem) clamp(1.4rem,2.4vw,1.9rem);}
.u-eyebrow{display:inline-flex;align-items:center;gap:14px;margin-bottom:1rem;font-size:.84rem;font-weight:600;letter-spacing:.02em;color:var(--red-deep);}
.u-eyebrow::before{content:"";width:30px;height:1px;background:var(--grad-line);}
.umbrella h3{font-size:clamp(1.65rem,2.4vw,1.85rem);line-height:1.2;letter-spacing:-.018em;margin-bottom:.75rem;}
.umbrella h3 em{font-style:italic;font-weight:500;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;padding-inline-end:.05em;}
.u-tag{font-family:var(--display);font-style:italic;font-size:1.2rem;line-height:1.45;color:var(--red-deep);margin-bottom:1rem;}
.u-desc{font-size:.96rem;line-height:1.75;color:var(--ink-soft);margin-bottom:1.5rem;}
.u-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.u-list li{border-bottom:1px solid var(--line);}
.u-list li:last-child{border-bottom:0;}
.u-list a{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.9rem 0;font-size:.95rem;font-weight:500;color:var(--ink);text-decoration:none;transition:color .25s;}
.u-list a:hover{color:var(--red-deep);}
/* both service lists start on the same line: reserve the longer description's height */
@media(min-width:1200px){.u-desc{min-height:calc(1.75em * 4);}}
@media(min-width:901px) and (max-width:1199px){.u-desc{min-height:calc(1.75em * 5);}}
@media(max-width:900px){.umbrella-stack{grid-template-columns:1fr;}}

/* ================= ABOUT ================= */
/* ABOUT as a full-bleed band: portrait on the right, words on the left (parallax portrait) */
.about-film{position:relative;overflow:clip;isolation:isolate;background:#C7C2C5 linear-gradient(90deg,#C6C1C5 0%,#C6C1C5 42%,#C8C5C6 50%,#CAC7C9 62%,#CAC7CA 70%,#C8C5C8 80%,#C6C4C7 90%,#C2BEC1 100%);display:flex;align-items:center;
  min-height:max(38rem,100svh);padding-block:clamp(4rem,7vw,6rem);
  clip-path:inset(0);} /* clips the fixed photo to this band, so the section above slides off it like a lid */
.af-bg{position:absolute;inset:0;z-index:-1;overflow:hidden;}
/* the photo is pinned to the screen; scrolling uncovers it instead of moving it */
.af-bg picture{display:block;position:fixed;inset:0;width:100%;height:100vh;}
.af-img{display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom;}
.af-bg::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg,rgba(250,248,246,.55) 0%,rgba(250,248,246,.3) 26%,rgba(250,248,246,0) 36%,rgba(250,248,246,0) 64%,rgba(250,248,246,.3) 74%,rgba(250,248,246,.55) 100%);}
/* the portrait stands in the middle column; its width tracks how large the photo renders (cover), so words never overlap her */
.af-inner{width:100%;display:grid;grid-template-columns:minmax(0,1fr) max(32vw,68svh) minmax(0,1fr);align-items:center;padding-inline:var(--gutter);}
.af-col{max-width:30rem;width:100%;}
.af-right{max-width:37rem;}
.af-left{grid-column:1;justify-self:end;}
.af-right{grid-column:3;justify-self:start;}
.af-kicker{font-size:.84rem;font-weight:700;letter-spacing:.02em;color:var(--red-deep);margin-bottom:.9rem;}
.about-film h2 em{background:linear-gradient(120deg,#8E2220 0%,#C9342E 45%,#94651E 100%);-webkit-background-clip:text;background-clip:text;color:transparent;}
.about-film .lead{color:var(--ink);}
.about-film h2 em{display:block;} /* one sentence per line */
/* deeper red on the grey keeps small red text above 4.5:1 */
.about-film{--red-deep:#8A1F1D;--red:#8A1F1D;}
.about-film .stats div{border-right-color:rgba(43,32,26,.2);}
.about-film .stats dd{color:var(--ink);}
/* profile schematic: a line draws out for each row, then its keywords arrive */
.af-coord{display:inline-flex;align-items:center;gap:.5rem;margin-left:1rem;font-size:.72rem;font-weight:600;letter-spacing:.04em;color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.af-coord i{display:inline-block;width:1.6rem;height:1px;background:var(--grad-line);}
.spec{list-style:none;margin:1.9rem 0 0;padding:0;display:grid;gap:1.15rem;max-width:37rem;}
.spec-head{display:flex;align-items:center;gap:.75rem;}
/* every number in the band carries the red→gold gradient */
.about-film{--num-grad:linear-gradient(120deg,#8A1F1D 0%,#C9342E 40%,#B98A3E 100%);}
.spec-i{font-size:.72rem;font-weight:700;letter-spacing:.06em;color:var(--red-deep);font-variant-numeric:tabular-nums;
  background:var(--num-grad,var(--grad-warm));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.spec-k{font-family:var(--display);font-size:1.12rem;font-weight:600;color:var(--ink);white-space:nowrap;}
.spec-line{position:relative;flex:1;height:1.5px;background:linear-gradient(90deg,var(--red-deep),#C9985F 55%,rgba(201,152,95,0));transform-origin:left center;}
.spec-line::before{content:"";position:absolute;left:-3px;top:-3px;width:7px;height:7px;border-radius:50%;background:var(--red-deep);box-shadow:0 0 0 3px rgba(138,31,29,.14);}
.spec-line::after{content:"";position:absolute;top:-1px;left:0;width:3.5rem;height:3px;border-radius:3px;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.95),transparent);}
.spec-tags{list-style:none;margin:.6rem 0 0 2.05rem;padding:0;display:flex;flex-wrap:wrap;gap:.4rem;}
.spec-tags li{padding:.28rem .7rem;border:1px solid rgba(43,32,26,.16);border-radius:.4rem;background:rgba(255,255,255,.55);
  font-size:.84rem;font-weight:500;line-height:1.35;color:var(--ink);}
.js .spec-row .spec-line{transform:scaleX(0);transition:transform 1.1s var(--ease) .15s;}
.js .spec-row .spec-tags li{opacity:0;transform:translateY(6px);transition:opacity .5s var(--ease),transform .5s var(--ease);}
.js .spec-row.in .spec-line{transform:none;}
.js .spec-row.in .spec-line::after{animation:scan 1.6s var(--ease) 1.1s 1 both;}
.js .spec-row.in .spec-tags li{opacity:1;transform:none;}
.js .spec-row.in .spec-tags li:nth-child(1){transition-delay:.55s;}
.js .spec-row.in .spec-tags li:nth-child(2){transition-delay:.65s;}
.js .spec-row.in .spec-tags li:nth-child(3){transition-delay:.75s;}
.js .spec-row.in .spec-tags li:nth-child(4){transition-delay:.85s;}
.js .spec-row.in .spec-tags li:nth-child(5){transition-delay:.95s;}
.js .spec-row.in .spec-tags li:nth-child(6){transition-delay:1.05s;}
.js .spec-row.in .spec-tags li:nth-child(7){transition-delay:1.15s;}
@keyframes scan{0%{left:0;opacity:0;}15%{opacity:1;}100%{left:calc(100% - 3.5rem);opacity:0;}}
/* numbers sit at her hands; each digit rolls like an odometer */
.about-film .af-stats{margin:0;}
.js .about-film .af-stats{opacity:0;transform:translateY(14px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.js .about-film .af-stats.in{opacity:calc(1 - var(--out,0));transform:none;}
.odo{display:flex;align-items:flex-start;}
.odo-num{display:inline-flex;}
.odo-d{display:inline-block;height:1em;line-height:1;overflow:hidden;}
.odo-strip{display:flex;flex-direction:column;transition:transform 2s cubic-bezier(.16,1,.3,1);will-change:transform;}
.odo-strip > span{display:block;height:1em;line-height:1;text-align:center;}
.odo-strip > span,.odo-plus{background-image:var(--num-grad,var(--grad-warm));background-repeat:no-repeat;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.odo.still .odo-strip{transition:none;}
@media(min-width:1200px){
  /* pinned like the photo, so the numbers stay at her hands while the page moves */
  .about-film .af-stats{position:fixed;left:0;right:0;bottom:clamp(1.2rem,5vh,3rem);margin-inline:auto;width:max-content;max-width:calc(100% - 2*var(--gutter));
    text-shadow:0 0 18px rgba(255,255,255,.9),0 0 4px rgba(255,255,255,.8);}
  /* gradient digits: a text-shadow would paint over the clipped gradient, so the glow comes from a filter behind them */
  .about-film .af-stats dt{text-shadow:none;filter:drop-shadow(0 0 6px rgba(255,255,255,.85));}
}
@media(max-width:1199px){.about-film .af-stats{padding-inline:var(--gutter);margin-top:2rem;}}
/* 04 Lens: a door into the open knowledge project. Hover: a red→gold rule runs along the bottom, corner ticks open, the arrow leans in */
.lens-card{position:relative;display:block;margin:.65rem 0 0 2.05rem;max-width:24rem;padding:.85rem 1rem .9rem;border-radius:.55rem;
  background:rgba(255,255,255,.62);border:1px solid rgba(43,32,26,.14);text-decoration:none;color:var(--ink);
  transition:background .35s var(--ease),transform .35s var(--ease),border-color .35s var(--ease);}
.lens-card::before,.lens-card::after{content:"";position:absolute;width:10px;height:10px;border-color:var(--red-deep);border-style:solid;opacity:0;
  transition:opacity .35s var(--ease),transform .35s var(--ease);}
.lens-card::before{top:-5px;left:-5px;border-width:1.5px 0 0 1.5px;transform:translate(4px,4px);}
.lens-card::after{bottom:-5px;right:-5px;border-width:0 1.5px 1.5px 0;transform:translate(-4px,-4px);}
.lc-k{display:block;font-size:.7rem;font-weight:700;letter-spacing:.04em;color:var(--red-deep);}
.lc-t{display:block;margin-top:.3rem;font-family:var(--display);font-size:1.05rem;font-weight:600;line-height:1.3;}
.lc-d{display:block;margin-top:.3rem;font-size:.82rem;line-height:1.5;color:var(--ink-soft);}
.lc-go{position:relative;display:inline-flex;align-items:center;gap:.45rem;margin-top:.6rem;font-size:.84rem;font-weight:700;color:var(--red-deep);}
.lc-go svg{width:.95rem;height:.95rem;transition:transform .35s var(--ease);}
.lc-go::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:1.5px;background:linear-gradient(90deg,var(--red-deep),#C9985F);
  transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease);}
.lens-card:hover,.lens-card:focus-visible{background:rgba(255,255,255,.85);border-color:rgba(138,31,29,.28);transform:translateY(-2px);}
.lens-card:hover::before,.lens-card:hover::after,.lens-card:focus-visible::before,.lens-card:focus-visible::after{opacity:1;transform:none;}
.lens-card:hover .lc-go svg,.lens-card:focus-visible .lc-go svg{transform:translateX(4px);}
.lens-card:hover .lc-go::after,.lens-card:focus-visible .lc-go::after{transform:scaleX(1);}
/* it arrives like the keywords, sliding out from her side */
.js .spec-row .lens-card{opacity:0;transform:translateY(6px);}
.js .spec-row.in .lens-card{opacity:1;transform:none;transition:opacity .6s var(--ease) .6s,transform .6s var(--ease) .6s,background .35s var(--ease),border-color .35s var(--ease);}
.js .spec-row.in .lens-card:hover{transform:translateY(-2px);transition-delay:0s;}
@media(min-width:1200px){
  .js .about-film .spec-r .lens-card{transform:translateX(-18px);}
  .js .about-film .spec-row.in .lens-card{transform:none;transition-delay:calc(var(--d,0s) + .95s);}
  .js .about-film .spec-row.in .lens-card:hover{transform:translateY(-2px);transition-delay:0s;}
}
@media(min-width:1200px) and (max-height:940px){.lens-card{padding:.65rem .85rem .7rem;margin-top:.45rem;}.lc-t{font-size:.98rem;}.lc-d{font-size:.78rem;}.lc-go{margin-top:.4rem;}}
@media(max-width:520px){.lens-card{margin-left:0;}}
@media (prefers-reduced-motion:reduce){.js .spec-row .lens-card{opacity:1;transform:none;}}
.spec-more{display:inline-flex;align-items:center;gap:.5rem;margin-top:1.6rem;font-weight:700;font-size:.9rem;color:var(--red-deep);text-decoration:none;}
.spec-more svg{width:1rem;height:1rem;transition:transform .3s var(--ease);}
.spec-more:hover svg{transform:translateX(3px);}
@media (prefers-reduced-motion:reduce){.js .spec-row .spec-line,.js .spec-row .spec-tags li{transform:none;opacity:1;transition:none;}.js .spec-row.in .spec-line::after{animation:none;}}
@media(max-width:520px){.af-coord{display:none;}.spec-tags{margin-left:0;}}
@media(min-width:1200px){
  /* left column: the line leaves her body (dot on her, right end) and grows leftward to the label */
  .af-left .spec-head{margin-right:calc(-1 * var(--reach));}
  .af-left .spec-line{transform-origin:right center;background:linear-gradient(270deg,var(--red-deep) 0%,#C9985F 60%,rgba(201,152,95,0) 100%);}
  .af-left .spec-line::before{left:auto;right:-3px;}
  .af-left .spec-row.in .spec-line::after{animation-name:scan-l;}
  /* right column: dot on her (left end), line grows rightward to the label */
  .spec-r .spec-head{position:relative;}
  .spec-r .spec-line{position:absolute;right:calc(100% + .7rem);top:50%;width:calc(var(--reach) - .7rem);flex:none;transform-origin:left center;
    background:linear-gradient(90deg,var(--red-deep) 0%,#C9985F 60%,rgba(201,152,95,0) 100%);}
  /* the dots are on her body: they pop first, pulse softly, and the lines grow out of them */
  .af-left .spec-head,.spec-r .spec-head{position:relative;}
  .af-left .spec-line::before,.spec-r .spec-line::before{display:none;}
  .af-left .spec-head::after,.spec-r .spec-head::before{content:"";position:absolute;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;
    background:var(--red-deep);box-shadow:0 0 0 1.5px rgba(255,255,255,.85);animation:node 2.4s ease-out 1.3s 2;}
  .af-left .spec-head::after{right:-3px;}
  .spec-r .spec-head::before{right:calc(100% + var(--reach) - 3px);}
  .js .af-left .spec-row .spec-head::after,.js .spec-r .spec-row .spec-head::before{transform:scale(0);transition:transform .45s cubic-bezier(.34,1.56,.64,1);}
  .js .af-left .spec-row.in .spec-head::after,.js .spec-r .spec-row.in .spec-head::before{transform:scale(1);}
}
/* wide screens: the band is taller than the screen and its content pins (sticky), so photo, dots, lines and numbers
   stay aligned while the reveal plays; the next section then slides over it */
@media(min-width:1200px){
  .about-film{display:block;min-height:0;height:170svh;padding-block:0;}
  /* the words are pinned to the screen like the photo (clipped to the band), so they are uncovered and covered together with her */
  .af-stage{--stage-pt:5.2rem;position:fixed;inset:0;height:100svh;display:flex;align-items:stretch;padding-block:var(--stage-pt) clamp(5.5rem,13vh,8rem);}
  /* photo geometry (cover, anchored bottom): rendered height, and how far the dots reach in from the gap to land on her body */
  .about-film{--img-h:max(100svh,45.5vw);--reach:calc(max(16vw,34svh) - max(8vw,17.7svh));}
  /* right column starts just below her earrings (≈42% down the photo) */
  .af-right{align-self:start;margin-top:calc(100svh - .58 * var(--img-h) - var(--stage-pt) - .75rem);}
  /* scrolling away fades the words out and lets them drift outward; --out is set from scroll position */
  .af-inner{opacity:calc(1 - var(--out,0));}
  .af-left{transform:translateX(calc(var(--out,0) * -2.5rem));}
  .af-right{transform:translateX(calc(var(--out,0) * 2.5rem));} /* top clears the menu bar, bottom leaves room for the numbers at her hands */
}
/* small laptops (narrow and short): the left column is tall, so drop the reserved bottom room (the numbers sit beside it, not under it) */
@media(min-width:1200px) and (max-width:1499px) and (max-height:940px){
  .about-film .af-stage{--stage-pt:4.8rem;padding-block:var(--stage-pt) 1.5rem;}
  .about-film .af-left h2{font-size:1.55rem;}
  .about-film .af-left .lead{font-size:.92rem;}
}
/* shorter laptop screens: tighten the schematic so both columns fit the pinned screen */
@media(min-width:1200px) and (max-height:940px){
  .about-film h2{font-size:clamp(1.6rem,2.4vw,2.1rem);}
  .about-film .lead{font-size:.98rem;line-height:1.6;margin-top:.8rem;}
  .af-kicker{margin-bottom:.6rem;}
  .spec{gap:.75rem;margin-top:1.2rem;}
  .spec-k{font-size:1rem;}
  .spec-tags{margin-top:.4rem;gap:.3rem;}
  .spec-tags li{font-size:.78rem;padding:.2rem .55rem;}
  .spec-more{margin-top:1rem;}
  .about-film .stats dt{font-size:1.6rem;}
  .about-film .stats dd{font-size:.8rem;}
}
/* wide screens: everything opens from her outward once the band has pinned.
   order per row: dot on her, line grows out, label, keywords; rows stagger by --d */
@media(min-width:1200px){
  .js .about-film .spec-row.reveal{opacity:1;transform:none;}
  .js .about-film .af-left .spec-row .spec-head::after,.js .about-film .spec-r .spec-row .spec-head::before{transition-delay:var(--d,0s);}
  .js .about-film .spec-row .spec-line{transition-delay:calc(var(--d,0s) + .25s);}
  .js .about-film .spec-row.in .spec-line::after{animation-delay:calc(var(--d,0s) + 1.35s);}
  .js .about-film .spec-i,.js .about-film .spec-k{opacity:0;transition:opacity .6s var(--ease),transform .6s var(--ease);}
  .js .about-film .af-left .spec-i,.js .about-film .af-left .spec-k,.js .about-film .af-left .spec-tags li{transform:translateX(18px);}
  .js .about-film .spec-r .spec-i,.js .about-film .spec-r .spec-k,.js .about-film .spec-r .spec-tags li{transform:translateX(-18px);}
  .js .about-film .spec-row.in .spec-i,.js .about-film .spec-row.in .spec-k{opacity:1;transform:none;transition-delay:calc(var(--d,0s) + .8s);}
  .js .about-film .spec-row.in .spec-tags li{opacity:1;transform:none;}
  .js .about-film .spec-row.in .spec-tags li:nth-child(1){transition-delay:calc(var(--d,0s) + .95s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(2){transition-delay:calc(var(--d,0s) + 1.03s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(3){transition-delay:calc(var(--d,0s) + 1.11s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(4){transition-delay:calc(var(--d,0s) + 1.19s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(5){transition-delay:calc(var(--d,0s) + 1.27s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(6){transition-delay:calc(var(--d,0s) + 1.35s);}
  .js .about-film .spec-row.in .spec-tags li:nth-child(7){transition-delay:calc(var(--d,0s) + 1.43s);}
  .js .about-film .af-left .stagger > *{transform:translateX(24px);}
  .js .about-film .af-left .stagger.in > *{transform:none;}
  .js .about-film .af-left .stagger.in > *:nth-child(1){transition-delay:.45s;}
  .js .about-film .af-left .stagger.in > *:nth-child(2){transition-delay:.55s;}
  .js .about-film .af-left .stagger.in > *:nth-child(3){transition-delay:.65s;}
  .js .about-film .spec-more.reveal{transform:translateX(-24px);transition-delay:1.6s;}
  .js .about-film .spec-more.reveal.in{transform:none;}
  .js .about-film .af-stats.in{transition-delay:.3s;}
}
@keyframes node{0%{box-shadow:0 0 0 1.5px rgba(255,255,255,.85),0 0 0 0 rgba(138,31,29,.4);}70%{box-shadow:0 0 0 1.5px rgba(255,255,255,.85),0 0 0 8px rgba(138,31,29,0);}100%{box-shadow:0 0 0 1.5px rgba(255,255,255,.85),0 0 0 0 rgba(138,31,29,0);}}
@media (prefers-reduced-motion:reduce){.af-left .spec-head::after,.spec-r .spec-head::before{animation:none;transform:none!important;}}
@keyframes scan-l{0%{left:calc(100% - 3.5rem);opacity:0;}15%{opacity:1;}100%{left:0;opacity:0;}}
.js .stagger.in > *:nth-child(5){transition-delay:.32s;}
.js .stagger.in > *:nth-child(6){transition-delay:.4s;}
@media(max-width:1199px){
  .about-film{display:block;min-height:0;padding-block:0 3.5rem;clip-path:none;}
  .af-bg{position:relative;inset:auto;z-index:0;}
  .af-bg picture{position:relative;inset:auto;width:auto;height:auto;}
  .af-img{aspect-ratio:4/5;max-height:78svh;height:auto;object-position:center top;}
  .af-bg::after{background:linear-gradient(180deg,rgba(199,194,197,0) 62%,#C7C2C5 100%);}
  .af-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:1rem clamp(1.5rem,4vw,3rem);align-items:start;margin-top:-2rem;position:relative;}
  .af-col{max-width:none;justify-self:stretch;}
  .af-left,.af-right{grid-column:auto;}
}
@media(max-width:760px){.af-inner{grid-template-columns:1fr;}}
.about h2{font-size:clamp(1.85rem,3vw,2.5rem);line-height:1.12;letter-spacing:-.018em;}
.about .lead{color:var(--ink-soft);margin-top:1.1rem;font-size:1.08rem;max-width:37rem;}
.about .lead + .lead{margin-top:.9rem;}
.about .lead b{color:var(--ink);font-weight:700;}
.stats{margin:2rem 0 0;display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:0;max-width:37rem;}
.stats div{padding-inline:0 1.6rem;margin-inline-end:1.6rem;border-right:1px solid var(--line-2);}
.stats div:last-child{border-right:0;margin-inline-end:0;padding-inline-end:0;}
.stats dt{font-family:var(--display);font-weight:600;font-size:clamp(1.7rem,2.6vw,2.1rem);line-height:1;color:var(--red-deep);letter-spacing:-.02em;font-variant-numeric:lining-nums tabular-nums;}
.stats dd{margin:.4rem 0 0;font-size:.86rem;line-height:1.4;color:var(--ink-soft);max-width:9.5rem;}
@media(max-width:480px){.stats div{padding-inline-end:1rem;margin-inline-end:1rem;}}

/* ================= REPORTS ================= */
.books{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
.books > .book:only-child{grid-column:1 / -1;min-height:15rem;} /* single card (China Guide hidden until 2027) spans the row */
.book{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;min-height:16rem;
  padding:clamp(1.9rem,3vw,2.7rem);border-radius:var(--radius);color:#fff;text-decoration:none;
  border:1px solid rgba(198,162,78,.45);transition:transform .5s var(--ease),box-shadow .5s var(--ease);}
.book.a{background:#A12826 var(--grad-red);}
/* the guide card borrows the culture site's cover: deep navy field, the whole red/blue taiji turning slowly on the right, the five authors' faces */
.book.guide{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:clamp(1.5rem,4vw,4rem);min-height:0;
  padding-inline:clamp(1.9rem,3.5vw,3.2rem) clamp(1.9rem,5vw,4.5rem);
  border-color:rgba(166,196,222,.22);background-color:#0E1A26;
  /* light falls in two colours, echoing the taiji: a warm red glow behind it, a cool blue glow from the upper left, then a soft vignette */
  background-image:radial-gradient(34% 90% at 86% 50%,rgba(176,35,41,.32),transparent 70%),radial-gradient(55% 90% at 4% 0%,rgba(46,98,146,.4),transparent 70%),
    radial-gradient(70% 90% at 55% 40%,rgba(22,40,58,.9),transparent 75%),linear-gradient(135deg,#0B1520 0%,#0E1A26 50%,#101E2C 100%);}
.book.guide .k{color:#A6C4DE;}
.book.guide h3{max-width:none;font-size:clamp(1.35rem,2.1vw,1.8rem);color:#F4F1EA;}
.book.guide .go{color:#F4F1EA;}
.book.guide .d{max-width:34rem;color:rgba(244,241,234,.74);}
.g-authors{display:flex;align-items:center;gap:.9rem;margin-top:1.3rem;max-width:36rem;}
.g-authors .faces{display:flex;flex:none;}
.g-authors .faces img{width:2.3rem;height:2.3rem;border-radius:50%;object-fit:cover;border:2px solid #0E1A26;margin-left:-.6rem;background:#16283A;}
.g-authors .faces img:first-child{margin-left:0;}
.b-taiji{width:clamp(9rem,15vw,12.5rem);aspect-ratio:1;pointer-events:none;
  filter:drop-shadow(0 22px 36px rgba(6,15,27,.6));animation:taiji-spin 40s linear infinite;}
@media(max-width:720px){
  .book.guide{grid-template-columns:1fr;
    background-image:radial-gradient(60% 34% at 22% 14%,rgba(176,35,41,.34),transparent 70%),radial-gradient(70% 50% at 100% 100%,rgba(46,98,146,.36),transparent 70%),
      radial-gradient(90% 70% at 55% 50%,rgba(22,40,58,.9),transparent 75%),linear-gradient(160deg,#0B1520 0%,#0E1A26 50%,#101E2C 100%);}
  .b-taiji{grid-row:1;width:5.5rem;}
}
@keyframes taiji-spin{to{rotate:360deg;}}
@media (prefers-reduced-motion:reduce){.b-taiji{animation:none;}}
.book.b{background:#2B201A var(--grad-ink);}
.book:hover{transform:translateY(-4px);box-shadow:0 26px 48px -26px rgba(30,22,16,.55);}
.book::after{content:attr(data-no);position:absolute;right:.5rem;bottom:-2.6rem;font-family:var(--display);font-weight:700;font-size:12rem;line-height:1;color:rgba(255,255,255,.07);pointer-events:none;}
.book .k{position:relative;font-size:.82rem;font-weight:700;letter-spacing:.02em;color:var(--gold-soft);}
#book .b-head h2 em{display:block;} /* two lines: the claim, then where it comes from */
.book .d{position:relative;margin-top:.7rem;max-width:27rem;font-size:.92rem;line-height:1.55;color:rgba(255,255,255,.82);}
.book h3{position:relative;font-size:clamp(1.5rem,2.3vw,1.85rem);line-height:1.12;color:#fff;margin-top:.6rem;max-width:18rem;}
.book .go{position:relative;margin-top:1.6rem;display:inline-flex;align-items:center;gap:.5rem;font-weight:700;font-size:.92rem;}
.book .go svg{width:1.05rem;height:1.05rem;transition:transform .45s var(--ease);}
.book:hover .go svg{transform:translateX(5px);}
@media(max-width:760px){.books{grid-template-columns:1fr;}.book{min-height:13rem;}}

/* ================= WORKING ================= */
.process{list-style:none;margin:0 auto;padding:0;max-width:71rem;position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;}
.process::before{content:"";position:absolute;top:2.25rem;left:13%;right:13%;height:2px;background:var(--grad-line);opacity:.3;}
.p-step{position:relative;text-align:center;}
.p-num{display:inline-flex;align-items:center;justify-content:center;width:4.5rem;height:4.5rem;border-radius:50%;position:relative;background:var(--bg-3);font-family:var(--display);font-style:italic;font-weight:500;font-size:2rem;line-height:1;color:var(--red-deep);margin-bottom:1.4rem;box-shadow:0 4px 14px rgba(43,32,26,.07);}
.p-num::before{content:"";position:absolute;inset:0;border-radius:50%;padding:1px;pointer-events:none; /* 1px red→gold ring */
  background:linear-gradient(135deg,#C9342E 0%,#D4A24C 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);}
.p-step h3{font-size:1.15rem;font-weight:600;line-height:1.3;letter-spacing:-.008em;margin-bottom:.6rem;}
.p-step p:not(.p-num){color:var(--ink-soft);font-size:.9rem;line-height:1.7;max-width:17rem;margin-inline:auto;}
@media(max-width:900px){.process{grid-template-columns:1fr 1fr;row-gap:2.6rem;}.process::before{display:none;}}
@media(max-width:520px){.process{grid-template-columns:1fr;}}

/* ================= TESTIMONIALS ================= */

/* ================= RATES ================= */
.rates{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}
/* white cards: a 1px red→gold border, a soft warm shadow, and a faint glow tucked into one corner */
.rate{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;padding:clamp(1.8rem,3vw,2.6rem);border-radius:var(--radius);
  background-color:#fff;background-image:radial-gradient(28% 38% at 100% 0%,rgba(201,52,46,.045),transparent 70%),radial-gradient(24% 34% at 0% 100%,rgba(212,162,76,.05),transparent 70%);
  box-shadow:0 22px 44px -32px rgba(161,40,38,.35);transition:transform .4s var(--ease),box-shadow .4s var(--ease);}
.rate::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:-1;
  background:linear-gradient(135deg,#C9342E,#D4A24C);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);}
.rate:hover{transform:translateY(-3px);box-shadow:0 28px 52px -30px rgba(161,40,38,.42);}
.rate h3{font-size:1.65rem;}
.rate p{color:var(--ink-soft);font-size:.99rem;line-height:1.62;margin-top:.7rem;}
.rate p b,.rate p strong{color:var(--ink);}
.rate > p{margin-bottom:1.8rem;}
.rate .btn{margin-top:auto;align-self:flex-start;}
@media(max-width:760px){.rates{grid-template-columns:1fr;}}


/* ================= NEWSLETTER ================= */
.news-panel{position:relative;border-radius:14px;padding:clamp(2rem,4.5vw,3.4rem);background:var(--bg-3);border:1px solid var(--line-gold);color:var(--ink);
  display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center;}
.news-panel::before{content:"";position:absolute;top:0;left:clamp(2rem,4.5vw,3.4rem);right:clamp(2rem,4.5vw,3.4rem);height:3px;background:var(--grad-line);}
.news-panel h2{font-size:clamp(1.7rem,2.6vw,2.15rem);line-height:1.12;letter-spacing:-.018em;}
.news-panel p{color:var(--ink-soft);margin-top:1rem;max-width:30rem;}
.news-panel p b{color:var(--red-deep);font-family:var(--display);font-style:italic;font-weight:600;}
.form{display:flex;gap:.6rem;flex-wrap:wrap;}
.form input{font:inherit;font-size:.98rem;flex:1;min-width:12rem;padding:.85rem 1.2rem;border-radius:100px;border:1px solid var(--line-2);background:#fff;color:var(--ink);caret-color:var(--red-deep);}
.form input::placeholder{color:var(--ink-faint);}
.form input:focus-visible{outline:2px solid var(--red-deep);outline-offset:2px;}
.news-panel .fine{margin-top:.9rem;font-size:.84rem;color:var(--ink-faint);}
@media(max-width:760px){.news-panel{grid-template-columns:1fr;}}

/* ================= CONTACT ================= */
/* closing call: centred v9 head on white, with a soft red/gold glow behind the words */
.contact{position:relative;isolation:isolate;overflow:hidden;text-align:center;}
.contact::before{content:"";position:absolute;left:50%;top:50%;width:min(110%,62rem);height:150%;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(201,52,46,.08),rgba(212,162,76,.06) 45%,transparent 75%);}
.contact .b-head.v9{margin-bottom:0;}
.contact .b-head.v9 h2{font-size:clamp(1.85rem,3vw,2.5rem);}
.contact .b-head.v9 p:not(.eyebrow){max-width:36rem;}
.contact .cta{margin-top:2rem;display:flex;justify-content:center;}

/* ================= FOOTER (the one dark band, borrowed from v9) ================= */
.lw-footer{background:var(--ink);color:rgba(255,255,255,.66);padding-block:3.6rem 1.8rem;font-size:.92rem;}
.foot{display:grid;grid-template-columns:1.5fr 1fr 1.2fr;gap:2.4rem clamp(2rem,5vw,4rem);}
.foot .brand{color:#fff;}
.foot .brand img{background:#fff;}
.foot .tag{margin-top:1rem;font-family:var(--display);font-style:italic;font-size:1.1rem;line-height:1.45;color:var(--gold-soft);max-width:19rem;}
.foot .fh{font-family:var(--sans);font-size:.92rem;font-weight:700;letter-spacing:.01em;color:#fff;margin-bottom:.9rem;}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.45rem;}
.foot a{color:rgba(255,255,255,.74);text-decoration:none;transition:color .25s;}
.foot a:hover{color:var(--gold);}
.foot .meta{line-height:1.7;}
.foot .meta b{display:block;color:#fff;font-weight:700;margin-top:.7rem;}
.foot .meta b:first-child{margin-top:0;}
.foot-bottom{grid-column:1/-1;margin-top:1rem;padding-top:1.4rem;border-top:1px solid rgba(201,152,95,.18);display:flex;flex-wrap:wrap;gap:.6rem 1.6rem;justify-content:space-between;font-size:.84rem;color:rgba(255,255,255,.62);}
.foot-bottom nav{display:flex;gap:1.3rem;}
.lw-footer :focus-visible{outline-color:var(--gold-soft);}
@media(max-width:760px){.foot{grid-template-columns:1fr 1fr;}.foot > div:first-child{grid-column:1/-1;}}
@media(max-width:420px){.foot{grid-template-columns:1fr;}}

/* ================= SERVICES PAGE (services.html): same tokens and components as the homepage ================= */
.svc-page h1 em,.svc-page .part-head h2 em{font-style:italic;font-weight:500;padding-inline-end:.06em;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent;}
/* page hero: centred, white, a soft red/gold glow like the closing section */
.page-hero{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding-block:calc(4.4rem + clamp(3.5rem,9vh,6rem)) clamp(3.5rem,8vh,5.5rem);}
.page-hero::before{content:"";position:absolute;left:50%;top:58%;width:min(110%,62rem);height:120%;transform:translate(-50%,-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(closest-side,rgba(201,52,46,.07),rgba(212,162,76,.06) 45%,transparent 75%);}
.crumb{display:inline-flex;gap:.7rem;margin-bottom:1.4rem;font-size:.84rem;font-weight:600;letter-spacing:.02em;color:var(--ink-faint);}
.crumb a{text-decoration:none;transition:color .25s;}
.crumb a:hover{color:var(--red-deep);}
.crumb [aria-current]{color:var(--ink);}
.page-hero h1{font-size:clamp(2.5rem,5.2vw,4.1rem);line-height:1.06;letter-spacing:-.024em;}
.page-hero .lede{margin:1.3rem auto 0;max-width:40rem;font-family:var(--display);font-style:italic;font-size:clamp(1.15rem,1.7vw,1.4rem);line-height:1.5;color:var(--ink-soft);}
.jump{margin-top:2.2rem;display:flex;flex-wrap:wrap;justify-content:center;gap:.7rem;}
.jump a{display:inline-flex;align-items:center;gap:.75rem;padding:.5rem 1.3rem .5rem .55rem;border-radius:100px;border:1.5px solid var(--line-2);background:#fff;text-decoration:none;font-weight:700;font-size:.92rem;color:var(--ink);
  transition:transform .45s var(--ease),border-color .3s,color .3s;}
.jump a:hover{transform:translateY(-2px);border-color:var(--ink-faint);color:var(--red-deep);}
/* the small numeral circles echo the process rings on the homepage: cream fill, 1px red→gold ring */
.jump .n,.svc-num{position:relative;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:var(--bg-3);font-family:var(--display);font-style:italic;font-weight:500;line-height:1;color:var(--red-deep);}
.jump .n{width:2rem;height:2rem;font-size:1rem;}
.jump .n::before,.svc-num::before{content:"";position:absolute;inset:0;border-radius:50%;padding:1px;pointer-events:none;
  background:linear-gradient(135deg,#C9342E,#D4A24C);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);}
/* overview: the two directions */
.dirs{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;max-width:58rem;margin:0 auto;}
.dirs > div{padding:1.5rem 1.7rem;border:1px solid var(--line);border-radius:12px;background:#fff;}
.dirs b,.dirs .dir-t{display:block;font-family:var(--display);font-size:1.25rem;font-weight:600;color:var(--ink);margin-bottom:.3rem;}
.dirs span,.dirs .dir-d{font-size:.95rem;line-height:1.65;color:var(--ink-soft);}
/* each part opens like the homepage umbrella card: label, title, intro beside its image */
.part-head{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(1.8rem,5vw,4.5rem);align-items:center;margin-bottom:clamp(2.4rem,5vw,3.5rem);}
.part.flip .ph-text{order:2;}
.part-head h2{font-size:clamp(1.85rem,3vw,2.5rem);line-height:1.12;letter-spacing:-.018em;}
.part-head .ph-text > p:not(.u-eyebrow){margin-top:1rem;color:var(--ink-soft);line-height:1.75;max-width:32rem;}
.ph-img{aspect-ratio:5/3;overflow:hidden;border-radius:12px;background:var(--cream-deep);border:1px solid var(--line);}
.ph-img img{width:100%;height:100%;object-fit:cover;}
/* service cards: white, hairline border, a gentle lift on hover (no top line) */
.svc-grid{display:grid;gap:clamp(1.2rem,2.2vw,1.75rem);}
.svc-grid.three{grid-template-columns:repeat(3,1fr);}
.svc-grid.two{grid-template-columns:repeat(2,1fr);}
/* subgrid: numeral, title, tagline, description and list line up across each row of cards */
.svc-card{position:relative;isolation:isolate;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:12px;padding:clamp(1.7rem,2.6vw,2.2rem);
  display:grid;grid-row:span 6;grid-template-rows:subgrid;row-gap:0;align-content:start;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;}
.svc-card:hover{transform:translateY(-5px);box-shadow:0 24px 60px rgba(43,32,26,.1);border-color:transparent;}
.svc-num{width:2.8rem;height:2.8rem;font-size:1.35rem;margin-bottom:1.2rem;justify-self:start;}
.svc-card h3{font-size:1.35rem;line-height:1.25;letter-spacing:-.01em;margin-bottom:.6rem;}
.svc-tag{font-family:var(--display);font-style:italic;font-size:1.08rem;line-height:1.45;color:var(--red-deep);margin-bottom:.9rem;}
.svc-card .desc{font-size:.95rem;line-height:1.75;color:var(--ink-soft);margin-bottom:1.1rem;}
.svc-list,.r-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.svc-list li,.r-list li{padding:.62rem 0;border-bottom:1px solid var(--line);font-size:.92rem;line-height:1.55;color:var(--ink-soft);}
.svc-list li:last-child,.r-list li:last-child{border-bottom:0;}
/* engagement: the homepage rate cards, with their list of typical work */
.svc-page .rates{max-width:62rem;margin-inline:auto;}
.svc-page .rate > p{margin-bottom:1.2rem;}
.svc-page .r-list{margin-bottom:1.8rem;}

@media(max-width:900px){
  .part-head{grid-template-columns:1fr;}
  .part.flip .ph-text{order:0;}
  .svc-grid.three,.svc-grid.two{grid-template-columns:1fr;}
}
@media(max-width:760px){.dirs{grid-template-columns:1fr;}}

/* ================= Ergaenzungen fuer WordPress ================= */
/* Bildhuellen: der Core-Bildblock legt ein figure um das Bild */
.u-img .wp-block-image,.ph-img .wp-block-image{height:100%;}
.u-img .wp-block-image img,.ph-img .wp-block-image img{width:100%;height:100%;object-fit:cover;}
/* WordPress nimmt dem ersten Kind jeder Gruppe den oberen Außenabstand (:where(.is-layout-flow) > :first-child).
   Zwei Stellen des Entwurfs brauchen ihn (Befund Staging 2026-10-03, About-Band 30 px zu kurz bzw. 32 px zu tief) */
.fh-main .af-right > .spec{margin-top:1.9rem;}
@media(min-width:1200px) and (max-height:940px){.fh-main .af-right > .spec{margin-top:1.2rem;}}
@media(max-width:1199px){.fh-main .af-stage > .af-inner{margin-top:-2rem;}}
/* Leistungslisten der Startseite: der Pfeil des Entwurfs (svg im Link) kommt aus CSS, damit der Listenpunkt ein reiner Textlink bleibt */
.u-list a{transition:color .25s,padding-inline-start .25s var(--ease);}
.u-list a::after{content:"";flex:none;width:1rem;height:1rem;background:var(--red-deep);transition:transform .25s;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;}
.u-list a:hover{padding-inline-start:6px;}
.u-list a:hover::after{transform:translateX(4px);}
/* Richtungs-Karten (Services): im Entwurf steht der Text als inline-span in der Zeilenhoehe der Karte (1.7 × 1rem) */
.dirs .dir-d{line-height:1.7rem;}
/* ================= SPRACHEN =================
   Umschalter in der Navigation: drei Kürzel, das aktive in Rot. Er bleibt auch auf schmalen
   Bildschirmen stehen (die Textlinks der Navigation verschwinden dort wie im Entwurf). */
.nav .links .lang{display:inline-flex;align-items:center;gap:.15rem;}
.nav .links .lang a:not(.btn){display:inline-block;padding:.3rem .45rem;border-radius:.45rem;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:var(--ink-faint);}
.nav .links .lang a:not(.btn):hover{color:var(--ink);}
.nav .links .lang a[aria-current]{color:var(--red-deep);background:var(--red-tint);}
@media(max-width:860px){.nav .links{gap:.7rem;}}
@media(max-width:560px){.nav .brand .nm{display:none;}.nav .links .lang a:not(.btn){padding:.3rem .32rem;}}
/* Chinesisch: Lilys site-zh.css (Ordner zh/ ihres Entwurfs, 2026-10-06), unverändert bis auf drei
   Punkte: Noto Sans/Serif SC nicht von Google, sondern aus den Systemschriften (keine Fremdabrufe);
   .u-list li span entfällt (Listenpunkte ohne span); Fett in den Karten ist strong (Core-Absatz). */
:root:lang(zh){--display:"Noto Serif SC","Source Han Serif SC","Songti SC","STSong","SimSun",serif;--sans:"Noto Sans SC","Source Han Sans SC","PingFang SC","Microsoft YaHei","Hiragino Sans GB",system-ui,sans-serif;}
html:lang(zh) body{line-height:1.85;}
html:lang(zh) h1,html:lang(zh) h2,html:lang(zh) h3{letter-spacing:0;line-height:1.3;font-weight:600;}
html:lang(zh) em,html:lang(zh) .u-tag,html:lang(zh) .p-num,html:lang(zh) .foot .tag{font-style:normal;}
html:lang(zh) .btn{letter-spacing:.04em;font-weight:600;}
html:lang(zh) .hero-c h1{letter-spacing:.02em;line-height:1.2;}
.hero-c h1 .g.inline{display:inline;}
html:lang(zh) .zlab .t{font-size:.9rem;letter-spacing:.06em;}
html:lang(zh) .b-head.v9 .eyebrow,html:lang(zh) .u-eyebrow,html:lang(zh) .af-kicker{letter-spacing:.12em;}
html:lang(zh) .u-list li.plain{padding:.9rem 0;font-size:.95rem;font-weight:500;color:var(--ink);display:flex;gap:.8rem;align-items:baseline;}
html:lang(zh) .u-list li.plain::before{content:"";flex:none;width:.4rem;height:.4rem;border-radius:50%;background:var(--red-deep);transform:translateY(-.15em);}
html:lang(zh) .u-desc{min-height:0;}
html:lang(zh) .process{grid-template-columns:repeat(3,1fr);max-width:62rem;}
html:lang(zh) .process::before{left:17%;right:17%;}
@media(max-width:900px){html:lang(zh) .process{grid-template-columns:1fr;row-gap:2.2rem;}}
html:lang(zh) .b-head.v9 h2{white-space:normal;}
html:lang(zh) .spec-k{letter-spacing:.06em;}
html:lang(zh) .hero-c .lede{font-family:var(--display);font-weight:500;font-size:clamp(1.1rem,1.7vw,1.4rem);line-height:1.7;letter-spacing:.06em;color:var(--ink-soft);max-width:none;}
html:lang(zh) .hero-c .lede .ln{display:block;}
html:lang(zh) .hero-c .lede b{font-weight:700;color:var(--red-deep);margin-inline-end:.15em;}
html:lang(zh) .about-film .af-left h2,html:lang(zh) .about-film h2{font-size:clamp(1.3rem,1.75vw,1.6rem);line-height:1.4;letter-spacing:.02em;}
html:lang(zh) .about-film h2 em{white-space:nowrap;}
@media(max-width:420px){html:lang(zh) .about-film .af-left h2,html:lang(zh) .about-film h2{font-size:1.2rem;}html:lang(zh) .about-film h2 em{white-space:normal;}}
/* Services zh: Karten Problem → Lösung */
html:lang(zh) .svc-card h3{letter-spacing:.01em;}
html:lang(zh) .svc-card .pain,html:lang(zh) .svc-card .desc{position:relative;}
html:lang(zh) .svc-card .pain{margin:0 0 1rem;padding:.8rem 1rem;border-left:3px solid var(--red-deep);background:var(--bg-3,#f6f1ec);border-radius:0 8px 8px 0;font-size:.93rem;line-height:1.75;color:var(--ink);}
html:lang(zh) .svc-card .pain strong,html:lang(zh) .svc-card .desc strong{display:block;font-size:.78rem;font-weight:700;letter-spacing:.14em;color:var(--red-deep);margin-bottom:.2rem;}
html:lang(zh) .svc-card .list-k{font-size:.78rem;font-weight:700;letter-spacing:.14em;color:var(--red-deep);margin:0 0 .3rem;}
html:lang(zh) .svc-page .page-hero h1,html:lang(zh) .page-hero h1{letter-spacing:.01em;line-height:1.25;}
html:lang(zh) .page-hero .lede{font-style:normal;font-family:var(--sans);}
html:lang(zh) .svc-page h1 em,html:lang(zh) .svc-page .part-head h2 em{font-style:normal;}
html:lang(zh) .svc-grid.three{grid-template-columns:repeat(3,1fr);}
@media(max-width:1000px){html:lang(zh) .svc-grid.three{grid-template-columns:1fr;}}
html:lang(zh) .part-head h2{letter-spacing:.01em;line-height:1.3;}
html:lang(zh) .dirs b,html:lang(zh) .dirs .dir-t{letter-spacing:.02em;}
html:lang(zh) .rate h3{letter-spacing:.02em;}
/* Deutsch: längere Wörter. Die einzeiligen Titel des Entwurfs dürfen umbrechen, sobald der Platz fehlt */
@media(max-width:1100px){:lang(de) .b-head.v9 h2,:lang(de) .hero-c h1 span{white-space:normal;}}
@media(max-width:480px){:lang(de) .stats{grid-template-columns:repeat(3,minmax(0,1fr));}:lang(de) .stats dd{font-size:.78rem;}}
:lang(de) :is(h1,h2,h3,p,li){hyphens:auto;-webkit-hyphens:auto;hyphenate-limit-chars:10 4 4;}

/* angemeldet: die Admin-Leiste schiebt die feste Navigation nach unten */
.admin-bar .nav{top:32px;}
@media(max-width:782px){.admin-bar .nav{top:46px;}}

/* ================= KONTAKTFORMULAR (Contact Form 7) =================
   Karte wie die Rate-Karten: weiss, 1px Rot→Gold-Rand, warmer Schatten. Felder ruhig, Fokus in Rot. */
.lw-contact{max-width:46rem;margin:clamp(2rem,4vw,2.8rem) auto 0;text-align:left;}
.lw-form{position:relative;isolation:isolate;padding:clamp(1.6rem,3vw,2.5rem);border-radius:var(--radius);background:#fff;
  box-shadow:0 22px 44px -32px rgba(161,40,38,.35);}
.lw-form::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:-1;
  background:linear-gradient(135deg,#C9342E,#D4A24C);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);}
.lw-form .wpcf7 form{margin:0;}
.lw-form__grid{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem;}
.lw-form p{margin:0 0 1.1rem;}
.lw-form label{display:block;font-size:.84rem;font-weight:700;letter-spacing:.01em;color:var(--ink);}
.lw-form .wpcf7-form-control-wrap{display:block;margin-top:.4rem;}
.lw-form input[type=text],.lw-form input[type=email],.lw-form input[type=tel],.lw-form select,.lw-form textarea{
  font:inherit;font-size:.98rem;font-weight:400;width:100%;padding:.78rem 1rem;border-radius:.7rem;border:1px solid var(--line-2);background:#fff;color:var(--ink);
  caret-color:var(--red-deep);transition:border-color .25s,box-shadow .25s;}
.lw-form textarea{min-height:9rem;resize:vertical;line-height:1.6;}
.lw-form input::placeholder,.lw-form textarea::placeholder{color:var(--ink-faint);}
.lw-form input:focus-visible,.lw-form select:focus-visible,.lw-form textarea:focus-visible{outline:none;border-color:var(--red-deep);box-shadow:0 0 0 3px rgba(201,52,46,.14);}
.lw-form .wpcf7-acceptance{display:block;font-size:.86rem;line-height:1.55;color:var(--ink-soft);font-weight:400;}
.lw-form .wpcf7-acceptance .wpcf7-list-item{margin:0;}
.lw-form .wpcf7-acceptance label{display:flex;gap:.6rem;align-items:flex-start;font-weight:400;font-size:inherit;color:inherit;}
.lw-form .wpcf7-acceptance input{margin:.3rem 0 0;accent-color:var(--red-deep);flex:none;}
.lw-form .wpcf7-acceptance a{color:var(--red-deep);}
/* nur der letzte Absatz des Formulars (Knopf) ohne Abstand, nicht der letzte im Raster */
.lw-form form > p:last-of-type{margin-bottom:0;}
/* drei Felder im Raster (seit 2026-10-06 ohne Themen-Dropdown): Name | Firma, darunter E-Mail über die volle Breite */
.lw-form__grid > p:nth-child(3):last-child{grid-column:1 / -1;}
.lw-form input[type=submit]{font-family:var(--sans);font-weight:700;font-size:.92rem;padding:.85rem 1.7rem;border-radius:100px;border:1.5px solid transparent;background:var(--red-deep);color:#fff;cursor:pointer;
  transition:transform .45s var(--ease),box-shadow .45s var(--ease),background-color .3s;}
.lw-form input[type=submit]:hover{background:var(--red-darker);transform:translateY(-2px);box-shadow:0 14px 28px -16px rgba(30,22,16,.55);}
.lw-form input[type=submit]:active{transform:scale(.98);}
.lw-form .wpcf7-spinner{vertical-align:middle;}
.lw-form .wpcf7-not-valid-tip{margin-top:.35rem;font-size:.82rem;font-weight:600;color:var(--red-deep);}
.lw-form .wpcf7 form .wpcf7-response-output{margin:1.2rem 0 0;padding:.8rem 1rem;border-radius:.7rem;border:1px solid var(--line-2);font-size:.92rem;color:var(--ink);}
.lw-form .wpcf7 form.sent .wpcf7-response-output{border-color:var(--gold);background:var(--bg-3);}
.lw-form .wpcf7 form.invalid .wpcf7-response-output,.lw-form .wpcf7 form.failed .wpcf7-response-output,.lw-form .wpcf7 form.spam .wpcf7-response-output{border-color:var(--red);background:var(--red-tint);}
.lw-contact-alt{margin-top:1.4rem;text-align:center;font-size:.95rem;color:var(--ink-soft);}
.lw-contact-alt a{color:var(--red-deep);font-weight:700;text-decoration:none;}
.lw-contact-alt a:hover{text-decoration:underline;}
@media(max-width:620px){.lw-form__grid{grid-template-columns:1fr;}}

/* WeChat-Kontakt (chinesische Seite, Operator 2026-10-06): unter dem Vorspann, über dem Formular.
   Ein Klick kopiert die ID (site.js) und öffnet die WeChat-App (weixin://); einen Link direkt in
   einen Kontakt bietet WeChat für eine ID nicht an, gesucht wird in der App nach der kopierten ID. */
.lw-wechat{margin:clamp(1.4rem,3vw,1.9rem) 0 0;display:flex;flex-direction:column;align-items:center;gap:.45rem;}
.lw-wechat__link{display:inline-flex;align-items:center;gap:.6rem;padding:.55rem 1.2rem .55rem .7rem;border-radius:100px;border:1.5px solid rgba(7,193,96,.35);background:#fff;
  text-decoration:none;color:var(--ink);font-weight:700;transition:transform .45s var(--ease),border-color .3s,box-shadow .45s var(--ease);}
.lw-wechat__link:hover{transform:translateY(-2px);border-color:#07C160;box-shadow:0 14px 28px -18px rgba(7,193,96,.6);}
.lw-wechat__ic{width:1.9rem;height:1.9rem;padding:.3rem;border-radius:50%;background:#07C160;color:#fff;flex:none;}
.lw-wechat__k{font-size:.92rem;color:var(--ink-soft);}
.lw-wechat__id{font-size:1rem;letter-spacing:.02em;font-variant-numeric:tabular-nums;}
.lw-wechat__hint{font-size:.82rem;color:var(--ink-faint);}
.lw-wechat.copied .lw-wechat__hint{color:#07C160;font-weight:700;}

/* ================= RECHTSSEITEN (Vorlage page-legal) ================= */
.legal{padding-block:calc(4.4rem + clamp(2.5rem,7vh,4.5rem)) clamp(3.5rem,8vh,5.5rem);}
.legal .wrap{max-width:46rem;}
.legal h1{font-size:clamp(2.1rem,4vw,3rem);letter-spacing:-.02em;margin-bottom:1.6rem;}
.legal h2{font-size:1.3rem;line-height:1.3;margin:2.2rem 0 .6rem;}
.legal h2.legal-part{font-size:clamp(1.7rem,3vw,2.1rem);margin-top:3.5rem;padding-top:2.5rem;border-top:1px solid var(--line);}
.legal h3{font-size:1.08rem;margin:1.5rem 0 .4rem;}
.legal p,.legal li{color:var(--ink-soft);}
.legal p+p{margin-top:.9rem;}
.legal ul,.legal ol{margin:.6rem 0 0;padding-left:1.3rem;}
.legal a{color:var(--red-deep);text-decoration:underline;text-underline-offset:.15em;}
/* Hinweisbox der Rechtsseiten: nicht .hint — so heißt der absolut positionierte Hero-Hinweis des Entwurfs (Befund 2026-10-06) */
.legal .legal-note{padding:1rem 1.2rem;border-radius:.7rem;background:var(--bg-3);border:1px solid var(--line-gold);}
.legal .stand{margin-top:2rem;font-size:.86rem;color:var(--ink-faint);}