.family-section{--family-navy:#0e2d54;--family-muted:#526f93;color:var(--family-navy);background:#fff;scroll-margin-top:90px;overflow:hidden}
.family-wrap{padding-block:76px 56px}
.family-intro{text-align:center;margin:0 auto 35px;position:relative;z-index:2}
.family-intro .eyebrow{color:var(--blue);font-size:12px;letter-spacing:.2em;margin:0 0 19px}
.family-intro .eyebrow:after{content:'';display:block;width:48px;height:2px;background:var(--orange);margin:13px auto 0}
.family-intro h2{font-size:clamp(32px,3.9vw,52px);font-weight:800;line-height:1.12;letter-spacing:-.04em;margin:0 0 15px}
.family-intro h2 span{color:var(--orange)}
.family-intro>p:last-child{font-size:clamp(14px,1.35vw,18px);line-height:1.5;color:var(--family-muted);margin:0}
.family-scene{position:relative;aspect-ratio:2.4;min-height:420px;isolation:isolate}
.family-map{position:absolute;left:17.4%;top:-.4%;width:65%;height:96%;object-fit:fill;mask-image:linear-gradient(to bottom,#0008 0 66%,#000 72% 100%);pointer-events:none;transform:translateY(var(--family-shift,0px));z-index:0}
.family-routes{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}
.family-route-mask{fill:none;stroke:#fff;stroke-width:8;stroke-dasharray:1;stroke-dashoffset:0}
.family-motion-ready .family-route-mask{stroke-dashoffset:1;transition:stroke-dashoffset 1.5s cubic-bezier(.2,.6,.3,1) var(--family-delay)}
.family-motion-ready.is-visible .family-route-mask{stroke-dashoffset:0}
.family-route{fill:none;stroke:var(--orange);stroke-width:1.5;stroke-dasharray:4 4;stroke-linecap:round;opacity:.82;transition:opacity .25s,stroke-width .25s}
.family-section.is-highlighting .family-route{opacity:.28}
.family-section.is-highlighting .family-route-group.is-active .family-route{opacity:1;stroke-width:2.3}
.family-pin path,.family-origin path{fill:var(--orange)}.family-pin circle,.family-origin circle{fill:#fff}
.family-pin{filter:drop-shadow(0 2px 3px #b163341a)}
.family-motion-ready .family-pin{opacity:0;transition:opacity .45s var(--family-delay)}
.family-motion-ready.is-visible .family-pin{opacity:1}
.family-travel-dot{fill:var(--orange);stroke:#fff;stroke-width:1.2;opacity:0;filter:drop-shadow(0 1px 2px #ff690020)}
.family-route-group.is-travelling .family-travel-dot{opacity:1}
.family-hub{position:absolute;left:54.8%;top:78.3%;transform:translate(-50%,-50%);width:8.5%;min-width:0;max-width:120px;padding:7px 10px;border-radius:30px;background:#fff;box-shadow:0 3px 15px #0e2d5408;z-index:2;pointer-events:none}
.family-hub img{width:100%;height:auto;display:block}
.family-stories{position:absolute;inset:0;z-index:3}
.family-card{position:absolute;display:grid;grid-template-columns:clamp(52px,5.1vw,76px) minmax(0,1fr);gap:12px;align-items:start;width:25%;min-height:120px;border-radius:28px;background:#fff;padding:13px 14px;box-shadow:0 8px 35px #386a9805;transition:transform .35s,box-shadow .35s}
.family-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #386a980d}
.family-card-us{left:3%;top:0}.family-card-uk{left:37.5%;top:0}.family-card-china{right:3%;top:0}
.family-card-uae{left:0;top:39%}.family-card-canada{right:0;top:36%}.family-card-singapore{left:14%;bottom:0}.family-card-nz{right:0;bottom:0}
.family-portrait{aspect-ratio:1;border-radius:50%;background-image:url('assets/family/shopper-sprite.png');background-repeat:no-repeat;background-color:#edf4fa}
.family-card-copy{min-width:0;padding-right:35px}
.family-flag{display:block;width:24px;height:16px;border-radius:6px;overflow:hidden;margin:0 0 6px}
.family-member-label{font-size:10px;line-height:1.4;color:var(--family-muted);margin:0 0 2px}
.family-card h3{font-size:clamp(11px,1.05vw,15px);font-weight:700;line-height:1.2;margin:0 0 8px;letter-spacing:-.015em;color:var(--family-navy)}
.family-card blockquote{font-size:clamp(10px,.95vw,13px);line-height:1.45;margin:0;color:#345982}
.family-product{position:absolute;right:9px;top:44px;width:42px;height:49px;background-image:url('assets/family/shopper-sprite.png');background-repeat:no-repeat;border-radius:50%;background-color:#fff}
.family-spark{position:absolute;right:6px;top:24px;width:22px;height:22px;fill:none;stroke:var(--orange);stroke-width:2;stroke-linecap:round}
.family-card-uae{width:25.5%}.family-card-uae .family-card-copy{padding-right:32px}
.family-benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:48px;gap:0}
.family-benefit{display:flex;gap:16px;align-items:flex-start;padding:0 24px;border-left:1px solid #e6f0f9}
.family-benefit:first-child{border-left:0;padding-left:30px}.family-benefit:last-child{padding-right:0}
.family-benefit svg{width:40px;height:40px;flex-shrink:0;fill:none;stroke:var(--family-navy);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.family-benefit svg .orange{stroke:var(--orange)}
.family-benefit h3{font-size:clamp(14px,1.35vw,18px);font-weight:700;letter-spacing:-.015em;line-height:1.2;margin:0 0 8px}
.family-benefit p{color:var(--family-muted);font-size:clamp(11px,1.1vw,14px);line-height:1.5;margin:0}
.family-example-note{text-align:center;font-size:10px;color:#8294a8;line-height:1.5;margin:27px 0 0}
@media(min-width:1350px){.family-card{min-height:136px}.family-member-label{font-size:12px}.family-flag{width:27px;height:18px}.family-card-copy{padding-right:42px}.family-product{width:51px;height:56px;top:50px}.family-card-uae .family-card-copy{padding-right:42px}.family-spark{right:6px;top:25px}}
@media(max-width:1100px) and (min-width:901px){.family-card{gap:9px;padding:11px;border-radius:23px}.family-card-copy{padding-right:27px}.family-product{width:34px;height:42px;right:7px}.family-card-uae .family-card-copy{padding-right:27px}.family-benefit{padding-inline:15px;gap:11px}.family-benefit:first-child{padding-left:10px}.family-benefit svg{width:34px;height:34px}}
@media(max-width:900px){.family-wrap{padding-block:55px 45px}.family-intro{margin-bottom:22px}.family-intro h2{font-size:36px}.family-intro>p:last-child{font-size:14px}.family-scene{aspect-ratio:auto;min-height:0;padding-top:260px}.family-map{left:9%;top:0;width:82%;height:250px;object-fit:contain;transform:none!important}.family-routes{display:none}.family-hub{left:56%;top:204px;width:64px;min-width:0;padding:4px 6px}.family-stories{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:15px}.family-card{position:relative;inset:auto!important;width:100%;min-height:136px;grid-template-columns:64px minmax(0,1fr);padding:14px;border:1px solid #edf4fa;border-radius:22px;gap:12px;box-shadow:none}.family-card:last-child{grid-column:1/-1;max-width:calc(50% - 7.5px);justify-self:center}.family-member-label{font-size:11px}.family-card h3{font-size:14px}.family-card blockquote{font-size:12px}.family-card-copy,.family-card-uae .family-card-copy{padding-right:40px}.family-product{width:47px;height:53px;top:48px;right:12px}.family-benefits{grid-template-columns:1fr 1fr;gap:27px 20px;margin-top:35px}.family-benefit,.family-benefit:first-child,.family-benefit:last-child{border:0;padding:0;gap:15px}.family-benefit h3{font-size:17px}.family-benefit p{font-size:13px}.family-example-note{max-width:420px;margin-inline:auto}}
@media(max-width:560px){.family-wrap{padding-block:45px 35px}.family-intro .eyebrow{font-size:10px}.family-intro h2{font-size:30px;line-height:1.15}.family-intro h2 br{display:none}.family-intro>p:last-child{font-size:13px;max-width:360px;margin-inline:auto}.family-intro>p:last-child br{display:none}.family-scene{padding-top:220px}.family-map{left:0;width:100%;height:205px}.family-hub{top:169px;left:57%;width:54px;padding:3px 4px}.family-stories{grid-template-columns:1fr;gap:13px}.family-card{grid-template-columns:72px minmax(0,1fr);min-height:124px;padding:15px 17px;gap:15px}.family-card:last-child{grid-column:auto;max-width:none}.family-card h3{font-size:16px;margin-bottom:7px}.family-card blockquote{font-size:13px;max-width:190px}.family-card-copy,.family-card-uae .family-card-copy{padding-right:54px}.family-member-label{font-size:11px}.family-flag{width:25px;height:17px}.family-product{width:54px;height:58px;right:15px;top:47px}.family-spark{right:13px;top:24px}.family-benefits{grid-template-columns:1fr;gap:24px;margin-top:30px}.family-benefit h3 br,.family-benefit p br{display:none}.family-benefit h3{font-size:16px;margin-bottom:5px}.family-benefit p{font-size:13px}.family-benefit svg{width:37px;height:37px}.family-example-note{font-size:10px;margin-top:23px}}
@media(prefers-reduced-motion:reduce){.family-route-mask{transition:none!important;stroke-dashoffset:0!important}.family-pin{transition:none!important;opacity:1!important}.family-map{transform:none!important}.family-card{transition:none}.family-card:hover{transform:none}.family-travel-dot{display:none}}
