/* Home v2: header bar, dropdown nav, hero + slider, marquee, service tabs. Uses only the existing palette variables (--brand, --brandsoft, --line...), so colours follow app.css. */
.th{background:var(--brand);color:#fff;position:sticky;top:0;z-index:60}
.th .in{display:flex;align-items:center;gap:12px;min-height:60px}
.brand2{display:flex;align-items:center;gap:12px;background:none;border:0;color:#fff;padding:6px 0;flex:1;min-width:0;text-align:left}
.brand2 img{width:44px;height:44px;border-radius:50%;background:#fff}
.brand2 b{font-family:var(--serif);font-size:1.3125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tools{display:flex;align-items:center;gap:16px}
.tools button{background:none;border:0;color:#fff;padding:4px}
.tools .hl{font-size:0.9062rem}.tools .lg{font-size:0.875rem}
.fs button{font-weight:700;padding:2px 3px}.fs [data-fs="0"]{font-size:0.8125rem}.fs [data-fs="1"]{font-size:1rem}.fs [data-fs="2"]{font-size:1.1875rem}
.tools .exit{border:1px solid #fff;border-radius:6px;padding:2px 10px;font-size:0.8125rem;font-weight:700}
.uico svg{width:34px;height:34px;display:block}
.hamb{display:none;flex-direction:column;gap:4px;width:40px;height:40px;justify-content:center;align-items:center}
.hamb span{display:block;width:22px;height:2px;background:#fff;border-radius:2px}

.mnav{background:var(--card);box-shadow:0 2px 6px rgba(31,38,38,.12);position:sticky;top:60px;z-index:55}
.mnav .in{display:flex;align-items:center;gap:6px}
.mnav .homei{background:none;border:0;color:var(--brand);padding:12px 8px}.mnav .homei svg{width:26px;height:26px}
.dd{position:relative}
.ddb{background:none;border:0;padding:15px 12px;font-weight:600;font-size:0.9688rem;color:var(--ink)}
.ddb .car{font-size:0.75rem;color:var(--muted)}
.ddm{display:none;position:absolute;left:0;top:100%;min-width:220px;background:var(--card);border:1px solid var(--line);border-top:3px solid var(--brand);border-radius:0 0 10px 10px;box-shadow:0 8px 20px rgba(31,38,38,.12);padding:6px 0}
.dd:hover .ddm,.dd:focus-within .ddm,.dd.open .ddm{display:block}
.ddm button,.ddm a{display:block;width:100%;text-align:left;background:none;border:0;padding:10px 16px;color:var(--ink);text-decoration:none;font-size:0.9375rem}
.ddm button:hover,.ddm a:hover{background:var(--brandsoft);color:var(--brand)}
/* hero */
.hero2{display:grid;grid-template-columns:minmax(240px,1fr) 2.1fr;gap:18px;padding-top:22px}
.lead2{background:var(--brandsoft);border-radius:12px;padding:18px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.lead2 img{width:200px;height:200px;border-radius:50%;object-fit:cover;border:4px solid #fff;box-shadow:0 2px 10px rgba(31,38,38,.15)}
.lead2 p{font-size:1rem;line-height:1.7;color:var(--ink)}
.sl{position:relative;border-radius:12px;overflow:hidden;background:var(--ink);aspect-ratio:16/8;min-height:220px}
.sl .s{position:absolute;inset:0;opacity:0;transition:opacity .6s}.sl .s.on{opacity:1}
.sl img{width:100%;height:100%;object-fit:cover;display:block}
.sl .cap{position:absolute;left:0;right:0;bottom:0;background:rgba(31,38,38,.62);color:#fff;text-align:center;padding:10px 14px}
.sl .cap b{display:block;font-size:1.0625rem}.sl .cap span{font-size:0.9062rem}
.sl .ar{position:absolute;top:50%;transform:translateY(-50%);background:rgba(255,255,255,.85);border:0;border-radius:50%;width:38px;height:38px;color:var(--brand);font-size:1.25rem;line-height:1}
.sl .pv{left:10px}.sl .nx{right:10px}
.sl .dots{position:absolute;top:10px;right:12px;display:flex;gap:6px}.sl .dots button{width:10px;height:10px;border-radius:50%;border:0;background:rgba(255,255,255,.55);padding:0}.sl .dots .on{background:#fff}
/* marquee */
.mq{overflow:hidden;white-space:nowrap;margin:16px 0 4px;color:#c0262d;font-weight:600;font-size:1.0625rem}
.mq .t{display:inline-block;padding-left:100%;animation:mq 30s linear infinite}
.mq:hover .t{animation-play-state:paused}.mq .t button{background:none;border:0;color:inherit;font-weight:600;padding:0;margin-right:60px}
@keyframes mq{to{transform:translateX(-100%)}}
@media (prefers-reduced-motion:reduce){.mq .t{animation:none;padding-left:0;white-space:normal}.sl .s{transition:none}}
/* tabs */
.tabs2{display:flex;gap:2px;border-bottom:1px solid var(--line);margin-top:14px;overflow-x:auto}
.tabs2 button{background:none;border:0;padding:12px 22px;font-weight:600;color:var(--muted);border-radius:10px 10px 0 0;white-space:nowrap}
.tabs2 button[aria-selected="true"]{background:var(--brand);color:#fff}
.svc{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;padding:20px 0 34px}
.sc{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px;text-align:left;display:flex;flex-direction:column;gap:8px;transition:box-shadow .2s}
.sc:hover{box-shadow:0 6px 18px rgba(31,38,38,.1);border-color:var(--line2)}
.sc .ic{width:48px;height:48px;border-radius:50%;background:var(--brandsoft);color:var(--brand);display:grid;place-items:center;font-size:1.375rem}
.sc b{font-size:1.0625rem;color:var(--brand)}.sc span{color:var(--muted);font-size:0.9375rem}
.trk{display:flex;gap:10px;flex-wrap:wrap;max-width:560px}.trk input{flex:1;min-width:200px;font:inherit;padding:11px 12px;border:1px solid #cdbfbf;border-radius:10px}
.trk-out{margin-top:14px;max-width:560px}
@media (max-width:860px){
 .hamb{display:flex}.tools .hl,.tools .lg{display:none}.tools{gap:8px}.fs{display:none}
 .mnav{display:none;position:static}.mnav.open{display:block}
 .mnav .in{flex-direction:column;align-items:stretch;gap:0;padding-block:6px}
 .dd .ddm{position:static;display:none;box-shadow:none;border:0;border-left:3px solid var(--brand);border-radius:0;margin-left:12px}
 .dd.open .ddm{display:block}.dd:hover .ddm{display:none}.dd.open:hover .ddm{display:block}
 .ddb{width:100%;text-align:left;display:flex;justify-content:space-between}
 .mnav .homei{text-align:left}
 .mnav .mx{display:flex;gap:10px;padding:8px 12px;flex-wrap:wrap}
 .hero2{grid-template-columns:1fr}.lead2{flex-direction:row;text-align:left}.lead2 img{width:96px;height:96px}
 .brand2 b{font-size:1.0625rem}
}
@media (min-width:861px){.mnav .mx{display:none}}
.fs{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap}.fs button{width:auto;line-height:1}
.ddb .car{font-size:0.875rem}
.hero2>*{min-width:0}
@media (max-width:860px){.tools .fs{display:none}.sl{min-height:0;aspect-ratio:16/10}}
/* staff login icons (left) */
.staff{display:flex;gap:10px;align-items:center;padding-right:10px;margin-right:2px;border-right:1px solid rgba(255,255,255,.35)}
.sico{display:flex;flex-direction:column;align-items:center;color:#fff;text-decoration:none;line-height:1.1}
.sico svg{width:32px;height:32px;display:block}.sico small{font-size:0.6875rem;margin-top:2px;white-space:nowrap}
.sico:hover small{text-decoration:none}
@media (max-width:860px){.staff{gap:6px;padding-right:6px}.sico svg{width:28px;height:28px}.sico small{font-size:0.5938rem}.brand2 img{width:36px;height:36px}.brand2 b{font-size:0.9375rem}}
@media (max-width:400px){.sico small{display:none}}
.staff{border-right:0;padding-right:0;margin-right:0;padding-left:12px;border-left:1px solid rgba(255,255,255,.35)}
@media (max-width:860px){.staff{padding-left:6px}.sico small{display:none}}
/* v5 header pills (one language) */
.staff{gap:8px;padding-left:12px}
.pill{display:inline-flex;align-items:center;gap:7px;height:38px;padding:0 16px;border-radius:999px;font-family:inherit;font-weight:600;font-size:0.875rem;line-height:1;color:#fff;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background .15s,border-color .15s}
.pill svg{width:18px;height:18px;flex:none;display:block}
.pill-o{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.35)}.pill-o svg{color:#f5c84c}
.pill-o:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.6)}
.pill-f{background:#9b1c22;border:1px solid #9b1c22;margin-left:8px}.pill-f:hover{background:#b0242b}
.pill:focus-visible{outline:2px solid #f5c84c;outline-offset:2px}
.mnav .mx .mstaff{display:none}
@media (max-width:1100px){.pill{padding:0 12px;font-size:0.8125rem;height:34px}}
@media (max-width:860px){.mnav .mx .mstaff{display:inline-flex}.staff{gap:6px;padding-left:6px}.pill-o .pl{display:none}.pill-o{width:34px;padding:0;justify-content:center}}
@media (max-width:480px){.pill{width:34px;height:34px;padding:0;justify-content:center}.pill .pl{display:none}.pill-f{margin-left:4px}.mnav .mx .mstaff{display:inline-flex}}
.tools .pill-f,.tools button.pill-f{background:#9b1c22;border:1px solid #9b1c22;color:#fff;border-radius:999px;padding:0 16px}.tools button.pill-f:hover{background:#b0242b}
@media (max-width:1100px){.tools button.pill-f{padding:0 12px}}@media (max-width:480px){.tools button.pill-f{padding:0}}
.mnav .mx .mstaff{text-decoration:none}
/* v6 account dropdown */
.acct{position:relative;display:inline-flex}
.acm{position:absolute;right:0;top:calc(100% + 8px);min-width:220px;background:#fff;border-radius:14px;box-shadow:0 12px 32px rgba(60,10,10,.25);padding:6px;z-index:60;border:1px solid rgba(122,29,29,.15)}
.acm[hidden]{display:none}
.acm a{display:block;padding:10px 12px;border-radius:9px;color:#7a1d1d;font-weight:600;font-size:0.875rem;text-decoration:none;white-space:nowrap}
.acm a:hover{background:#fbefe6}
.acm a:focus-visible{background:#fbefe6;outline:2px solid #7a1d1d;outline-offset:2px}
.acsep{height:1px;background:rgba(122,29,29,.15);margin:5px 6px}
.pill-f[aria-expanded=true]{background:#b0242b}
/* v7 flat tabs */
.mnav{background:#fff;box-shadow:none;border-top:2px solid #efe3cc;border-bottom:1px solid #efe3cc}
.tabs7{display:flex;justify-content:flex-start;gap:4px;width:100%;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs7::-webkit-scrollbar{display:none}
.tabs7 button{flex:none;background:none;border:0;border-bottom:4px solid transparent;padding:14px 18px 10px;font-family:inherit;font-weight:700;font-size:1.0625rem;line-height:1.2;color:#6b5a4c;cursor:pointer;white-space:nowrap}
.tabs7 button:hover{color:#7a1d1d}
.tabs7 button.help{color:#7a1d1d}
.tabs7 button.on{color:#7a1d1d;border-bottom-color:#7a1d1d}
.tabs7 button:focus-visible{outline:2px solid #7a1d1d;outline-offset:-2px}
@media (max-width:860px){
 .mnav,.mnav.open{display:block;position:sticky}
 .mnav .in{flex-direction:row;flex-wrap:wrap;padding:0}.mnav .mx{width:100%;border-top:1px solid #efe3cc}
 .tabs7{justify-content:flex-start;gap:0}.tabs7 button{font-size:0.9375rem;padding:12px 14px 9px}
 .mnav .mx{display:none}.mnav.open .mx{display:flex}
}
