/* ===== product-first-arctic.css v0 — blocks carried only by this product, in page order ===== */
/* pay rule (from main style 00762d1c; decision 12-#③: FA/OOAL only) */


/* 2026-10-03 senior-friendly: no 14px labels */
.fx-pay-n,.fx-pay-w{font-size:16px!important}
/* --- product-ed.css --- */
/* ZeL product pages · visual migration to the Editorial direction locked 2026-10-02.
   Structure untouched: this file only re-points colour, rule and type tokens.
   Loaded after each page's inline <style>. */
:root{
  --cream:#FAF9F6;--ink:#3A3A3A;--gold:#C9A96B;
  --accent:#4BA8D1;--blue:#4BA8D1;--blue-lt:#4BA8D1;--blue-dk:#3A8DB4;
  --tx:#3A3A3A;--blue-txt:#64615A;--dim:#55524C;--faint:#64615A;--line:rgba(201,169,107,.45);
  --fxg:#4BA8D1;--fxgt:#64615A;--fxgold:#8A6D2F;--fxcard:#FFFFFF;--fxln:rgba(201,169,107,.5);
}
body{background:#FAF9F6;color:#3A3A3A}
/* former navy grounds (route / stays / investment) become the warm panel */
.fx-s.dk{--fxdk:#F4F2EE;--fxdk-tx:#3A3A3A;--fxdk-dim:#55524C;--fxdk-ln:rgba(201,169,107,.5)}
.fx-s.dk{background:var(--fxdk);color:var(--fxdk-tx)}
.fx-s.dk h2,.fx-s.dk h3{color:#3A3A3A}
.fx-s.dk .fx-h{border-bottom-color:var(--fxdk-ln)}
.fx-s.dk .fx-h-n{color:var(--fxdk-dim)}
.fx-s.dk .fx-h-n:after{background:var(--fxg)}
.fx-s.dk .fx-h-l{border-left-color:var(--fxdk-ln);color:var(--fxdk-dim)}
.fx-s.dk .fx-h{border-bottom-color:rgba(201,169,107,.55)}
.fx-s.dk .fx-h-n{color:#64615A}
.fx-s.dk .fx-h-n:after{background:var(--fxg)}
.fx-s.dk .fx-h h2{color:#3A3A3A}
.fx-s.dk .fx-h-l{border-left-color:rgba(201,169,107,.55);color:#64615A}
.fx-s.dk .fx-h-r{color:#55524C}
.fx-s.dk .fx-liv + .fx-liv,.fx-s.dk .fx-stay-foot{border-top-color:var(--fxdk-ln)}
.fx-s.dk .fx-liv-eb{color:var(--fxg)}
.fx-s.dk .fx-liv-eb:after{background:var(--fxdk-ln)}
.fx-s.dk .fx-liv-h{color:#3A3A3A}
.fx-s.dk .fx-liv-nm{color:var(--fxg)}
.fx-s.dk .fx-liv-me,.fx-s.dk .fx-stay-foot,.fx-s.dk .fx-stay-note2{color:var(--fxdk-dim)}
.fx-s.dk .fx-liv-p{color:var(--fxdk-tx)}
.fx-s.dk .fx-stay-foot b{color:#3A3A3A}
.fx-s.dk .fx-liv-m,.fx-s.dk .fx-liv-m img,.fx-s.dk .fx-liv-m video{background:rgba(58,58,58,.04)}
.fx-s.dk .fx-h-l,.fx-s.dk .fx-h-n{color:#55524C}
.fx-s.dk .fx-h-r{color:#3A3A3A}
.fx-s.dk .fx-meals,.fx-s.dk .fx-two{border-top-color:var(--fxdk-ln)}
.fx-s.dk .fx-meals h3,.fx-s.dk .fx-two h3{color:var(--fxg)}
/* small labels stay neutral (blue is for large type and buttons only) */
.fx-s.dk .fx-liv-eb,.fx-s.dk .fx-meals h3,.fx-s.dk .fx-two h3{color:#64615A}
.fx-s.dk .fx-liv-nm{color:#3A3A3A}

/* text that was hard-coded light for the old navy ground */
.fx-s.dk .fx-dayc-st b,.fx-s.dk .fx-inv-note b,.fx-s.dk .fx-meals li b,.fx-s.dk .fx-tbl td,
.fx-s.dk .fx-calc-p,.fx-s.dk .fx-inv-cta p,.fx-s.dk .fx-calc-opts button .n{color:#3A3A3A}
.fx-s.dk .no li i{color:#64615A}
/* price calculator on the light panel */
.fx-s.dk .fx-calc-opts button{background:#FAF9F6;color:#55524C;border-color:rgba(201,169,107,.5)}
.fx-s.dk .fx-calc-opts button:hover{background:#FFFFFF}
.fx-s.dk .fx-calc-opts button[aria-pressed="true"],.fx-s.dk .fx-calc-opts button[aria-pressed="true"] .n{background:#4BA8D1;color:#fff}

/* buttons: ZeL Blue, white text; quiet outline on light grounds */
.fx-btn.gold{background:#4BA8D1;border-color:#4BA8D1;color:#fff}
.fx-btn.gold:hover{background:#0F2A44;border-color:#0F2A44;color:#fff}
.fx-s.dk .fx-btn.ghost{border-color:#3A3A3A;color:#3A3A3A}
.fx-s.dk .fx-btn.ghost:hover{background:#3A3A3A;border-color:#3A3A3A;color:#fff}

/* the sticky enquiry bar and photo grounds keep a navy, now the brand Deep Navy */
.fx-bar{background:rgba(15,42,68,.96)!important}

/* small labels neutral, not blue */
.fx-calc-s,.fx-dayc-note b,.fx-s.dk b.fx-liv-eb{color:#64615A}
.fx-cover .eb{color:rgba(255,255,255,.9)}
.fx-aurora .fx-when h3{color:rgba(244,239,230,.9)}
/* route map: the old teal line becomes ZeL Blue */
.fx-trail{stroke:#4BA8D1}
.fx-veh-h{fill:#4BA8D1}
.fx-base{stroke:rgba(75,168,209,.32)}
/* hero primary button and the NZ map line */
.fx-cover .btn.pri{background:#4BA8D1;border-color:#4BA8D1;color:#fff}
.fx-cover .btn.pri:hover{background:#0F2A44;border-color:#0F2A44;color:#fff}
svg [stroke="#539EBB"]{stroke:#4BA8D1}
svg [fill="#539EBB"]{fill:#4BA8D1}
svg .zl{fill:#4BA8D1;color:#4BA8D1}
/* phone: the long statement line in 02 was clipped (keep-all stops CJK from wrapping) */
@media (max-width:700px){html[lang="zh-Hans"] .fx-idea-h{word-break:normal;line-break:strict}}
@media (max-width:700px){html[lang="zh-Hans"] .fx-idea-h{text-wrap:pretty}}

/* 2026-10-03 · one heading style across the four product pages: Lora sentence case, as on the Editorial pages (High Alps already) */
.fx-h h2{text-transform:none;letter-spacing:0}
html[lang="zh-Hans"] .fx-h h2{letter-spacing:.02em}
/* 2026-10-03 · nothing under 15px on phones (older readers) */
.ax-rh-h span,.ax-rh-t,.ax-rh-n,.ax-mv-l,.ax-mv-x dt,.nz-inset-l{font-size:15px!important}
/* 2026-10-04 · footer back to Deep Navy: the 10-03 colour move re-pointed --ink to Warm Ink #3A3A3A, which the shared footer also uses */
footer{background:#0F2A44!important}

/* --- zu-cover-sub a28e0bf9 --- */
/* cover subtitle: display line, not body text — the 14px floor in zel-unify.css had set it to body size (2026-10-07) */@media(min-width:821px){html.zu #top p.pg-hero-s{font-size:calc(20.8px / var(--z))!important}}
/* --- zu-dbd 4ad12928 --- */
/* day-by-day paragraph only: 14.4 -> 16px on screen (2026-10-07) */@media(min-width:821px){html.zu body.zds #route .dd-p{font-size:calc(16px / var(--z))!important}}
/* --- zu-pp-priv a34f0daf --- */
/* 2026-10-15 ZeL private product page system v1. Page-level; product-ed.css untouched. */@media(min-width:901px){.dbd .rc-map svg text[font-family^="Lora"]{font-size:28px}.dbd .rc-map svg text[font-size="16"]{font-size:23px}.dbd .rc-map svg text[font-size="17"]{font-size:22px}}@media(max-width:900px){.dbd .rc-l{position:static!important;margin:0!important;padding:0 0 8px!important;border-bottom:0!important}.dbd .rc-day{display:none!important}.dbd .rc-map svg text{display:none}.dbd .rc-leg{display:block!important;margin-top:12px}.dbd .rc-leg li a{font-size:17px}.dbd .rc-now{display:block!important;position:sticky;top:72px;z-index:5;background:#FAF9F6;border-bottom:1px solid #D9D4CA;padding:10px 0;font:500 16px/1.3 Jost,system-ui,sans-serif;color:#3A3A3A}.dbd .rc-now:empty{display:none!important}.dbd .rc-now b{color:#26769C;font-weight:500;margin-right:8px}}
/* --- ji-2026-10-16 9f8d8046 --- */

/* Journey Information Icon System (2026-10-17, same template as THE TEA ROAD). One definition for every icon: outline,
   24-unit grid, 1.5 stroke, round joins, one colour. Train and plane are defined for later use. No fills, badges or emoji. */
:root{--ji-color:#2E7C93;--ji-size:24px;--ji-car:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3.5 16.5v-4l1.6-.8 1.8-3.6c.3-.6.9-1 1.6-1h7c.7 0 1.3.4 1.6 1l1.8 3.6 1.6.8v4'/%3E%3Cpath d='M5.3 11.7h13.4'/%3E%3Ccircle cx='7.5' cy='16.5' r='1.7'/%3E%3Ccircle cx='16.5' cy='16.5' r='1.7'/%3E%3Cpath d='M9.2 16.5h5.6M3.5 16.5h2.3M18.2 16.5h2.3'/%3E%3C/svg%3E");--ji-bed:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6v13M3 15.5h18M21 19v-6c0-1.1-.9-2-2-2h-8v4.5'/%3E%3Ccircle cx='6.9' cy='12.4' r='1.7'/%3E%3C/svg%3E");--ji-train:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6' y='3.5' width='12' height='13' rx='2.5'/%3E%3Cpath d='M6 10.5h12M9 20.5l1.5-4M15 20.5l-1.5-4'/%3E%3Ccircle cx='9.5' cy='13.5' r='.6'/%3E%3Ccircle cx='14.5' cy='13.5' r='.6'/%3E%3C/svg%3E");--ji-plane:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10.5 13.5 4 11l1-1.5 7 .5 4.5-4.5c.8-.8 2-.8 2.5-.3s.5 1.7-.3 2.5L14.2 12l.5 7-1.5 1-2.5-6.5'/%3E%3C/svg%3E")}
/* tonight: the label word stays in the page for screen readers; on screen the bed icon replaces it */
.dbd .dd-s{display:grid;grid-template-columns:var(--ji-size) minmax(0,1fr);column-gap:12px;align-items:start}
.dbd .dd-s>span:first-child{position:relative;display:block;min-width:0;width:var(--ji-size);height:1lh;margin:0;overflow:visible;font:inherit;color:transparent!important;white-space:nowrap;text-indent:-200vw}
.dbd .dd-s>span:first-child::before{content:"";position:absolute;left:0;top:50%;width:var(--ji-size);height:var(--ji-size);margin-top:calc(var(--ji-size) / -2);background:var(--ji-color);-webkit-mask:var(--ji-bed) center/contain no-repeat;mask:var(--ji-bed) center/contain no-repeat}
/* hotel name first, place / room and "or similar" underneath, same size */
.dbd .dd-s .dd-h,.dbd .dd-s .dd-h span{display:block;min-width:0;margin:0;font:inherit;letter-spacing:0!important;text-transform:none!important}
.dbd .dd-s .dd-hn{font-weight:500;color:#3A3A3A}
.dbd .dd-s .dd-hl{color:#64615A;margin-top:2px}
/* the day's activities: one per line with a small neutral bullet (replaces the run-on list with gold dots) */
.dbd .dd-l{display:block}
.dbd .dd-l li{position:relative;margin:0;padding-left:20px;background:radial-gradient(circle,#8A867D 0 2.5px,transparent 3px) 0 calc(.5lh - 3px)/6px 6px no-repeat}
.dbd .dd-l li+li{margin-top:4px}
.dbd .dd-l li::after,.dbd .dd-l li:not(:last-child)::after{content:none!important;display:none!important}
/* desktop: map 40, itinerary 60 (was 1.15fr : 1fr, about 53 : 47) */
@media(min-width:901px){.dbd .rc{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}}
