/* Approved design B: slate blue, warm ivory and champagne. */
:root { --white:#f2eee5; --mist:#ddd7cb; --muted:#c8c5be; --champagne:#c4b28d; }
.site { background:#213e53; }
.cover.cover-v4, #letter.letter-v5, #organizers.organizers-v6, .full-screen-slide.inner-v7 {
  --inner-copy:#f2eee5; --inner-muted:#dedbd4; --inner-rule:#c4b28d70;
  background:radial-gradient(ellipse at 20% 5%,#41617440,transparent 65%),linear-gradient(160deg,#29465b,#203e55 65%,#1d3346); color:#f2eee5;
}
.cover-v4 .cover-scene, #letter.letter-v5 .letter-scene-v5, .closing-slide.inner-v7 .closing-scene {
  inset:0; width:100%; height:100%; object-fit:cover; object-position:center top; transform:none; opacity:1; mask-image:none;
}
.cover.cover-v4::after { background:linear-gradient(transparent 78%,#102b4040 90%,#102b40a3); }
#organizers.organizers-v6 .organizers-scene, .inner-v7 .inner-scene { filter:saturate(.32); mask-image:linear-gradient(transparent 57%,#000 88%); opacity:.85; }
.cover-title img, .letter-heading img, .section-title img, #closingTitle img { filter:brightness(0) saturate(100%) invert(93%) sepia(15%) saturate(253%) hue-rotate(338deg); }
.cover-invitation, .cover-v4 .cover-event, .cover-tagline, .cover-v4 .cover-date, .cover-v4 .cover-host,
#letter.letter-v5 .bodycopy, #letter.letter-v5 .salute, #letter.letter-v5 .signature, #organizers.organizers-v6 .organizer-group ul { color:#f2eee5; }
#organizers.organizers-v6 .organizer-group h3, .contact-slide.inner-v7 .contact-label { color:#d3bd98; }
#organizers.organizers-v6 .organization-sub { color:#dedbd4; }
#organizers.organizers-v6 .organizer-group + .organizer-group { border-color:#c4b28d70; }
.cover-divider, #letter.letter-v5 .letter-title-flare, #organizers.organizers-v6 .organizers-title-flare, .inner-v7 .inner-title-flare { background:linear-gradient(90deg,transparent,#c4b28d9c 15%,#c4b28d9c 85%,transparent); }
#letter.letter-v5 .letter-title-flare::after, #organizers.organizers-v6 .organizers-title-flare::after, .inner-v7 .inner-title-flare::after { left:45%; width:10%; height:3px; top:-1px; background:#c4b28d; box-shadow:none; }
#organizers.organizers-v6 .organizers-divider, .inner-v7 .inner-divider, .closing-slide.inner-v7 .closing-rule { background:#c4b28d70; }
.cover-v4 .seal { color:#f2eee5; background:#29465b99; border-color:#d5c3a1; }
.cover-v4 .seal:hover { background:#416174cc; }
@keyframes seal-breathe {
  0%,100% { transform:scale(1); border-color:#c4b28da6; box-shadow:0 0 0 0 #c4b28d00,0 0 6px #c4b28d12; }
  50% { transform:scale(1.09); border-color:#eadcc3; box-shadow:0 0 0 7px #c4b28d0d,0 0 22px #c4b28d45; }
}
.cover-v4 .seal::after { border-color:#eadcc3; }
.cover-v4 .tap-hand path { fill:#f2eee5; stroke:#9c8e77; }

/* Editable letter content follows the selected proof. */
#letter.letter-v5 .letter-heading { top:8%; left:15%; width:70%; height:10%; }
#letter.letter-v5 .letter-title-flare { top:19%; left:9%; width:82%; }
#letter.letter-v5 .letter-text { top:24%; left:9%; right:9%; font-family:var(--font-formal); }
#letter.letter-v5 .salute { font-size:clamp(15px,4.1cqi,21px); line-height:1.6; margin-bottom:clamp(15px,2.3svh,24px); }
#letter.letter-v5 .bodycopy { font-size:clamp(14px,3.8cqi,20px); line-height:1.85; text-indent:0; letter-spacing:.2px; }
.letter-facts { margin:clamp(20px,3svh,30px) 0 0; border-top:1px solid #c4b28d80; }
.letter-facts > div { display:grid; grid-template-columns:5.6em minmax(0,1fr); align-items:start; padding:12px 0; border-bottom:1px solid #c4b28d80; font-size:clamp(13px,3.4cqi,18px); line-height:1.65; }
.letter-facts dt { color:#d3bd98; letter-spacing:1px; }
.letter-facts dd { margin:0; padding-left:14px; border-left:1px solid #c4b28d80; color:#f2eee5; overflow-wrap:anywhere; }
#letter.letter-v5 .signature { position:static; margin-top:clamp(22px,3.3svh,36px); padding:0; font-size:clamp(12px,3.2cqi,17px); line-height:1.6; text-shadow:0 1px 4px #102b4040; }
.venue.inner-v7 .venue-map { border-color:#d9d0bc8c; background:#f2eee5; box-shadow:0 12px 28px #10253630; }
.venue-map-preview { background:#f4f1e9; }
.venue-map-preview-title { color:#29465b; }
.venue-card-pin { background:#e5e5dc; stroke:#5b6e76; }
.venue-card-eyebrow { color:#7f796c; }
.venue-map-credit { background:#f4f1e9ed; color:#5f6b71; }
.venue-map .map-status { background:#29465bee; }
.venue.inner-v7 .map-navigation, .contact-slide.inner-v7 .call-button { color:#f2eee5; border-color:#c4b28d9c; background:#c4b28d0a; }
.venue.inner-v7 .map-navigation:hover, .contact-slide.inner-v7 .call-button:hover { background:#c4b28d1f; }
.contact-slide.inner-v7 .contact-phone, .agenda.inner-v7 time { color:#eadcc3; }
@media (max-height:740px) {
  #letter.letter-v5 .letter-text { top:23%; }
  #letter.letter-v5 .salute { margin-bottom:12px; }
  #letter.letter-v5 .bodycopy { font-size:clamp(13px,3.55cqi,17px); line-height:1.75; }
  .letter-facts { margin-top:18px; }
  .letter-facts > div { padding:10px 0; }
  #letter.letter-v5 .signature { margin-top:20px; }
}
@media (max-height:620px) {
  #letter.letter-v5 .letter-text { top:22.5%; }
  #letter.letter-v5 .salute { margin-bottom:9px; font-size:14px; }
  #letter.letter-v5 .bodycopy { font-size:13px; line-height:1.6; }
  .letter-facts { margin-top:14px; }
  .letter-facts > div { font-size:12px; padding:8px 0; }
  .letter-facts dd { padding-left:10px; }
  #letter.letter-v5 .signature { margin-top:14px; font-size:12px; }
}


/* Second-page composition, based on the approved reference poster. */
#letter.letter-v5 { background:radial-gradient(ellipse at 5% 12%,#194a70,transparent 52%),linear-gradient(145deg,#072c4d,#123b59); }
#letter.letter-v5 .letter-scene-v5 { object-position:center bottom; mask-image:linear-gradient(transparent 30%,#0008 62%,#000 80%); }
#letter.letter-v5 .letter-heading { top:7%; left:20%; width:60%; height:10%; }
#letter.letter-v5 .letter-heading img { filter:brightness(0) saturate(100%) invert(92%) sepia(27%) saturate(492%) hue-rotate(339deg); }
#letter.letter-v5 .letter-title-flare { top:19%; left:10%; width:80%; }
#letter.letter-v5 .letter-title-flare::after { left:49%; top:-3px; width:7px; height:7px; transform:rotate(45deg); background:#f4dbab; }
.letter-molecule { position:absolute; top:0; left:-2%; width:32%; height:17%; opacity:.48; pointer-events:none; }
.letter-intro { position:absolute; top:21%; left:8%; right:8%; text-align:center; font-family:var(--font-formal); }
.letter-intro h3 { margin:0; font-size:clamp(19px,5.8cqi,30px); line-height:1.4; letter-spacing:2px; color:#f6dfb3; font-weight:600; }
.letter-intro p { margin:5px 0 0; font-size:clamp(13px,3.7cqi,19px); line-height:1.5; letter-spacing:1px; }
.letter-intro > span { display:block; margin-top:7px; font-size:clamp(10px,2.7cqi,14px); letter-spacing:1.5px; color:#e2e5e9; }
#letter.letter-v5 .letter-text { top:34%; left:9%; right:9%; }
#letter.letter-v5 .salute { font-size:clamp(13px,3.6cqi,18px); line-height:1.5; margin:0 0 8px; }
#letter.letter-v5 .bodycopy { font-size:clamp(13px,3.5cqi,18px); line-height:1.8; text-indent:2em; letter-spacing:.2px; }
#letter .letter-facts { display:grid; grid-template-columns:.95fr 1.15fr; gap:16px; border-top:1px solid #d6bd8d80; margin:16px 0 0; padding-top:14px; }
#letter .letter-facts > div { position:relative; display:block; border:0; padding:0 0 0 30px; font-size:clamp(12px,3.2cqi,16px); line-height:1.4; }
#letter .letter-facts > div + div { border-left:1px solid #c4b28d99; padding-left:40px; }
#letter .letter-facts svg { position:absolute; top:3px; left:0; width:23px; height:26px; fill:none; stroke:#f3d6a0; stroke-width:2; }
#letter .letter-facts > div + div svg { left:10px; }
#letter .letter-facts dt { font-family:var(--font-sans,sans-serif); font-size:9px; letter-spacing:1px; color:#e2e5e9; }
#letter .letter-facts dd { border:0; padding:0; margin:5px 0 0; color:#fff4de; }
#letter .letter-date-fact dd { font-size:clamp(15px,4.2cqi,22px); white-space:nowrap; }
#letter .letter-facts div > span { display:block; margin-top:4px; font-size:11px; color:#cadce8; letter-spacing:1px; }
#letter.letter-v5 .signature { margin-top:18px; font-size:clamp(11px,3cqi,15px); line-height:1.5; }
.letter-energy { position:absolute; left:0; right:0; bottom:22%; height:10%; color:#c5e1f0; pointer-events:none; }
.energy-h2 { position:absolute; left:18%; top:-20%; font-size:clamp(35px,10cqi,52px); opacity:.22; font-style:italic; }
.letter-energy > svg { position:absolute; inset:20% 0 0; width:100%; height:80%; fill:none; stroke:#a6dce6; stroke-width:.7; opacity:.65; }
.letter-energy > div { display:flex; justify-content:space-between; position:absolute; left:42%; right:11%; top:0; text-align:center; }
.letter-energy div > span { font-size:22px; }
.letter-energy small { display:block; font-size:9px; font-style:normal; }
@media(max-height:620px) {
 #letter.letter-v5 .letter-text { top:34%; }
 #letter.letter-v5 .bodycopy { line-height:1.65; }
 #letter .letter-facts { margin-top:10px; padding-top:10px; gap:10px; }
 #letter.letter-v5 .signature { margin-top:12px; }
 .letter-intro > span { margin-top:4px; font-size:9px; letter-spacing:.6px; }
 .letter-energy { bottom:19%; }
}
#letter.letter-v5 .letter-scene-v5 { mask-image:linear-gradient(transparent 40%,#0004 64%,#000 84%); }
.letter-energy div > span > svg { display:block; width:22px; height:22px; margin:0 auto 3px; fill:none; stroke:currentColor; stroke-width:1.3; }
@media(max-height:740px) { .letter-energy { bottom:15%; } }
@media(max-height:620px) { .letter-energy { bottom:12%; } }
/* Company signature stays at the foot of the second page. */
#letter.letter-v5 .signature {
 position:absolute; top:auto; bottom:max(18px,env(safe-area-inset-bottom));
 left:6%; right:6%; margin:0; padding:8px 0;
 text-align:center; font-size:clamp(11px,3cqi,15px); line-height:1.5;
 color:#fff4de; text-shadow:0 1px 4px #061b2e,0 0 10px #061b2e;
 z-index:2;
}
#letter.letter-v5 > .slide-content::after {
 content:""; position:absolute; bottom:0; left:0; right:0; height:12%;
 background:linear-gradient(transparent,#102c46cc); pointer-events:none; z-index:1;
}
/* Crop the map itself, then cover any card aspect ratio without exposing browser UI. */
.venue-map-preview .venue-map-crop { flex:1 1 0; aspect-ratio:auto; min-height:0; }
.venue-map-window { position:absolute; inset:0; display:block; width:100%; height:100%; overflow:hidden; }
/* Combined attendance / closing page. */
.merged-closing.inner-v7 #closingTitle { top:7%; height:10%; }
.merged-closing.inner-v7 .inner-title-flare { top:18%; }
.merged-closing.inner-v7 .closing-theme { top:21%; margin:0; font-size:clamp(15px,4cqi,21px); }
.merged-closing.inner-v7 .closing-date { top:27%; font-size:13px; }
.merged-closing.contact-slide.inner-v7 .dress-notice { top:34%; left:10%; right:10%; }
.merged-closing.contact-slide.inner-v7 .dress-notice h3 { font-size:15px; margin:0 0 9px; color:#d3bd98; }
.merged-closing.contact-slide.inner-v7 .dress-notice p { font-size:14px; line-height:1.8; }
.merged-closing.contact-slide.inner-v7 .contact-row { top:49%; left:16%; right:16%; padding-top:14px; }
.merged-closing.contact-slide.inner-v7 .contact-label { margin:0 0 5px; font-size:12px; }
.merged-closing.contact-slide.inner-v7 .contact-name { font-size:17px; margin:0; line-height:1.5; }
.merged-closing.contact-slide.inner-v7 .contact-phone { font-size:24px; line-height:1.5; }
.merged-closing.contact-slide.inner-v7 .call-button { margin-top:10px; min-height:42px; }
.merged-closing.inner-v7 .closing-host { bottom:max(18px,env(safe-area-inset-bottom)); text-shadow:0 1px 5px #102b40; }
.merged-closing.inner-v7 .closing-scene { object-position:center bottom; mask-image:linear-gradient(transparent 42%,#0005 72%,#000 88%); }
@media(max-height:620px) {
 .merged-closing.contact-slide.inner-v7 .dress-notice { top:33%; }
 .merged-closing.contact-slide.inner-v7 .dress-notice h3 { margin-bottom:5px; }
 .merged-closing.contact-slide.inner-v7 .contact-row { top:49%; padding-top:10px; }
 .merged-closing.contact-slide.inner-v7 .contact-phone { font-size:22px; }
 .merged-closing.contact-slide.inner-v7 .call-button { margin-top:6px; }
}
/* Keep accessible fact labels without displaying headings above the values. */
#letter .letter-facts .fact-label-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
#letter .letter-facts dd { margin-top:0; }
/* Give the invitation copy more space below the event heading. */
#letter.letter-v5 .letter-text { top:37%; }
.letter-brands { display:flex; align-items:center; justify-content:center; gap:clamp(16px,5cqi,26px); }
.letter-brand { width:38%; display:flex; flex-direction:column; align-items:center; gap:5px; }
.letter-brand img { width:100%; max-width:130px; height:clamp(23px,6cqi,32px); object-fit:contain; }
.letter-intro .letter-brand h3 { font-size:clamp(16px,4.2cqi,22px); letter-spacing:2px; line-height:1.2; margin:0; }
.brand-divider { width:1px; height:35px; background:#c4b28d80; }
@media(max-height:620px) { .letter-brand { gap:3px; } .letter-intro > p { margin-top:4px; font-size:12px; letter-spacing:0; } }
/* Coordinated but distinct dusk scenes on each inner page. */
#organizers.organizers-v6 .organizers-scene,
#agenda.inner-v7 .inner-scene,
#venue.inner-v7 .inner-scene,
#closing.merged-closing.inner-v7 .closing-scene {
 position:absolute; inset:0; width:100%; height:100%; max-width:none;
 object-fit:cover; object-position:center bottom; transform:none;
 filter:saturate(.78); opacity:1; mask-image:none;
}
#organizers.organizers-v6 .organizers-scene { mask-image:linear-gradient(#0009 60%,#0006 82%,#000 100%); }
#agenda.inner-v7 .inner-scene, #venue.inner-v7 .inner-scene { mask-image:linear-gradient(#0009 50%,#000a 75%,#000 100%); }
#closing.merged-closing.inner-v7 .closing-scene { mask-image:linear-gradient(#000b 50%,#0009 70%,#000 90%); }
#organizers.organizers-v6 .organizers-list, #agenda .agenda-list, #closing .closing-host { text-shadow:0 1px 5px #102b40; }
/* Refine first-page brand scale and vertical spacing. */
.letter-brand { width:41%; }
.letter-brand img { max-width:160px; height:clamp(30px,8cqi,42px); }
.letter-brand img[alt="IQ ENERGY 爱氢标识"] { filter:brightness(0) invert(1); }
.letter-intro > p { margin-top:14px; }
#letter.letter-v5 .letter-text { top:40%; }
@media(max-height:620px) {
 .letter-brand img { height:29px; }
 .letter-intro > p { margin-top:10px; }
 #letter.letter-v5 .letter-text { top:40%; }
}
/* Match the approved bilingual brush-script brand on the invitation poster. */
@font-face { font-family:IQBrush; src:url('assets/MaShanZheng-Regular.ttf') format('truetype'); font-display:swap; }
.iq-brand-lockup { width:100%; max-width:160px; height:clamp(30px,8cqi,42px); display:flex; align-items:center; justify-content:center; gap:6px; color:#fff; }
.iq-brand-lockup > svg { width:26%; height:100%; flex:none; overflow:hidden; filter:brightness(0) invert(1); }
.iq-brand-lockup > span { display:flex; flex-direction:column; align-items:center; gap:2px; }
.iq-brand-lockup strong { font-family:IQBrush,cursive; font-size:clamp(18px,4.5cqi,25px); font-weight:400; line-height:1.1; letter-spacing:.5px; white-space:nowrap; }
.iq-brand-lockup small { font-family:Georgia,'Times New Roman',serif; font-size:clamp(7px,1.75cqi,10px); line-height:1.1; letter-spacing:.7px; }
@media(max-height:620px) { .iq-brand-lockup { height:29px; } }