@harshit-wander/component-lib 0.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.cjs ADDED
@@ -0,0 +1,4828 @@
1
+ "use client";
2
+ 'use strict';
3
+
4
+ var react = require('react');
5
+ var styled30 = require('styled-components');
6
+ var jsxRuntime = require('react/jsx-runtime');
7
+ var polished = require('polished');
8
+
9
+ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
10
+
11
+ var styled30__default = /*#__PURE__*/_interopDefault(styled30);
12
+
13
+ // src/components/BrandLogo/BrandLogo.tsx
14
+ var containerStyles = styled30.css`
15
+ display: inline-flex;
16
+ flex-direction: column;
17
+ align-items: center;
18
+ justify-content: center;
19
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
20
+ padding: ${({ theme: theme2 }) => theme2.spacing.md};
21
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
22
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
23
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
24
+ text-decoration: none;
25
+ color: inherit;
26
+ `;
27
+ var Box = styled30__default.default.div`
28
+ ${containerStyles}
29
+ `;
30
+ var LinkBox = styled30__default.default.a`
31
+ ${containerStyles}
32
+
33
+ &:hover {
34
+ border-color: ${({ theme: theme2 }) => theme2.colors.primary};
35
+ }
36
+ `;
37
+ var Logo = styled30__default.default.img`
38
+ height: 50px;
39
+ width: auto;
40
+ max-width: 100%;
41
+ object-fit: contain;
42
+ `;
43
+ var Name = styled30__default.default.span`
44
+ ${({ theme: theme2 }) => theme2.typography.cardLabel}
45
+ color: ${({ theme: theme2 }) => theme2.colors.text};
46
+ `;
47
+ var BrandLogo = react.forwardRef(
48
+ ({ logo, name, href, ...rest }, ref) => {
49
+ const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
50
+ /* @__PURE__ */ jsxRuntime.jsx(Logo, { src: logo, alt: name }),
51
+ /* @__PURE__ */ jsxRuntime.jsx(Name, { children: name })
52
+ ] });
53
+ if (href) {
54
+ return /* @__PURE__ */ jsxRuntime.jsx(
55
+ LinkBox,
56
+ {
57
+ ref,
58
+ href,
59
+ target: "_blank",
60
+ rel: "noopener noreferrer",
61
+ ...rest,
62
+ children: content
63
+ }
64
+ );
65
+ }
66
+ return /* @__PURE__ */ jsxRuntime.jsx(Box, { ref, ...rest, children: content });
67
+ }
68
+ );
69
+ BrandLogo.displayName = "BrandLogo";
70
+ var HEADER_TINT = "#E0FAFF";
71
+ var cardChrome = styled30.css`
72
+ background: ${({ theme: theme2 }) => theme2.colors.background};
73
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
74
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
75
+ overflow: hidden;
76
+ `;
77
+ var plainChrome = styled30.css`
78
+ background: transparent;
79
+ `;
80
+ var Form = styled30__default.default.form`
81
+ display: flex;
82
+ flex-direction: column;
83
+ width: 100%;
84
+ max-width: ${({ $maxWidth }) => $maxWidth};
85
+ ${({ $variant }) => $variant === "card" ? cardChrome : plainChrome}
86
+ `;
87
+ var Header = styled30__default.default.div`
88
+ display: flex;
89
+ align-items: flex-end;
90
+ justify-content: space-between;
91
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
92
+ width: 100%;
93
+ padding: 24px 32px 16px;
94
+ background: ${HEADER_TINT};
95
+
96
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
97
+ padding: 20px 24px 14px;
98
+ }
99
+ `;
100
+ var HeaderText = styled30__default.default.div`
101
+ display: flex;
102
+ flex-direction: column;
103
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
104
+ flex: 1 1 auto;
105
+ min-width: 0;
106
+ `;
107
+ var HeaderIllustration = styled30__default.default.div`
108
+ flex-shrink: 0;
109
+ display: flex;
110
+ align-items: flex-end;
111
+ justify-content: center;
112
+ height: 80px;
113
+
114
+ & > img,
115
+ & > svg {
116
+ height: 100%;
117
+ width: auto;
118
+ object-fit: contain;
119
+ }
120
+ `;
121
+ var Eyebrow = styled30__default.default.p`
122
+ margin: 0;
123
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
124
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
125
+ line-height: 1.2;
126
+ letter-spacing: 0.1px;
127
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
128
+ `;
129
+ var Heading = styled30__default.default.p`
130
+ margin: 0;
131
+ font-size: 21px;
132
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
133
+ line-height: 1.28;
134
+ color: ${({ theme: theme2 }) => theme2.colors.text};
135
+ `;
136
+ var Body = styled30__default.default.div`
137
+ display: flex;
138
+ flex-direction: column;
139
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
140
+ padding: 32px;
141
+
142
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
143
+ padding: 24px;
144
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
145
+ }
146
+ `;
147
+ var Field = styled30__default.default.div`
148
+ position: relative;
149
+ width: 100%;
150
+ `;
151
+ var FieldShell = styled30__default.default.div`
152
+ position: relative;
153
+ display: flex;
154
+ align-items: center;
155
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
156
+ min-height: 56px;
157
+ padding: 14px 16px;
158
+ background: ${({ theme: theme2 }) => theme2.colors.background};
159
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
160
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
161
+ transition:
162
+ border-color 0.15s ease,
163
+ box-shadow 0.15s ease;
164
+
165
+ &:focus-within {
166
+ border-color: ${({ theme: theme2 }) => theme2.colors.primary};
167
+ }
168
+ `;
169
+ var FieldLabel = styled30__default.default.label`
170
+ position: absolute;
171
+ top: -8px;
172
+ left: 12px;
173
+ display: inline-flex;
174
+ align-items: center;
175
+ padding: 0 4px;
176
+ background: ${({ theme: theme2 }) => theme2.colors.background};
177
+ font-size: 12px;
178
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
179
+ line-height: 16px;
180
+ letter-spacing: 0.25px;
181
+ color: ${({ theme: theme2 }) => theme2.colors.text};
182
+ opacity: 0.8;
183
+
184
+ ${FieldShell}:focus-within & {
185
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
186
+ opacity: 1;
187
+ }
188
+ `;
189
+ var Required = styled30__default.default.span`
190
+ margin-left: 2px;
191
+ color: ${({ theme: theme2 }) => theme2.colors.danger};
192
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
193
+ `;
194
+ var IconSlot = styled30__default.default.span`
195
+ display: inline-flex;
196
+ align-items: center;
197
+ justify-content: center;
198
+ width: 24px;
199
+ height: 24px;
200
+ flex-shrink: 0;
201
+ color: ${({ theme: theme2 }) => theme2.colors.textMuted};
202
+ `;
203
+ var Input = styled30__default.default.input`
204
+ flex: 1;
205
+ min-width: 0;
206
+ padding: 0;
207
+ background: transparent;
208
+ border: none;
209
+ outline: none;
210
+ font-family: inherit;
211
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
212
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
213
+ line-height: 21px;
214
+ letter-spacing: 0.1px;
215
+ color: ${({ theme: theme2 }) => theme2.colors.text};
216
+
217
+ &::placeholder {
218
+ color: ${({ theme: theme2 }) => theme2.colors.textMuted};
219
+ opacity: 0.8;
220
+ }
221
+ `;
222
+ var Select = styled30__default.default.select`
223
+ flex: 1;
224
+ min-width: 0;
225
+ padding: 0 18px 0 0;
226
+ background-color: transparent;
227
+ border: none;
228
+ outline: none;
229
+ font-family: inherit;
230
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
231
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
232
+ line-height: 21px;
233
+ letter-spacing: 0.1px;
234
+ color: ${({ theme: theme2 }) => theme2.colors.text};
235
+ cursor: pointer;
236
+ appearance: none;
237
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16' fill='none'><path d='M4 6l4 4 4-4' stroke='%234A4A4A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
238
+ background-repeat: no-repeat;
239
+ background-position: right 0 center;
240
+
241
+ &:invalid {
242
+ color: ${({ theme: theme2 }) => theme2.colors.textMuted};
243
+ }
244
+ `;
245
+ var CountryCodeSelect = styled30__default.default.select`
246
+ flex: 0 0 auto;
247
+ padding: 0 14px 0 0;
248
+ margin-right: ${({ theme: theme2 }) => theme2.spacing.sm};
249
+ background-color: transparent;
250
+ border: none;
251
+ outline: none;
252
+ border-right: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
253
+ font-family: inherit;
254
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
255
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
256
+ line-height: 21px;
257
+ color: ${({ theme: theme2 }) => theme2.colors.text};
258
+ cursor: pointer;
259
+ appearance: none;
260
+ background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 16 16' fill='none'><path d='M4 6l4 4 4-4' stroke='%234A4A4A' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/></svg>");
261
+ background-repeat: no-repeat;
262
+ background-position: right 0 center;
263
+ `;
264
+ var SubmitButton = styled30__default.default.button`
265
+ display: inline-flex;
266
+ align-items: center;
267
+ justify-content: center;
268
+ height: 48px;
269
+ width: 100%;
270
+ padding: 10px 32px;
271
+ margin-top: ${({ theme: theme2 }) => theme2.spacing.xs};
272
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
273
+ border: none;
274
+ border-radius: 36px;
275
+ color: ${({ theme: theme2 }) => theme2.colors.text};
276
+ font-family: inherit;
277
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
278
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
279
+ line-height: 24px;
280
+ cursor: pointer;
281
+ transition: background 0.15s ease;
282
+
283
+ &:hover {
284
+ background: ${({ theme: theme2 }) => polished.darken(0.05, theme2.colors.accent)};
285
+ }
286
+
287
+ &:focus-visible {
288
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.primary};
289
+ outline-offset: 2px;
290
+ }
291
+ `;
292
+ var PersonSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
293
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "8", r: "4", stroke: "currentColor", strokeWidth: "1.6" }),
294
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4 20a8 8 0 0 1 16 0", stroke: "currentColor", strokeWidth: "1.6", strokeLinecap: "round" })
295
+ ] });
296
+ var MailSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
297
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2", stroke: "currentColor", strokeWidth: "1.6" }),
298
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m3 7 9 6 9-6", stroke: "currentColor", strokeWidth: "1.6", strokeLinejoin: "round" })
299
+ ] });
300
+ var DEFAULT_COUNTRY_CODES = [{ code: "+91" }];
301
+ var resolveMaxWidth = (input) => {
302
+ if (input == null) return "480px";
303
+ return typeof input === "number" ? `${input}px` : input;
304
+ };
305
+ var resolveHeaderVariant = (variant, hasIllustration) => {
306
+ if (variant) return variant;
307
+ return hasIllustration ? "illustration" : "tinted";
308
+ };
309
+ var ContactForm = react.forwardRef(
310
+ ({
311
+ variant = "card",
312
+ headerVariant,
313
+ eyebrow = "Wanderlust Calling?",
314
+ heading = "Allow Us to Call You Back!",
315
+ submitLabel = "Submit",
316
+ headerIllustration,
317
+ countryCodes,
318
+ destinations,
319
+ maxWidth,
320
+ onSubmit,
321
+ ...rest
322
+ }, ref) => {
323
+ const baseId = react.useId();
324
+ const codes = countryCodes && countryCodes.length > 0 ? countryCodes : DEFAULT_COUNTRY_CODES;
325
+ const firstCode = codes[0]?.code ?? "+91";
326
+ const showDestination = !!destinations && destinations.length > 0;
327
+ const resolvedHeader = resolveHeaderVariant(headerVariant, !!headerIllustration);
328
+ const [values, setValues] = react.useState({
329
+ name: "",
330
+ phone: "",
331
+ countryCode: firstCode,
332
+ email: "",
333
+ destination: ""
334
+ });
335
+ const update = (key, value) => {
336
+ setValues((prev) => ({ ...prev, [key]: value }));
337
+ };
338
+ const handleSubmit = (event) => {
339
+ event.preventDefault();
340
+ onSubmit?.(values);
341
+ };
342
+ return /* @__PURE__ */ jsxRuntime.jsxs(
343
+ Form,
344
+ {
345
+ ref,
346
+ onSubmit: handleSubmit,
347
+ noValidate: true,
348
+ $variant: variant,
349
+ $maxWidth: resolveMaxWidth(maxWidth),
350
+ ...rest,
351
+ children: [
352
+ resolvedHeader === "none" ? null : /* @__PURE__ */ jsxRuntime.jsxs(Header, { $variant: resolvedHeader, children: [
353
+ /* @__PURE__ */ jsxRuntime.jsxs(HeaderText, { children: [
354
+ /* @__PURE__ */ jsxRuntime.jsx(Eyebrow, { children: eyebrow }),
355
+ /* @__PURE__ */ jsxRuntime.jsx(Heading, { children: heading })
356
+ ] }),
357
+ resolvedHeader === "illustration" && headerIllustration ? /* @__PURE__ */ jsxRuntime.jsx(HeaderIllustration, { "aria-hidden": "true", children: headerIllustration }) : null
358
+ ] }),
359
+ /* @__PURE__ */ jsxRuntime.jsxs(Body, { children: [
360
+ /* @__PURE__ */ jsxRuntime.jsx(Field, { children: /* @__PURE__ */ jsxRuntime.jsxs(FieldShell, { children: [
361
+ /* @__PURE__ */ jsxRuntime.jsxs(FieldLabel, { htmlFor: `${baseId}-name`, children: [
362
+ "Name",
363
+ /* @__PURE__ */ jsxRuntime.jsx(Required, { children: "*" })
364
+ ] }),
365
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(PersonSvg, {}) }),
366
+ /* @__PURE__ */ jsxRuntime.jsx(
367
+ Input,
368
+ {
369
+ id: `${baseId}-name`,
370
+ name: "name",
371
+ type: "text",
372
+ required: true,
373
+ placeholder: "e.g. John Smith",
374
+ value: values.name,
375
+ onChange: (e) => update("name", e.target.value)
376
+ }
377
+ )
378
+ ] }) }),
379
+ /* @__PURE__ */ jsxRuntime.jsx(Field, { children: /* @__PURE__ */ jsxRuntime.jsxs(FieldShell, { children: [
380
+ /* @__PURE__ */ jsxRuntime.jsxs(FieldLabel, { htmlFor: `${baseId}-phone`, children: [
381
+ "Phone Number",
382
+ /* @__PURE__ */ jsxRuntime.jsx(Required, { children: "*" })
383
+ ] }),
384
+ /* @__PURE__ */ jsxRuntime.jsx(
385
+ CountryCodeSelect,
386
+ {
387
+ "aria-label": "Country code",
388
+ value: values.countryCode,
389
+ onChange: (e) => update("countryCode", e.target.value),
390
+ children: codes.map((c) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: c.code, children: c.label ?? c.code }, c.code))
391
+ }
392
+ ),
393
+ /* @__PURE__ */ jsxRuntime.jsx(
394
+ Input,
395
+ {
396
+ id: `${baseId}-phone`,
397
+ name: "phone",
398
+ type: "tel",
399
+ required: true,
400
+ placeholder: "Enter your 10 digit number",
401
+ value: values.phone,
402
+ onChange: (e) => update("phone", e.target.value)
403
+ }
404
+ )
405
+ ] }) }),
406
+ showDestination ? /* @__PURE__ */ jsxRuntime.jsx(Field, { children: /* @__PURE__ */ jsxRuntime.jsxs(FieldShell, { children: [
407
+ /* @__PURE__ */ jsxRuntime.jsx(FieldLabel, { htmlFor: `${baseId}-destination`, children: "Destination" }),
408
+ /* @__PURE__ */ jsxRuntime.jsxs(
409
+ Select,
410
+ {
411
+ id: `${baseId}-destination`,
412
+ name: "destination",
413
+ value: values.destination,
414
+ onChange: (e) => update("destination", e.target.value),
415
+ children: [
416
+ /* @__PURE__ */ jsxRuntime.jsx("option", { value: "", children: "-- Select destination --" }),
417
+ destinations?.map((d) => /* @__PURE__ */ jsxRuntime.jsx("option", { value: d.value, children: d.label }, d.value))
418
+ ]
419
+ }
420
+ )
421
+ ] }) }) : null,
422
+ /* @__PURE__ */ jsxRuntime.jsx(Field, { children: /* @__PURE__ */ jsxRuntime.jsxs(FieldShell, { children: [
423
+ /* @__PURE__ */ jsxRuntime.jsx(FieldLabel, { htmlFor: `${baseId}-email`, children: "Email Id" }),
424
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(MailSvg, {}) }),
425
+ /* @__PURE__ */ jsxRuntime.jsx(
426
+ Input,
427
+ {
428
+ id: `${baseId}-email`,
429
+ name: "email",
430
+ type: "email",
431
+ placeholder: "john@example.com",
432
+ value: values.email,
433
+ onChange: (e) => update("email", e.target.value)
434
+ }
435
+ )
436
+ ] }) }),
437
+ /* @__PURE__ */ jsxRuntime.jsx(SubmitButton, { type: "submit", children: submitLabel })
438
+ ] })
439
+ ]
440
+ }
441
+ );
442
+ }
443
+ );
444
+ ContactForm.displayName = "ContactForm";
445
+ var Card = styled30__default.default.a`
446
+ flex: 0 0 88px;
447
+ display: flex;
448
+ flex-direction: column;
449
+ align-items: center;
450
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
451
+ width: 88px;
452
+ text-decoration: none;
453
+ color: inherit;
454
+
455
+ &:focus-visible {
456
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
457
+ outline-offset: 2px;
458
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
459
+ }
460
+ `;
461
+ var Image = styled30__default.default.img`
462
+ width: 88px;
463
+ height: 88px;
464
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
465
+ object-fit: cover;
466
+ background: ${({ theme: theme2 }) => theme2.colors.border};
467
+ `;
468
+ var Label = styled30__default.default.span`
469
+ font-size: 14px;
470
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
471
+ line-height: 20px;
472
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
473
+ text-align: center;
474
+ white-space: nowrap;
475
+ `;
476
+ var DestinationCard = react.forwardRef(
477
+ ({ image, alt, label, href, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Card, { ref, href: href ?? void 0, as: href ? "a" : "div", ...rest, children: [
478
+ /* @__PURE__ */ jsxRuntime.jsx(Image, { src: image, alt }),
479
+ /* @__PURE__ */ jsxRuntime.jsx(Label, { children: label })
480
+ ] })
481
+ );
482
+ DestinationCard.displayName = "DestinationCard";
483
+ var Wrapper = styled30__default.default.div`
484
+ flex: 0 0 auto;
485
+ width: 100%;
486
+ scroll-snap-align: start;
487
+ `;
488
+ var Frame = styled30__default.default.a`
489
+ display: block;
490
+ width: 100%;
491
+ height: 300px;
492
+ overflow: hidden;
493
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
494
+ text-decoration: none;
495
+ color: inherit;
496
+
497
+ & > img {
498
+ display: block;
499
+ width: 100%;
500
+ height: 100%;
501
+ object-fit: cover;
502
+ }
503
+
504
+ &:focus-visible {
505
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
506
+ outline-offset: 2px;
507
+ }
508
+ `;
509
+ var EventBanner = react.forwardRef(
510
+ ({ image, alt, href, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsx(Wrapper, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(Frame, { href: href ?? void 0, as: href ? "a" : "div", children: /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt }) }) })
511
+ );
512
+ EventBanner.displayName = "EventBanner";
513
+ var Wrapper2 = styled30__default.default.section`
514
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
515
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
516
+ overflow: hidden;
517
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
518
+ `;
519
+ var Trigger = styled30__default.default.button`
520
+ display: flex;
521
+ align-items: center;
522
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
523
+ width: 100%;
524
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.md} ${theme2.spacing.lg}`};
525
+ background: ${({ $open, theme: theme2 }) => $open ? theme2.colors.primary : theme2.colors.surface};
526
+ color: ${({ $open, theme: theme2 }) => $open ? "#FFFFFF" : theme2.colors.text};
527
+ border: none;
528
+ cursor: pointer;
529
+ text-align: left;
530
+ transition: background 0.2s ease, color 0.2s ease;
531
+
532
+ &:focus-visible {
533
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
534
+ outline-offset: -2px;
535
+ }
536
+ `;
537
+ var SerialNumber = styled30__default.default.span`
538
+ flex-shrink: 0;
539
+ min-width: 36px;
540
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.lg};
541
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
542
+ color: ${({ $open, theme: theme2 }) => $open ? "#FFFFFF" : theme2.colors.textMuted};
543
+ `;
544
+ var Title = styled30__default.default.span`
545
+ flex: 1;
546
+ ${({ theme: theme2 }) => theme2.typography.cardTitle}
547
+ color: inherit;
548
+ `;
549
+ var Chevron = styled30__default.default.span`
550
+ display: inline-flex;
551
+ align-items: center;
552
+ justify-content: center;
553
+ width: 16px;
554
+ height: 16px;
555
+ flex-shrink: 0;
556
+ transition: transform 0.2s ease;
557
+ transform: rotate(${({ $open }) => $open ? "90deg" : "0deg"});
558
+
559
+ &::before {
560
+ content: '›';
561
+ font-size: 24px;
562
+ line-height: 1;
563
+ }
564
+ `;
565
+ var Panel = styled30__default.default.div`
566
+ display: ${({ $open }) => $open ? "block" : "none"};
567
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.md} ${theme2.spacing.lg}`};
568
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
569
+ `;
570
+ var BulletList = styled30__default.default.ul`
571
+ margin: 0;
572
+ padding-left: ${({ theme: theme2 }) => theme2.spacing.lg};
573
+ display: flex;
574
+ flex-direction: column;
575
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
576
+ `;
577
+ var Bullet = styled30__default.default.li`
578
+ ${({ theme: theme2 }) => theme2.typography.cardBody}
579
+ overflow-wrap: anywhere;
580
+ `;
581
+ var ExpandableValueCard = react.forwardRef(
582
+ ({ serialNumber, title, bullets, defaultOpen = false, expanded, onToggle, ...rest }, ref) => {
583
+ const [internalOpen, setInternalOpen] = react.useState(defaultOpen);
584
+ const isControlled = expanded !== void 0;
585
+ const open = isControlled ? expanded : internalOpen;
586
+ const panelId = react.useId();
587
+ const formattedSerial = String(serialNumber).padStart(2, "0");
588
+ const handleToggle = () => {
589
+ const next = !open;
590
+ if (!isControlled) {
591
+ setInternalOpen(next);
592
+ }
593
+ onToggle?.(next);
594
+ };
595
+ return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper2, { ref, ...rest, children: [
596
+ /* @__PURE__ */ jsxRuntime.jsxs(
597
+ Trigger,
598
+ {
599
+ type: "button",
600
+ $open: open,
601
+ "aria-expanded": open,
602
+ "aria-controls": panelId,
603
+ onClick: handleToggle,
604
+ children: [
605
+ /* @__PURE__ */ jsxRuntime.jsx(SerialNumber, { $open: open, "aria-hidden": "true", children: formattedSerial }),
606
+ /* @__PURE__ */ jsxRuntime.jsx(Title, { children: title }),
607
+ /* @__PURE__ */ jsxRuntime.jsx(Chevron, { $open: open, "aria-hidden": "true" })
608
+ ]
609
+ }
610
+ ),
611
+ /* @__PURE__ */ jsxRuntime.jsx(Panel, { id: panelId, $open: open, role: "region", "aria-label": title, children: /* @__PURE__ */ jsxRuntime.jsx(BulletList, { children: bullets.map((text) => /* @__PURE__ */ jsxRuntime.jsx(Bullet, { children: text }, text)) }) })
612
+ ] });
613
+ }
614
+ );
615
+ ExpandableValueCard.displayName = "ExpandableValueCard";
616
+ var Card2 = styled30__default.default.a`
617
+ flex: 0 0 132px;
618
+ display: flex;
619
+ flex-direction: column;
620
+ width: 132px;
621
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
622
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
623
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
624
+ overflow: hidden;
625
+ text-decoration: none;
626
+ color: inherit;
627
+ box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
628
+
629
+ &:focus-visible {
630
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
631
+ outline-offset: 2px;
632
+ }
633
+ `;
634
+ var Image2 = styled30__default.default.img`
635
+ width: 100%;
636
+ height: 102px;
637
+ object-fit: cover;
638
+ display: block;
639
+ `;
640
+ var Label2 = styled30__default.default.span`
641
+ display: flex;
642
+ align-items: center;
643
+ justify-content: center;
644
+ min-height: 56px;
645
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.sm} ${theme2.spacing.md}`};
646
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
647
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
648
+ line-height: 1.3;
649
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
650
+ text-align: center;
651
+ `;
652
+ var ExploreCard = react.forwardRef(
653
+ ({ image, alt, label, href, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Card2, { ref, href: href ?? void 0, as: href ? "a" : "div", ...rest, children: [
654
+ /* @__PURE__ */ jsxRuntime.jsx(Image2, { src: image, alt }),
655
+ /* @__PURE__ */ jsxRuntime.jsx(Label2, { children: label })
656
+ ] })
657
+ );
658
+ ExploreCard.displayName = "ExploreCard";
659
+ var Wrapper3 = styled30__default.default.section`
660
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
661
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
662
+ overflow: hidden;
663
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
664
+ `;
665
+ var Trigger2 = styled30__default.default.button`
666
+ display: flex;
667
+ align-items: center;
668
+ justify-content: space-between;
669
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
670
+ width: 100%;
671
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.md} ${theme2.spacing.lg}`};
672
+ background: ${({ $open, theme: theme2 }) => $open ? theme2.colors.primary : theme2.colors.surface};
673
+ color: ${({ $open, theme: theme2 }) => $open ? "#FFFFFF" : theme2.colors.text};
674
+ border: none;
675
+ cursor: pointer;
676
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
677
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
678
+ text-align: left;
679
+ transition: background 0.2s ease, color 0.2s ease;
680
+
681
+ &:focus-visible {
682
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
683
+ outline-offset: -2px;
684
+ }
685
+ `;
686
+ var Chevron2 = styled30__default.default.span`
687
+ display: inline-flex;
688
+ align-items: center;
689
+ justify-content: center;
690
+ width: 16px;
691
+ height: 16px;
692
+ transition: transform 0.2s ease;
693
+ transform: rotate(${({ $open }) => $open ? "90deg" : "0deg"});
694
+
695
+ &::before {
696
+ content: '›';
697
+ font-size: 24px;
698
+ line-height: 1;
699
+ }
700
+ `;
701
+ var Panel2 = styled30__default.default.div`
702
+ display: ${({ $open }) => $open ? "block" : "none"};
703
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.md} ${theme2.spacing.lg}`};
704
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
705
+ `;
706
+ var BulletList2 = styled30__default.default.ul`
707
+ margin: 0;
708
+ padding-left: ${({ theme: theme2 }) => theme2.spacing.lg};
709
+ display: flex;
710
+ flex-direction: column;
711
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
712
+ `;
713
+ var Bullet2 = styled30__default.default.li`
714
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
715
+ color: ${({ theme: theme2 }) => theme2.colors.text};
716
+ line-height: 1.5;
717
+ overflow-wrap: anywhere;
718
+ `;
719
+ var FaqExpandable = react.forwardRef(
720
+ ({ question, bullets, defaultOpen = false, expanded, onToggle, ...rest }, ref) => {
721
+ const [internalOpen, setInternalOpen] = react.useState(defaultOpen);
722
+ const isControlled = expanded !== void 0;
723
+ const open = isControlled ? expanded : internalOpen;
724
+ const panelId = react.useId();
725
+ const handleToggle = () => {
726
+ const next = !open;
727
+ if (!isControlled) {
728
+ setInternalOpen(next);
729
+ }
730
+ onToggle?.(next);
731
+ };
732
+ return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper3, { ref, ...rest, children: [
733
+ /* @__PURE__ */ jsxRuntime.jsxs(
734
+ Trigger2,
735
+ {
736
+ type: "button",
737
+ $open: open,
738
+ "aria-expanded": open,
739
+ "aria-controls": panelId,
740
+ onClick: handleToggle,
741
+ children: [
742
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: question }),
743
+ /* @__PURE__ */ jsxRuntime.jsx(Chevron2, { $open: open, "aria-hidden": "true" })
744
+ ]
745
+ }
746
+ ),
747
+ /* @__PURE__ */ jsxRuntime.jsx(Panel2, { id: panelId, $open: open, role: "region", "aria-label": question, children: /* @__PURE__ */ jsxRuntime.jsx(BulletList2, { children: bullets.map((text) => /* @__PURE__ */ jsxRuntime.jsx(Bullet2, { children: text }, text)) }) })
748
+ ] });
749
+ }
750
+ );
751
+ FaqExpandable.displayName = "FaqExpandable";
752
+ var Card3 = styled30__default.default.article`
753
+ position: relative;
754
+ flex: 0 0 268px;
755
+ width: 268px;
756
+ height: 355px;
757
+ padding: 26px 18px;
758
+ background: ${({ theme: theme2 }) => theme2.colors.border};
759
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.primary};
760
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
761
+ box-shadow: 0 2px 12px 2px rgba(0, 0, 0, 0.14);
762
+ overflow: hidden;
763
+ scroll-snap-align: center;
764
+ `;
765
+ var Title2 = styled30__default.default.h3`
766
+ margin: 0 0 ${({ theme: theme2 }) => theme2.spacing.lg};
767
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
768
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
769
+ line-height: 32px;
770
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
771
+ `;
772
+ var Description = styled30__default.default.p`
773
+ margin: 0;
774
+ max-width: 220px;
775
+ font-size: 12px;
776
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
777
+ line-height: 16px;
778
+ color: ${({ theme: theme2 }) => theme2.colors.text};
779
+ `;
780
+ var Illustration = styled30__default.default.img`
781
+ position: absolute;
782
+ bottom: 0;
783
+ left: 0;
784
+ width: 206px;
785
+ height: 137px;
786
+ object-fit: contain;
787
+ pointer-events: none;
788
+ `;
789
+ var FeatureCard = react.forwardRef(
790
+ ({ title, description, illustration, illustrationAlt = "", ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Card3, { ref, ...rest, children: [
791
+ /* @__PURE__ */ jsxRuntime.jsx(Title2, { children: title }),
792
+ /* @__PURE__ */ jsxRuntime.jsx(Description, { children: description }),
793
+ /* @__PURE__ */ jsxRuntime.jsx(Illustration, { src: illustration, alt: illustrationAlt, "aria-hidden": !illustrationAlt })
794
+ ] })
795
+ );
796
+ FeatureCard.displayName = "FeatureCard";
797
+ var Wrapper4 = styled30__default.default.div`
798
+ position: relative;
799
+ flex: 0 0 270px;
800
+ width: 270px;
801
+ height: 400px;
802
+ overflow: hidden;
803
+ scroll-snap-align: start;
804
+ background: ${({ theme: theme2 }) => theme2.colors.border};
805
+
806
+ & > img {
807
+ display: block;
808
+ width: 100%;
809
+ height: 100%;
810
+ object-fit: cover;
811
+ }
812
+
813
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
814
+ flex: 0 0 320px;
815
+ width: 320px;
816
+ height: 460px;
817
+ }
818
+ `;
819
+ var Tag = styled30__default.default.div`
820
+ position: absolute;
821
+ bottom: ${({ theme: theme2 }) => theme2.spacing.md};
822
+ left: ${({ theme: theme2 }) => theme2.spacing.sm};
823
+ display: inline-flex;
824
+ align-items: center;
825
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
826
+ padding: 2px 6px;
827
+ background: rgba(0, 0, 0, 0.4);
828
+ border: 0.5px solid ${({ theme: theme2 }) => theme2.colors.secondary};
829
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
830
+ color: #fbfbfb;
831
+ font-size: 12px;
832
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
833
+ line-height: 16px;
834
+ `;
835
+ var PinIcon = styled30__default.default.span`
836
+ display: inline-flex;
837
+ align-items: center;
838
+ justify-content: center;
839
+ width: 16px;
840
+ height: 16px;
841
+ color: #fbfbfb;
842
+ `;
843
+ var PinSvg = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "12", height: "12", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
844
+ "path",
845
+ {
846
+ d: "M8 1.33a4.67 4.67 0 0 0-4.67 4.67c0 3.5 4.67 8.67 4.67 8.67s4.67-5.17 4.67-8.67A4.67 4.67 0 0 0 8 1.33Zm0 6.34a1.67 1.67 0 1 1 0-3.34 1.67 1.67 0 0 1 0 3.34Z",
847
+ stroke: "currentColor",
848
+ strokeWidth: "1.4",
849
+ strokeLinejoin: "round",
850
+ fill: "none"
851
+ }
852
+ ) });
853
+ var GalleryPhoto = react.forwardRef(
854
+ ({ image, alt, destination, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Wrapper4, { ref, ...rest, children: [
855
+ /* @__PURE__ */ jsxRuntime.jsx("img", { src: image, alt }),
856
+ /* @__PURE__ */ jsxRuntime.jsxs(Tag, { children: [
857
+ /* @__PURE__ */ jsxRuntime.jsx(PinIcon, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(PinSvg, {}) }),
858
+ destination
859
+ ] })
860
+ ] })
861
+ );
862
+ GalleryPhoto.displayName = "GalleryPhoto";
863
+ var Article = styled30__default.default.article`
864
+ display: flex;
865
+ flex-direction: column;
866
+ align-items: flex-start;
867
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
868
+ padding: ${({ theme: theme2 }) => theme2.layout.cardPadding};
869
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
870
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
871
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
872
+ `;
873
+ var LogoWrapper = styled30__default.default.div`
874
+ display: flex;
875
+ align-items: center;
876
+ height: 50px;
877
+
878
+ & > img,
879
+ & > svg {
880
+ height: 100%;
881
+ width: auto;
882
+ max-width: 100%;
883
+ object-fit: contain;
884
+ }
885
+ `;
886
+ var Location = styled30__default.default.h3`
887
+ margin: 0;
888
+ ${({ theme: theme2 }) => theme2.typography.cardTitle}
889
+ `;
890
+ var AccentLine = styled30__default.default.span`
891
+ display: block;
892
+ width: 56px;
893
+ height: 2px;
894
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
895
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
896
+ `;
897
+ var Address = styled30__default.default.p`
898
+ margin: 0;
899
+ white-space: pre-line;
900
+ ${({ theme: theme2 }) => theme2.typography.cardBody}
901
+ `;
902
+ var LocationCard = react.forwardRef(
903
+ ({ location, address, logo, ...rest }, ref) => {
904
+ return /* @__PURE__ */ jsxRuntime.jsxs(Article, { ref, ...rest, children: [
905
+ logo !== void 0 ? /* @__PURE__ */ jsxRuntime.jsx(LogoWrapper, { "aria-hidden": "true", children: typeof logo === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: "" }) : logo }) : null,
906
+ /* @__PURE__ */ jsxRuntime.jsx(Location, { children: location }),
907
+ /* @__PURE__ */ jsxRuntime.jsx(AccentLine, { "aria-hidden": "true" }),
908
+ /* @__PURE__ */ jsxRuntime.jsx(Address, { children: address })
909
+ ] });
910
+ }
911
+ );
912
+ LocationCard.displayName = "LocationCard";
913
+ var Wrapper5 = styled30__default.default.div`
914
+ display: flex;
915
+ flex-direction: column;
916
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
917
+ width: 100%;
918
+ `;
919
+ var TabRow = styled30__default.default.div`
920
+ display: flex;
921
+ align-items: center;
922
+ gap: 12px;
923
+ overflow-x: auto;
924
+ scrollbar-width: none;
925
+
926
+ &::-webkit-scrollbar {
927
+ display: none;
928
+ }
929
+ `;
930
+ var Tab = styled30__default.default.button`
931
+ flex: 0 0 auto;
932
+ display: inline-flex;
933
+ align-items: center;
934
+ height: 34px;
935
+ padding: 5px 17px;
936
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
937
+ font-family: inherit;
938
+ font-size: 12px;
939
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
940
+ line-height: 16px;
941
+ white-space: nowrap;
942
+ cursor: pointer;
943
+ transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
944
+
945
+ ${({ $active }) => $active ? `
946
+ background: #cceef7;
947
+ border: 1px solid #0b3741;
948
+ color: #0b3741;
949
+ ` : `
950
+ background: transparent;
951
+ border: 1px solid #898989;
952
+ color: #707070;
953
+ `}
954
+
955
+ &:focus-visible {
956
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
957
+ outline-offset: 2px;
958
+ }
959
+ `;
960
+ var Divider = styled30__default.default.span`
961
+ display: block;
962
+ width: 100%;
963
+ height: 1px;
964
+ background: #bcbcbc;
965
+ `;
966
+ var MonthTabs = react.forwardRef(
967
+ ({ months, activeMonthId, onMonthChange, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Wrapper5, { ref, ...rest, children: [
968
+ /* @__PURE__ */ jsxRuntime.jsx(TabRow, { role: "tablist", children: months.map((month) => {
969
+ const isActive = month.id === activeMonthId;
970
+ return /* @__PURE__ */ jsxRuntime.jsx(
971
+ Tab,
972
+ {
973
+ type: "button",
974
+ role: "tab",
975
+ "aria-selected": isActive,
976
+ $active: isActive,
977
+ onClick: () => onMonthChange(month.id),
978
+ children: month.label
979
+ },
980
+ month.id
981
+ );
982
+ }) }),
983
+ /* @__PURE__ */ jsxRuntime.jsx(Divider, { "aria-hidden": "true" })
984
+ ] })
985
+ );
986
+ MonthTabs.displayName = "MonthTabs";
987
+ var Card4 = styled30__default.default.a`
988
+ position: relative;
989
+ display: flex;
990
+ flex-direction: column;
991
+ justify-content: space-between;
992
+ flex: 0 0 264px;
993
+ width: 264px;
994
+ height: 392px;
995
+ padding: 12px 16px;
996
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
997
+ overflow: hidden;
998
+ text-decoration: none;
999
+ color: inherit;
1000
+ scroll-snap-align: start;
1001
+
1002
+ &:focus-visible {
1003
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1004
+ outline-offset: 2px;
1005
+ }
1006
+
1007
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1008
+ flex: 0 0 320px;
1009
+ width: 320px;
1010
+ }
1011
+ `;
1012
+ var Background = styled30__default.default.span`
1013
+ position: absolute;
1014
+ inset: 0;
1015
+ background-image: url(${({ $image }) => $image});
1016
+ background-size: cover;
1017
+ background-position: center;
1018
+ pointer-events: none;
1019
+ `;
1020
+ var Overlay = styled30__default.default.span`
1021
+ position: absolute;
1022
+ inset: 0;
1023
+ background: linear-gradient(180deg, rgba(0, 0, 0, 0) 21.67%, rgba(0, 0, 0, 1) 86.21%);
1024
+ pointer-events: none;
1025
+ `;
1026
+ var PriceTag = styled30__default.default.div`
1027
+ position: relative;
1028
+ display: inline-flex;
1029
+ align-items: center;
1030
+ align-self: flex-start;
1031
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1032
+ padding: 4px 16px;
1033
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
1034
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.surface};
1035
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
1036
+ `;
1037
+ var OriginalPrice = styled30__default.default.span`
1038
+ position: relative;
1039
+ font-size: 9px;
1040
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1041
+ line-height: 18px;
1042
+ color: #424242;
1043
+
1044
+ &::after {
1045
+ content: '';
1046
+ position: absolute;
1047
+ left: -2px;
1048
+ right: -2px;
1049
+ top: 50%;
1050
+ height: 1px;
1051
+ background: #424242;
1052
+ transform: rotate(-8deg);
1053
+ }
1054
+ `;
1055
+ var CurrentPrice = styled30__default.default.span`
1056
+ font-size: 12px;
1057
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
1058
+ line-height: 16px;
1059
+ color: #2d2d2d;
1060
+ `;
1061
+ var PriceSuffix = styled30__default.default.span`
1062
+ font-size: 12px;
1063
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1064
+ line-height: 16px;
1065
+ color: #2d2d2d;
1066
+ `;
1067
+ var Footer = styled30__default.default.div`
1068
+ position: relative;
1069
+ display: flex;
1070
+ flex-direction: column;
1071
+ gap: 16px;
1072
+ color: #f2f2f2;
1073
+ `;
1074
+ var Title3 = styled30__default.default.p`
1075
+ margin: 0;
1076
+ font-size: 12px;
1077
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
1078
+ line-height: 20px;
1079
+ `;
1080
+ var InfoStack = styled30__default.default.div`
1081
+ display: flex;
1082
+ flex-direction: column;
1083
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1084
+ `;
1085
+ var InfoRow = styled30__default.default.div`
1086
+ display: flex;
1087
+ align-items: center;
1088
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
1089
+ `;
1090
+ var InfoItem = styled30__default.default.span`
1091
+ display: inline-flex;
1092
+ align-items: center;
1093
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1094
+ font-size: 12px;
1095
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
1096
+ line-height: 20px;
1097
+ color: #eef5f7;
1098
+ `;
1099
+ var IconSlot2 = styled30__default.default.span`
1100
+ display: inline-flex;
1101
+ align-items: center;
1102
+ justify-content: center;
1103
+ width: 18px;
1104
+ height: 18px;
1105
+ `;
1106
+ var ClockSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
1107
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "9", cy: "9", r: "6.5", stroke: "currentColor", strokeWidth: "1.4" }),
1108
+ /* @__PURE__ */ jsxRuntime.jsx(
1109
+ "path",
1110
+ {
1111
+ d: "M9 5.5V9l2.5 1.5",
1112
+ stroke: "currentColor",
1113
+ strokeWidth: "1.4",
1114
+ strokeLinecap: "round",
1115
+ strokeLinejoin: "round"
1116
+ }
1117
+ )
1118
+ ] });
1119
+ var LocationSvg = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
1120
+ "path",
1121
+ {
1122
+ d: "M9 1.5a5 5 0 0 0-5 5c0 3.75 5 9.5 5 9.5s5-5.75 5-9.5a5 5 0 0 0-5-5Zm0 6.83a1.83 1.83 0 1 1 0-3.66 1.83 1.83 0 0 1 0 3.66Z",
1123
+ stroke: "currentColor",
1124
+ strokeWidth: "1.4",
1125
+ strokeLinejoin: "round",
1126
+ fill: "none"
1127
+ }
1128
+ ) });
1129
+ var CalendarSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "16", height: "16", viewBox: "0 0 18 18", fill: "none", "aria-hidden": "true", children: [
1130
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "2.5", y: "3.5", width: "13", height: "12", rx: "1.5", stroke: "currentColor", strokeWidth: "1.4" }),
1131
+ /* @__PURE__ */ jsxRuntime.jsx(
1132
+ "path",
1133
+ {
1134
+ d: "M2.5 7h13M6 1.5v3M12 1.5v3",
1135
+ stroke: "currentColor",
1136
+ strokeWidth: "1.4",
1137
+ strokeLinecap: "round"
1138
+ }
1139
+ )
1140
+ ] });
1141
+ var PackageCard = react.forwardRef(
1142
+ ({
1143
+ image,
1144
+ alt,
1145
+ title,
1146
+ currentPrice,
1147
+ originalPrice,
1148
+ priceSuffix = "Onwards",
1149
+ duration,
1150
+ location,
1151
+ date,
1152
+ href,
1153
+ ...rest
1154
+ }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Card4, { ref, href: href ?? void 0, as: href ? "a" : "div", ...rest, children: [
1155
+ /* @__PURE__ */ jsxRuntime.jsx(Background, { $image: image, role: "img", "aria-label": alt }),
1156
+ /* @__PURE__ */ jsxRuntime.jsx(Overlay, { "aria-hidden": "true" }),
1157
+ /* @__PURE__ */ jsxRuntime.jsxs(PriceTag, { children: [
1158
+ originalPrice ? /* @__PURE__ */ jsxRuntime.jsx(OriginalPrice, { children: originalPrice }) : null,
1159
+ /* @__PURE__ */ jsxRuntime.jsx(CurrentPrice, { children: currentPrice }),
1160
+ /* @__PURE__ */ jsxRuntime.jsx(PriceSuffix, { children: priceSuffix })
1161
+ ] }),
1162
+ /* @__PURE__ */ jsxRuntime.jsxs(Footer, { children: [
1163
+ /* @__PURE__ */ jsxRuntime.jsx(Title3, { children: title }),
1164
+ /* @__PURE__ */ jsxRuntime.jsxs(InfoStack, { children: [
1165
+ /* @__PURE__ */ jsxRuntime.jsxs(InfoRow, { children: [
1166
+ /* @__PURE__ */ jsxRuntime.jsxs(InfoItem, { children: [
1167
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot2, { children: /* @__PURE__ */ jsxRuntime.jsx(ClockSvg, {}) }),
1168
+ duration
1169
+ ] }),
1170
+ /* @__PURE__ */ jsxRuntime.jsxs(InfoItem, { children: [
1171
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot2, { children: /* @__PURE__ */ jsxRuntime.jsx(LocationSvg, {}) }),
1172
+ location
1173
+ ] })
1174
+ ] }),
1175
+ /* @__PURE__ */ jsxRuntime.jsxs(InfoItem, { children: [
1176
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot2, { children: /* @__PURE__ */ jsxRuntime.jsx(CalendarSvg, {}) }),
1177
+ date
1178
+ ] })
1179
+ ] })
1180
+ ] })
1181
+ ] })
1182
+ );
1183
+ PackageCard.displayName = "PackageCard";
1184
+ var Header2 = styled30__default.default.header`
1185
+ display: flex;
1186
+ flex-direction: column;
1187
+ align-items: ${({ $align }) => $align === "center" ? "center" : "flex-start"};
1188
+ text-align: ${({ $align }) => $align};
1189
+ margin-bottom: ${({ theme: theme2 }) => theme2.spacing.xl};
1190
+ `;
1191
+ var Heading2 = styled30__default.default.h2`
1192
+ margin: 0;
1193
+ ${({ theme: theme2 }) => theme2.typography.sectionHeading}
1194
+ `;
1195
+ var Underline = styled30__default.default.span`
1196
+ display: block;
1197
+ width: 96px;
1198
+ height: 4px;
1199
+ margin: ${({ theme: theme2 }) => `${theme2.spacing.sm} 0 ${theme2.spacing.md}`};
1200
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
1201
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1202
+ `;
1203
+ var Subheading = styled30__default.default.p`
1204
+ margin: 0;
1205
+ max-width: 720px;
1206
+ ${({ theme: theme2 }) => theme2.typography.sectionSubheading}
1207
+ `;
1208
+ var SectionHeader = react.forwardRef(
1209
+ ({ heading, subheading, align = "center", ...rest }, ref) => {
1210
+ return /* @__PURE__ */ jsxRuntime.jsxs(Header2, { ref, $align: align, ...rest, children: [
1211
+ /* @__PURE__ */ jsxRuntime.jsx(Heading2, { children: heading }),
1212
+ /* @__PURE__ */ jsxRuntime.jsx(Underline, { "aria-hidden": "true" }),
1213
+ subheading ? /* @__PURE__ */ jsxRuntime.jsx(Subheading, { children: subheading }) : null
1214
+ ] });
1215
+ }
1216
+ );
1217
+ SectionHeader.displayName = "SectionHeader";
1218
+ var Article2 = styled30__default.default.article`
1219
+ display: flex;
1220
+ flex-direction: column;
1221
+ align-items: center;
1222
+ text-align: center;
1223
+ padding: ${({ theme: theme2 }) => theme2.layout.cardPadding};
1224
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
1225
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
1226
+
1227
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1228
+ flex: 0 0 260px;
1229
+ width: 260px;
1230
+ scroll-snap-align: start;
1231
+ }
1232
+ `;
1233
+ var Photo = styled30__default.default.img`
1234
+ width: 140px;
1235
+ height: 140px;
1236
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
1237
+ object-fit: cover;
1238
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.cardLg};
1239
+ `;
1240
+ var Name2 = styled30__default.default.h3`
1241
+ margin: ${({ theme: theme2 }) => theme2.spacing.md} 0 ${({ theme: theme2 }) => theme2.spacing.xs};
1242
+ ${({ theme: theme2 }) => theme2.typography.cardTitle}
1243
+ `;
1244
+ var Designation = styled30__default.default.p`
1245
+ margin: 0;
1246
+ ${({ theme: theme2 }) => theme2.typography.cardLabel}
1247
+ `;
1248
+ var Bio = styled30__default.default.p`
1249
+ margin: ${({ theme: theme2 }) => theme2.spacing.md} 0 0;
1250
+ ${({ theme: theme2 }) => theme2.typography.cardBody}
1251
+ `;
1252
+ var Divider2 = styled30__default.default.span`
1253
+ display: block;
1254
+ width: 64px;
1255
+ height: 2px;
1256
+ margin: ${({ theme: theme2 }) => theme2.spacing.md} 0;
1257
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
1258
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1259
+ `;
1260
+ var SocialList = styled30__default.default.ul`
1261
+ display: flex;
1262
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
1263
+ margin: 0;
1264
+ padding: 0;
1265
+ list-style: none;
1266
+ `;
1267
+ var SocialLink = styled30__default.default.a`
1268
+ display: inline-flex;
1269
+ align-items: center;
1270
+ justify-content: center;
1271
+ width: 32px;
1272
+ height: 32px;
1273
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
1274
+ text-decoration: none;
1275
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
1276
+ transition: opacity 0.15s ease;
1277
+
1278
+ & > img,
1279
+ & > svg {
1280
+ width: 100%;
1281
+ height: 100%;
1282
+ object-fit: contain;
1283
+ }
1284
+
1285
+ &:hover {
1286
+ opacity: 0.7;
1287
+ }
1288
+
1289
+ &:focus-visible {
1290
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.primary};
1291
+ outline-offset: 2px;
1292
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1293
+ }
1294
+ `;
1295
+ var TeamInfoCard = react.forwardRef(
1296
+ ({ image, name, designation, bio, socialLinks, ...rest }, ref) => {
1297
+ const hasSocials = socialLinks !== void 0 && socialLinks.length > 0;
1298
+ return /* @__PURE__ */ jsxRuntime.jsxs(Article2, { ref, ...rest, children: [
1299
+ /* @__PURE__ */ jsxRuntime.jsx(Photo, { src: image, alt: name }),
1300
+ /* @__PURE__ */ jsxRuntime.jsx(Name2, { children: name }),
1301
+ /* @__PURE__ */ jsxRuntime.jsx(Designation, { children: designation }),
1302
+ bio ? /* @__PURE__ */ jsxRuntime.jsx(Bio, { children: bio }) : null,
1303
+ hasSocials ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1304
+ /* @__PURE__ */ jsxRuntime.jsx(Divider2, { "aria-hidden": "true" }),
1305
+ /* @__PURE__ */ jsxRuntime.jsx(SocialList, { children: socialLinks.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(
1306
+ SocialLink,
1307
+ {
1308
+ href: link.href,
1309
+ "aria-label": link.label,
1310
+ target: "_blank",
1311
+ rel: "noopener noreferrer",
1312
+ children: typeof link.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: link.icon, alt: "" }) : link.icon ?? link.label
1313
+ }
1314
+ ) }, link.href)) })
1315
+ ] }) : null
1316
+ ] });
1317
+ }
1318
+ );
1319
+ TeamInfoCard.displayName = "TeamInfoCard";
1320
+ var Card5 = styled30__default.default.div`
1321
+ display: flex;
1322
+ flex-direction: column;
1323
+ align-items: center;
1324
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1325
+ width: 868px;
1326
+ max-width: 100%;
1327
+ padding: 16px 16px 0;
1328
+ background: ${({ theme: theme2 }) => theme2.colors.border};
1329
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.primary};
1330
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
1331
+ box-shadow: 0 6px 20px 4px rgba(0, 0, 0, 0.16);
1332
+ overflow: hidden;
1333
+ `;
1334
+ var Thumbnail = styled30__default.default.button`
1335
+ position: relative;
1336
+ display: block;
1337
+ width: 100%;
1338
+ aspect-ratio: 836 / 470;
1339
+ padding: 0;
1340
+ background: transparent;
1341
+ border: none;
1342
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1343
+ cursor: pointer;
1344
+ overflow: hidden;
1345
+ font-family: inherit;
1346
+
1347
+ & > img {
1348
+ width: 100%;
1349
+ height: 100%;
1350
+ object-fit: cover;
1351
+ display: block;
1352
+ }
1353
+
1354
+ &::after {
1355
+ content: '';
1356
+ position: absolute;
1357
+ inset: 0;
1358
+ background: rgba(0, 0, 0, 0.4);
1359
+ pointer-events: none;
1360
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1361
+ }
1362
+
1363
+ &:focus-visible {
1364
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1365
+ outline-offset: 2px;
1366
+ }
1367
+ `;
1368
+ var ThumbnailLink = styled30__default.default.a`
1369
+ position: relative;
1370
+ display: block;
1371
+ width: 100%;
1372
+ aspect-ratio: 836 / 470;
1373
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1374
+ overflow: hidden;
1375
+ text-decoration: none;
1376
+ color: inherit;
1377
+
1378
+ & > img {
1379
+ width: 100%;
1380
+ height: 100%;
1381
+ object-fit: cover;
1382
+ display: block;
1383
+ }
1384
+
1385
+ &::after {
1386
+ content: '';
1387
+ position: absolute;
1388
+ inset: 0;
1389
+ background: rgba(0, 0, 0, 0.4);
1390
+ pointer-events: none;
1391
+ }
1392
+
1393
+ &:focus-visible {
1394
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1395
+ outline-offset: 2px;
1396
+ }
1397
+ `;
1398
+ var PlayIcon = styled30__default.default.span`
1399
+ position: absolute;
1400
+ top: 50%;
1401
+ left: 50%;
1402
+ transform: translate(-50%, -50%);
1403
+ display: inline-flex;
1404
+ align-items: center;
1405
+ justify-content: center;
1406
+ width: 56px;
1407
+ height: 56px;
1408
+ pointer-events: none;
1409
+ z-index: 1;
1410
+ color: #ffffff;
1411
+ `;
1412
+ var Caption = styled30__default.default.div`
1413
+ display: flex;
1414
+ align-items: center;
1415
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
1416
+ width: 100%;
1417
+ padding: ${({ theme: theme2 }) => theme2.spacing.md} 0;
1418
+ `;
1419
+ var Logo2 = styled30__default.default.img`
1420
+ width: 60px;
1421
+ height: 60px;
1422
+ object-fit: contain;
1423
+ flex-shrink: 0;
1424
+ `;
1425
+ var CaptionText = styled30__default.default.p`
1426
+ margin: 0;
1427
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1428
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
1429
+ line-height: 32px;
1430
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
1431
+ `;
1432
+ var PlaySvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "56", height: "56", viewBox: "0 0 56 56", fill: "none", "aria-hidden": "true", children: [
1433
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "28", cy: "28", r: "26", fill: "#FF0000" }),
1434
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M22 18l16 10-16 10V18Z", fill: "#ffffff" })
1435
+ ] });
1436
+ var TestimonialCard = react.forwardRef(
1437
+ ({ thumbnail, thumbnailAlt, logo, logoAlt, caption, videoHref, onPlayClick, ...rest }, ref) => {
1438
+ const playLabel = `Play testimonial: ${caption}`;
1439
+ const inner = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
1440
+ /* @__PURE__ */ jsxRuntime.jsx("img", { src: thumbnail, alt: thumbnailAlt }),
1441
+ /* @__PURE__ */ jsxRuntime.jsx(PlayIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(PlaySvg, {}) })
1442
+ ] });
1443
+ return /* @__PURE__ */ jsxRuntime.jsxs(Card5, { ref, ...rest, children: [
1444
+ videoHref ? /* @__PURE__ */ jsxRuntime.jsx(ThumbnailLink, { href: videoHref, "aria-label": playLabel, children: inner }) : /* @__PURE__ */ jsxRuntime.jsx(Thumbnail, { type: "button", "aria-label": playLabel, onClick: onPlayClick, children: inner }),
1445
+ /* @__PURE__ */ jsxRuntime.jsxs(Caption, { children: [
1446
+ /* @__PURE__ */ jsxRuntime.jsx(Logo2, { src: logo, alt: logoAlt }),
1447
+ /* @__PURE__ */ jsxRuntime.jsx(CaptionText, { children: caption })
1448
+ ] })
1449
+ ] });
1450
+ }
1451
+ );
1452
+ TestimonialCard.displayName = "TestimonialCard";
1453
+ var Card6 = styled30__default.default.a`
1454
+ position: relative;
1455
+ display: flex;
1456
+ flex-direction: column;
1457
+ justify-content: flex-end;
1458
+ flex: 0 0 200px;
1459
+ width: 200px;
1460
+ height: 316px;
1461
+ padding: 20px;
1462
+ border: 2px solid ${({ theme: theme2 }) => theme2.colors.surface};
1463
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
1464
+ overflow: hidden;
1465
+ text-decoration: none;
1466
+ color: inherit;
1467
+ scroll-snap-align: start;
1468
+
1469
+ &:focus-visible {
1470
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1471
+ outline-offset: 2px;
1472
+ }
1473
+ `;
1474
+ var Background2 = styled30__default.default.span`
1475
+ position: absolute;
1476
+ inset: 0;
1477
+ background-image: url(${({ $image }) => $image});
1478
+ background-size: cover;
1479
+ background-position: center;
1480
+ pointer-events: none;
1481
+ `;
1482
+ var Overlay2 = styled30__default.default.span`
1483
+ position: absolute;
1484
+ inset: 0;
1485
+ background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0.8) 100%);
1486
+ pointer-events: none;
1487
+ `;
1488
+ var Content = styled30__default.default.div`
1489
+ position: relative;
1490
+ display: flex;
1491
+ flex-direction: column;
1492
+ align-items: center;
1493
+ text-align: center;
1494
+ color: #f2f2f2;
1495
+ text-shadow: 1px 1px 25px rgba(0, 0, 0, 0.5);
1496
+ `;
1497
+ var Destination = styled30__default.default.span`
1498
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1499
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
1500
+ line-height: 28px;
1501
+ `;
1502
+ var Price = styled30__default.default.span`
1503
+ font-size: 12px;
1504
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
1505
+ line-height: 16px;
1506
+ `;
1507
+ var TripCategoryCard = react.forwardRef(
1508
+ ({ image, alt, destination, startingPrice, href, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Card6, { ref, href: href ?? void 0, as: href ? "a" : "div", ...rest, children: [
1509
+ /* @__PURE__ */ jsxRuntime.jsx(Background2, { $image: image, role: "img", "aria-label": alt }),
1510
+ /* @__PURE__ */ jsxRuntime.jsx(Overlay2, { "aria-hidden": "true" }),
1511
+ /* @__PURE__ */ jsxRuntime.jsxs(Content, { children: [
1512
+ /* @__PURE__ */ jsxRuntime.jsx(Destination, { children: destination }),
1513
+ /* @__PURE__ */ jsxRuntime.jsx(Price, { children: startingPrice })
1514
+ ] })
1515
+ ] })
1516
+ );
1517
+ TripCategoryCard.displayName = "TripCategoryCard";
1518
+ var Article3 = styled30__default.default.article`
1519
+ display: flex;
1520
+ flex-direction: column;
1521
+ align-items: center;
1522
+ text-align: center;
1523
+ padding: ${({ theme: theme2 }) => theme2.layout.cardPadding};
1524
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
1525
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
1526
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
1527
+ `;
1528
+ var IconWrapper = styled30__default.default.div`
1529
+ display: flex;
1530
+ align-items: center;
1531
+ justify-content: center;
1532
+ width: 64px;
1533
+ height: 64px;
1534
+ margin-bottom: ${({ theme: theme2 }) => theme2.spacing.md};
1535
+
1536
+ & > img,
1537
+ & > svg {
1538
+ width: 100%;
1539
+ height: 100%;
1540
+ object-fit: contain;
1541
+ }
1542
+ `;
1543
+ var Name3 = styled30__default.default.h3`
1544
+ margin: 0;
1545
+ ${({ theme: theme2 }) => theme2.typography.cardTitle}
1546
+ `;
1547
+ var AccentLine2 = styled30__default.default.span`
1548
+ display: block;
1549
+ width: 56px;
1550
+ height: 2px;
1551
+ margin: ${({ theme: theme2 }) => theme2.spacing.sm} 0 ${({ theme: theme2 }) => theme2.spacing.md};
1552
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
1553
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1554
+ `;
1555
+ var Description2 = styled30__default.default.p`
1556
+ margin: 0;
1557
+ ${({ theme: theme2 }) => theme2.typography.cardBody}
1558
+ `;
1559
+ var WarriorCard = react.forwardRef(
1560
+ ({ icon, name, description, ...rest }, ref) => {
1561
+ return /* @__PURE__ */ jsxRuntime.jsxs(Article3, { ref, ...rest, children: [
1562
+ /* @__PURE__ */ jsxRuntime.jsx(IconWrapper, { "aria-hidden": "true", children: typeof icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: icon, alt: "" }) : icon }),
1563
+ /* @__PURE__ */ jsxRuntime.jsx(Name3, { children: name }),
1564
+ /* @__PURE__ */ jsxRuntime.jsx(AccentLine2, { "aria-hidden": "true" }),
1565
+ /* @__PURE__ */ jsxRuntime.jsx(Description2, { children: description })
1566
+ ] });
1567
+ }
1568
+ );
1569
+ WarriorCard.displayName = "WarriorCard";
1570
+ var Bar = styled30__default.default.nav`
1571
+ position: fixed;
1572
+ bottom: 0;
1573
+ left: 0;
1574
+ right: 0;
1575
+ display: flex;
1576
+ justify-content: space-around;
1577
+ align-items: stretch;
1578
+ padding: 12px 0;
1579
+ background: #112023;
1580
+ color: #ffffff;
1581
+ border-top-left-radius: 20px;
1582
+ border-top-right-radius: 20px;
1583
+ overflow: hidden;
1584
+ z-index: 100;
1585
+ `;
1586
+ var Item = styled30__default.default.a`
1587
+ display: flex;
1588
+ flex-direction: column;
1589
+ align-items: center;
1590
+ justify-content: center;
1591
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1592
+ flex: 1 1 0;
1593
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.sm} ${theme2.spacing.xs}`};
1594
+ color: inherit;
1595
+ text-decoration: none;
1596
+ opacity: ${({ $active }) => $active ? 1 : 0.85};
1597
+ transition: opacity 0.15s ease;
1598
+
1599
+ &:hover {
1600
+ opacity: 1;
1601
+ }
1602
+
1603
+ &:focus-visible {
1604
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1605
+ outline-offset: -2px;
1606
+ }
1607
+ `;
1608
+ var IconSlot3 = styled30__default.default.span`
1609
+ display: inline-flex;
1610
+ align-items: center;
1611
+ justify-content: center;
1612
+ width: 24px;
1613
+ height: 24px;
1614
+ `;
1615
+ var Label3 = styled30__default.default.span`
1616
+ font-size: 12px;
1617
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1618
+ line-height: 16px;
1619
+ `;
1620
+ var BottomNav = react.forwardRef(({ items, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsx(Bar, { ref, ...rest, children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(
1621
+ Item,
1622
+ {
1623
+ href: item.href,
1624
+ $active: !!item.active,
1625
+ "aria-current": item.active ? "page" : void 0,
1626
+ children: [
1627
+ /* @__PURE__ */ jsxRuntime.jsx(IconSlot3, { "aria-hidden": "true", children: item.icon }),
1628
+ /* @__PURE__ */ jsxRuntime.jsx(Label3, { children: item.label })
1629
+ ]
1630
+ },
1631
+ item.label
1632
+ )) }));
1633
+ BottomNav.displayName = "BottomNav";
1634
+ var Section = styled30__default.default.section`
1635
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
1636
+ `;
1637
+ var Row = styled30__default.default.div`
1638
+ display: flex;
1639
+ flex-wrap: wrap;
1640
+ gap: ${({ theme: theme2 }) => theme2.layout.gridGap};
1641
+ justify-content: center;
1642
+ `;
1643
+ var BrandsSection = ({ heading, subheading, brands, ...rest }) => {
1644
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section, { ...rest, children: [
1645
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
1646
+ /* @__PURE__ */ jsxRuntime.jsx(Row, { children: brands.map((brand) => /* @__PURE__ */ jsxRuntime.jsx(BrandLogo, { ...brand }, brand.name)) })
1647
+ ] });
1648
+ };
1649
+ BrandsSection.displayName = "BrandsSection";
1650
+ var Panel3 = styled30__default.default.div`
1651
+ position: absolute;
1652
+ top: 100%;
1653
+ left: 0;
1654
+ display: ${({ $open }) => $open ? "grid" : "none"};
1655
+ grid-template-columns: repeat(3, minmax(160px, 1fr));
1656
+ column-gap: ${({ theme: theme2 }) => theme2.spacing.xl};
1657
+ row-gap: ${({ theme: theme2 }) => theme2.spacing.sm};
1658
+ min-width: 720px;
1659
+ padding: ${({ theme: theme2 }) => theme2.spacing.xl};
1660
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
1661
+ color: ${({ theme: theme2 }) => theme2.colors.text};
1662
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
1663
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
1664
+ `;
1665
+ var ItemLink = styled30__default.default.a`
1666
+ display: inline-flex;
1667
+ align-items: center;
1668
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
1669
+ color: ${({ theme: theme2 }) => theme2.colors.text};
1670
+ text-decoration: none;
1671
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1672
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1673
+ line-height: 1.4;
1674
+
1675
+ &:hover {
1676
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
1677
+ }
1678
+ `;
1679
+ var ItemIcon = styled30__default.default.span`
1680
+ display: inline-flex;
1681
+ align-items: center;
1682
+ justify-content: center;
1683
+ width: 18px;
1684
+ height: 18px;
1685
+
1686
+ & > img,
1687
+ & > svg {
1688
+ width: 100%;
1689
+ height: 100%;
1690
+ object-fit: contain;
1691
+ }
1692
+ `;
1693
+ var CategoryDropdown = ({
1694
+ items,
1695
+ open,
1696
+ panelId,
1697
+ LinkComponent,
1698
+ onItemClick
1699
+ }) => {
1700
+ const Link = LinkComponent ?? "a";
1701
+ return /* @__PURE__ */ jsxRuntime.jsx(Panel3, { id: panelId, $open: open, role: "region", children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsxs(ItemLink, { as: Link, href: item.href, onClick: onItemClick, children: [
1702
+ item.icon ? /* @__PURE__ */ jsxRuntime.jsx(ItemIcon, { "aria-hidden": "true", children: typeof item.icon === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: item.icon, alt: "" }) : item.icon }) : null,
1703
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: item.label })
1704
+ ] }, item.href)) });
1705
+ };
1706
+ var Bar2 = styled30__default.default.header`
1707
+ position: sticky;
1708
+ top: 0;
1709
+ z-index: 200;
1710
+ display: flex;
1711
+ align-items: center;
1712
+ justify-content: center;
1713
+ width: 100%;
1714
+ padding: 4px 48px;
1715
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
1716
+ color: #fbfbfb;
1717
+
1718
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1719
+ height: 70px;
1720
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
1721
+ justify-content: space-between;
1722
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
1723
+ }
1724
+ `;
1725
+ var DesktopNav = styled30__default.default.nav`
1726
+ display: flex;
1727
+ align-items: center;
1728
+
1729
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1730
+ display: none;
1731
+ }
1732
+ `;
1733
+ var CategoryList = styled30__default.default.ul`
1734
+ display: flex;
1735
+ align-items: center;
1736
+ gap: 32px;
1737
+ margin: 0;
1738
+ padding: ${({ theme: theme2 }) => theme2.spacing.sm};
1739
+ list-style: none;
1740
+ `;
1741
+ var CategoryItem = styled30__default.default.li`
1742
+ position: relative;
1743
+ display: inline-flex;
1744
+ align-items: center;
1745
+ `;
1746
+ var CategoryButton = styled30__default.default.button`
1747
+ display: inline-flex;
1748
+ align-items: center;
1749
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1750
+ padding: 0;
1751
+ background: transparent;
1752
+ border: none;
1753
+ color: inherit;
1754
+ cursor: pointer;
1755
+ font-family: inherit;
1756
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1757
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1758
+ line-height: 24px;
1759
+ white-space: nowrap;
1760
+
1761
+ &:focus-visible {
1762
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1763
+ outline-offset: 4px;
1764
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1765
+ }
1766
+ `;
1767
+ var CategoryLink = styled30__default.default.a`
1768
+ display: inline-flex;
1769
+ align-items: center;
1770
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1771
+ color: inherit;
1772
+ text-decoration: none;
1773
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1774
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1775
+ line-height: 24px;
1776
+ white-space: nowrap;
1777
+
1778
+ &:focus-visible {
1779
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1780
+ outline-offset: 4px;
1781
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1782
+ }
1783
+ `;
1784
+ var Chevron3 = styled30__default.default.span`
1785
+ display: inline-flex;
1786
+ align-items: center;
1787
+ justify-content: center;
1788
+ width: 16px;
1789
+ height: 16px;
1790
+ transition: transform 0.2s ease;
1791
+ transform: rotate(${({ $open }) => $open ? "180deg" : "0deg"});
1792
+ `;
1793
+ var Badge = styled30__default.default.span`
1794
+ display: inline-flex;
1795
+ align-items: center;
1796
+ margin-left: ${({ theme: theme2 }) => theme2.spacing.xs};
1797
+ `;
1798
+ var MobileChrome = styled30__default.default.div`
1799
+ display: none;
1800
+
1801
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1802
+ display: flex;
1803
+ align-items: center;
1804
+ flex: 0 0 auto;
1805
+ min-width: 0;
1806
+ }
1807
+ `;
1808
+ var MobilePhone = styled30__default.default.a`
1809
+ display: none;
1810
+
1811
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1812
+ display: flex;
1813
+ flex: 1 1 auto;
1814
+ align-items: center;
1815
+ justify-content: center;
1816
+ color: inherit;
1817
+ text-decoration: none;
1818
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
1819
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
1820
+ white-space: nowrap;
1821
+ min-width: 0;
1822
+ }
1823
+ `;
1824
+ var Pointer = styled30__default.default.span`
1825
+ position: absolute;
1826
+ top: 100%;
1827
+ left: 50%;
1828
+ transform: translate(-50%, -100%);
1829
+ width: 16px;
1830
+ height: 8px;
1831
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
1832
+ clip-path: polygon(50% 0, 0 100%, 100% 100%);
1833
+ z-index: 201;
1834
+ pointer-events: none;
1835
+
1836
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1837
+ display: none;
1838
+ }
1839
+ `;
1840
+ var MobileLogoLink = styled30__default.default.a`
1841
+ display: inline-flex;
1842
+ align-items: center;
1843
+ text-decoration: none;
1844
+ color: inherit;
1845
+ height: 40px;
1846
+ flex-shrink: 0;
1847
+
1848
+ & > img,
1849
+ & > svg {
1850
+ height: 100%;
1851
+ width: auto;
1852
+ object-fit: contain;
1853
+ }
1854
+ `;
1855
+ var MobileActions = styled30__default.default.div`
1856
+ display: none;
1857
+
1858
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
1859
+ display: flex;
1860
+ align-items: center;
1861
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
1862
+ }
1863
+ `;
1864
+ var SearchIconButton = styled30__default.default.button`
1865
+ display: inline-flex;
1866
+ align-items: center;
1867
+ justify-content: center;
1868
+ width: 36px;
1869
+ height: 36px;
1870
+ background: transparent;
1871
+ border: none;
1872
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
1873
+ color: inherit;
1874
+ cursor: pointer;
1875
+
1876
+ &:hover {
1877
+ background: rgba(255, 255, 255, 0.12);
1878
+ }
1879
+
1880
+ &:focus-visible {
1881
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1882
+ outline-offset: 2px;
1883
+ }
1884
+ `;
1885
+ var SearchIconLink = styled30__default.default.a`
1886
+ display: inline-flex;
1887
+ align-items: center;
1888
+ justify-content: center;
1889
+ width: 36px;
1890
+ height: 36px;
1891
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
1892
+ color: inherit;
1893
+ text-decoration: none;
1894
+
1895
+ &:hover {
1896
+ background: rgba(255, 255, 255, 0.12);
1897
+ }
1898
+
1899
+ &:focus-visible {
1900
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1901
+ outline-offset: 2px;
1902
+ }
1903
+ `;
1904
+ var Button = styled30__default.default.button`
1905
+ display: inline-flex;
1906
+ flex-direction: column;
1907
+ align-items: center;
1908
+ justify-content: center;
1909
+ gap: 5px;
1910
+ width: 36px;
1911
+ height: 36px;
1912
+ padding: 0;
1913
+ background: transparent;
1914
+ border: none;
1915
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
1916
+ color: inherit;
1917
+ cursor: pointer;
1918
+
1919
+ &:hover {
1920
+ background: rgba(255, 255, 255, 0.12);
1921
+ }
1922
+
1923
+ &:focus-visible {
1924
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
1925
+ outline-offset: 2px;
1926
+ }
1927
+
1928
+ & > span {
1929
+ display: block;
1930
+ width: 22px;
1931
+ height: 2px;
1932
+ background: currentColor;
1933
+ border-radius: 2px;
1934
+ transition: transform 0.2s ease, opacity 0.2s ease;
1935
+ }
1936
+
1937
+ ${({ $open }) => $open ? `
1938
+ & > span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
1939
+ & > span:nth-child(2) { opacity: 0; }
1940
+ & > span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
1941
+ ` : ""}
1942
+ `;
1943
+ var Hamburger = ({ open, onClick, controls }) => /* @__PURE__ */ jsxRuntime.jsxs(
1944
+ Button,
1945
+ {
1946
+ type: "button",
1947
+ $open: open,
1948
+ onClick,
1949
+ "aria-label": "Toggle menu",
1950
+ "aria-expanded": open,
1951
+ "aria-controls": controls,
1952
+ children: [
1953
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true" }),
1954
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true" }),
1955
+ /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": "true" })
1956
+ ]
1957
+ }
1958
+ );
1959
+ var TOP_BAR_HEIGHT = "70px";
1960
+ var Backdrop = styled30__default.default.div`
1961
+ position: fixed;
1962
+ top: ${TOP_BAR_HEIGHT};
1963
+ left: 0;
1964
+ right: 0;
1965
+ bottom: 0;
1966
+ z-index: 300;
1967
+ background: rgba(0, 0, 0, 0.4);
1968
+ opacity: ${({ $open }) => $open ? 1 : 0};
1969
+ visibility: ${({ $open }) => $open ? "visible" : "hidden"};
1970
+ transition: opacity 0.2s ease, visibility 0.2s ease;
1971
+ `;
1972
+ var Panel4 = styled30__default.default.aside`
1973
+ position: fixed;
1974
+ top: ${TOP_BAR_HEIGHT};
1975
+ right: 0;
1976
+ z-index: 310;
1977
+ display: flex;
1978
+ flex-direction: column;
1979
+ width: 78vw;
1980
+ max-width: 360px;
1981
+ height: calc(100vh - ${TOP_BAR_HEIGHT});
1982
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
1983
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
1984
+ transform: translateX(${({ $open }) => $open ? "0%" : "100%"});
1985
+ transition: transform 0.25s ease;
1986
+ overflow-y: auto;
1987
+ `;
1988
+ var Body2 = styled30__default.default.nav`
1989
+ display: flex;
1990
+ flex-direction: column;
1991
+ flex: 1 1 auto;
1992
+ `;
1993
+ var rowBase = `
1994
+ display: flex;
1995
+ align-items: center;
1996
+ width: 100%;
1997
+ padding: 14px 20px;
1998
+ border: none;
1999
+ background: transparent;
2000
+ color: inherit;
2001
+ text-decoration: none;
2002
+ font-family: inherit;
2003
+ font-size: 16px;
2004
+ font-weight: 500;
2005
+ line-height: 24px;
2006
+ border-bottom: 1px solid #e2e2e2;
2007
+ text-align: left;
2008
+ cursor: pointer;
2009
+ `;
2010
+ var RowLink = styled30__default.default.a`
2011
+ ${rowBase}
2012
+
2013
+ &:hover,
2014
+ &:focus-visible {
2015
+ background: rgba(0, 0, 0, 0.03);
2016
+ }
2017
+ `;
2018
+ var RowButton = styled30__default.default.button`
2019
+ ${rowBase}
2020
+ justify-content: space-between;
2021
+
2022
+ &:hover,
2023
+ &:focus-visible {
2024
+ background: rgba(0, 0, 0, 0.03);
2025
+ }
2026
+
2027
+ &:focus-visible {
2028
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
2029
+ outline-offset: -2px;
2030
+ }
2031
+ `;
2032
+ var Label4 = styled30__default.default.span`
2033
+ flex: 0 1 auto;
2034
+ `;
2035
+ var InlineBadge = styled30__default.default.span`
2036
+ display: inline-flex;
2037
+ align-items: center;
2038
+ margin-left: ${({ theme: theme2 }) => theme2.spacing.sm};
2039
+ font-size: 12px;
2040
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2041
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
2042
+ `;
2043
+ var TrailingSlot = styled30__default.default.span`
2044
+ display: inline-flex;
2045
+ align-items: center;
2046
+ justify-content: center;
2047
+ margin-left: auto;
2048
+ `;
2049
+ var Chevron4 = styled30__default.default.span`
2050
+ display: inline-flex;
2051
+ align-items: center;
2052
+ justify-content: center;
2053
+ width: 20px;
2054
+ height: 20px;
2055
+ margin-left: auto;
2056
+ transition: transform 0.2s ease;
2057
+ transform: rotate(${({ $open }) => $open ? "180deg" : "0deg"});
2058
+ `;
2059
+ var ChevronSvg = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
2060
+ "path",
2061
+ {
2062
+ d: "M4 6l4 4 4-4",
2063
+ stroke: "currentColor",
2064
+ strokeWidth: "1.5",
2065
+ strokeLinecap: "round",
2066
+ strokeLinejoin: "round"
2067
+ }
2068
+ ) });
2069
+ var SubList = styled30__default.default.ul`
2070
+ display: ${({ $open }) => $open ? "flex" : "none"};
2071
+ flex-direction: column;
2072
+ gap: 0;
2073
+ margin: 0;
2074
+ padding: 0 0 ${({ theme: theme2 }) => theme2.spacing.sm};
2075
+ list-style: none;
2076
+ background: rgba(0, 0, 0, 0.02);
2077
+ border-bottom: 1px solid #e2e2e2;
2078
+ `;
2079
+ var SubLink = styled30__default.default.a`
2080
+ display: flex;
2081
+ align-items: center;
2082
+ padding: 10px 36px;
2083
+ color: ${({ theme: theme2 }) => theme2.colors.text};
2084
+ text-decoration: none;
2085
+ font-size: 14px;
2086
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
2087
+
2088
+ &:hover,
2089
+ &:focus-visible {
2090
+ background: rgba(0, 0, 0, 0.04);
2091
+ }
2092
+ `;
2093
+ var FooterLinks = styled30__default.default.div`
2094
+ display: flex;
2095
+ flex-direction: column;
2096
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.lg} 0 ${theme2.spacing.md}`};
2097
+ `;
2098
+ var FooterLink = styled30__default.default.a`
2099
+ display: flex;
2100
+ align-items: center;
2101
+ padding: 10px 20px;
2102
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
2103
+ text-decoration: none;
2104
+ font-size: 16px;
2105
+ font-weight: 500;
2106
+ line-height: 24px;
2107
+
2108
+ &:hover,
2109
+ &:focus-visible {
2110
+ background: rgba(0, 0, 0, 0.04);
2111
+ }
2112
+ `;
2113
+ var CtaWrapper = styled30__default.default.div`
2114
+ padding: ${({ theme: theme2 }) => theme2.spacing.md} 20px ${({ theme: theme2 }) => theme2.spacing.lg};
2115
+ `;
2116
+ var CtaButton = styled30__default.default.button`
2117
+ display: inline-flex;
2118
+ align-items: center;
2119
+ justify-content: center;
2120
+ width: 100%;
2121
+ height: 48px;
2122
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.xl};
2123
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
2124
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
2125
+ border: none;
2126
+ border-radius: 9999px;
2127
+ font-family: inherit;
2128
+ font-size: 16px;
2129
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2130
+ line-height: 1;
2131
+ cursor: pointer;
2132
+ transition: background 0.15s ease;
2133
+
2134
+ &:hover {
2135
+ background: ${({ theme: theme2 }) => polished.darken(0.05, theme2.colors.accent)};
2136
+ }
2137
+
2138
+ &:focus-visible {
2139
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.primary};
2140
+ outline-offset: 2px;
2141
+ }
2142
+ `;
2143
+ var MobileDrawer = ({
2144
+ open,
2145
+ onClose,
2146
+ categories,
2147
+ LinkComponent,
2148
+ drawerId,
2149
+ footerLinks,
2150
+ cta
2151
+ }) => {
2152
+ const Link = LinkComponent ?? "a";
2153
+ const [expanded, setExpanded] = react.useState({});
2154
+ const toggleRow = (index) => {
2155
+ setExpanded((prev) => ({ ...prev, [index]: !prev[index] }));
2156
+ };
2157
+ const handleCtaClick = () => {
2158
+ if (!cta) return;
2159
+ if (cta.href) {
2160
+ window.location.assign(cta.href);
2161
+ onClose();
2162
+ return;
2163
+ }
2164
+ cta.onClick?.();
2165
+ onClose();
2166
+ };
2167
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2168
+ /* @__PURE__ */ jsxRuntime.jsx(Backdrop, { $open: open, onClick: onClose, "aria-hidden": "true" }),
2169
+ /* @__PURE__ */ jsxRuntime.jsxs(Panel4, { id: drawerId, $open: open, "aria-hidden": !open, "aria-label": "Mobile navigation", children: [
2170
+ /* @__PURE__ */ jsxRuntime.jsx(Body2, { "aria-label": "Mobile primary", children: categories.map((category, index) => {
2171
+ const hasItems = (category.items?.length ?? 0) > 0;
2172
+ if (!hasItems) {
2173
+ return /* @__PURE__ */ jsxRuntime.jsxs(
2174
+ RowLink,
2175
+ {
2176
+ as: Link,
2177
+ href: category.href ?? "#",
2178
+ onClick: onClose,
2179
+ children: [
2180
+ /* @__PURE__ */ jsxRuntime.jsx(Label4, { children: category.label }),
2181
+ category.badge ? /* @__PURE__ */ jsxRuntime.jsx(InlineBadge, { children: category.badge }) : null,
2182
+ category.trailingIcon ? /* @__PURE__ */ jsxRuntime.jsx(TrailingSlot, { "aria-hidden": "true", children: category.trailingIcon }) : null
2183
+ ]
2184
+ },
2185
+ category.label
2186
+ );
2187
+ }
2188
+ const isOpen = !!expanded[index];
2189
+ return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
2190
+ /* @__PURE__ */ jsxRuntime.jsxs(
2191
+ RowButton,
2192
+ {
2193
+ type: "button",
2194
+ $open: isOpen,
2195
+ "aria-expanded": isOpen,
2196
+ onClick: () => toggleRow(index),
2197
+ children: [
2198
+ /* @__PURE__ */ jsxRuntime.jsx(Label4, { children: category.label }),
2199
+ category.badge ? /* @__PURE__ */ jsxRuntime.jsx(InlineBadge, { children: category.badge }) : null,
2200
+ /* @__PURE__ */ jsxRuntime.jsx(Chevron4, { $open: isOpen, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(ChevronSvg, {}) })
2201
+ ]
2202
+ }
2203
+ ),
2204
+ /* @__PURE__ */ jsxRuntime.jsx(SubList, { $open: isOpen, children: category.items?.map((item) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(SubLink, { as: Link, href: item.href, onClick: onClose, children: item.label }) }, item.href)) })
2205
+ ] }, category.label);
2206
+ }) }),
2207
+ footerLinks && footerLinks.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(FooterLinks, { children: footerLinks.map((link) => /* @__PURE__ */ jsxRuntime.jsx(FooterLink, { as: Link, href: link.href, onClick: onClose, children: link.label }, link.href)) }) : null,
2208
+ cta ? /* @__PURE__ */ jsxRuntime.jsx(CtaWrapper, { children: /* @__PURE__ */ jsxRuntime.jsx(CtaButton, { type: "button", onClick: handleCtaClick, children: cta.label }) }) : null
2209
+ ] })
2210
+ ] });
2211
+ };
2212
+ var ChevronSvg2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
2213
+ "path",
2214
+ {
2215
+ d: "M4 6l4 4 4-4",
2216
+ stroke: "currentColor",
2217
+ strokeWidth: "1.5",
2218
+ strokeLinecap: "round",
2219
+ strokeLinejoin: "round"
2220
+ }
2221
+ ) });
2222
+ var SearchSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
2223
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "9", cy: "9", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
2224
+ /* @__PURE__ */ jsxRuntime.jsx(
2225
+ "line",
2226
+ {
2227
+ x1: "13.5",
2228
+ y1: "13.5",
2229
+ x2: "17.5",
2230
+ y2: "17.5",
2231
+ stroke: "currentColor",
2232
+ strokeWidth: "1.5",
2233
+ strokeLinecap: "round"
2234
+ }
2235
+ )
2236
+ ] });
2237
+ var CategoryNavbar = react.forwardRef(
2238
+ ({
2239
+ logo,
2240
+ logoHref = "/",
2241
+ categories,
2242
+ searchHref,
2243
+ phoneNumber,
2244
+ LinkComponent,
2245
+ defaultMobileOpen = false,
2246
+ mobileOpen,
2247
+ onMobileOpenChange,
2248
+ mobileFooterLinks,
2249
+ mobileCta,
2250
+ ...rest
2251
+ }, ref) => {
2252
+ const Link = LinkComponent ?? "a";
2253
+ const drawerId = react.useId();
2254
+ const [internalMobileOpen, setInternalMobileOpen] = react.useState(defaultMobileOpen);
2255
+ const isControlled = mobileOpen !== void 0;
2256
+ const drawerOpen = isControlled ? mobileOpen : internalMobileOpen;
2257
+ const [openIndex, setOpenIndex] = react.useState(null);
2258
+ const navRef = react.useRef(null);
2259
+ const setDrawerOpen = (next) => {
2260
+ if (!isControlled) setInternalMobileOpen(next);
2261
+ onMobileOpenChange?.(next);
2262
+ };
2263
+ react.useEffect(() => {
2264
+ if (!drawerOpen && openIndex === null) return;
2265
+ const handleKey = (event) => {
2266
+ if (event.key !== "Escape") return;
2267
+ if (drawerOpen) {
2268
+ if (!isControlled) setInternalMobileOpen(false);
2269
+ onMobileOpenChange?.(false);
2270
+ }
2271
+ if (openIndex !== null) setOpenIndex(null);
2272
+ };
2273
+ document.addEventListener("keydown", handleKey);
2274
+ return () => document.removeEventListener("keydown", handleKey);
2275
+ }, [drawerOpen, openIndex, isControlled, onMobileOpenChange]);
2276
+ react.useEffect(() => {
2277
+ if (openIndex === null) return;
2278
+ const handleClick = (event) => {
2279
+ if (navRef.current && !navRef.current.contains(event.target)) {
2280
+ setOpenIndex(null);
2281
+ }
2282
+ };
2283
+ document.addEventListener("mousedown", handleClick);
2284
+ return () => document.removeEventListener("mousedown", handleClick);
2285
+ }, [openIndex]);
2286
+ const setNavRef = (element) => {
2287
+ navRef.current = element;
2288
+ if (typeof ref === "function") ref(element);
2289
+ else if (ref) ref.current = element;
2290
+ };
2291
+ return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
2292
+ /* @__PURE__ */ jsxRuntime.jsxs(Bar2, { ref: setNavRef, ...rest, children: [
2293
+ /* @__PURE__ */ jsxRuntime.jsx(MobileChrome, { children: /* @__PURE__ */ jsxRuntime.jsx(MobileLogoLink, { as: Link, href: logoHref, "aria-label": "Home", children: typeof logo === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: "" }) : logo }) }),
2294
+ /* @__PURE__ */ jsxRuntime.jsx(DesktopNav, { "aria-label": "Categories", children: /* @__PURE__ */ jsxRuntime.jsx(CategoryList, { children: categories.map((category, index) => {
2295
+ const hasItems = (category.items?.length ?? 0) > 0;
2296
+ const itemPanelId = `${drawerId}-cat-${index}`;
2297
+ if (!hasItems) {
2298
+ return /* @__PURE__ */ jsxRuntime.jsx(CategoryItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(CategoryLink, { as: Link, href: category.href ?? "#", children: [
2299
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: category.label }),
2300
+ category.badge ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { children: category.badge }) : null
2301
+ ] }) }, category.label);
2302
+ }
2303
+ const isOpen = openIndex === index;
2304
+ return /* @__PURE__ */ jsxRuntime.jsxs(CategoryItem, { children: [
2305
+ /* @__PURE__ */ jsxRuntime.jsxs(
2306
+ CategoryButton,
2307
+ {
2308
+ type: "button",
2309
+ $open: isOpen,
2310
+ "aria-expanded": isOpen,
2311
+ "aria-controls": itemPanelId,
2312
+ onClick: () => setOpenIndex(isOpen ? null : index),
2313
+ children: [
2314
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: category.label }),
2315
+ category.badge ? /* @__PURE__ */ jsxRuntime.jsx(Badge, { children: category.badge }) : null,
2316
+ /* @__PURE__ */ jsxRuntime.jsx(Chevron3, { $open: isOpen, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(ChevronSvg2, {}) })
2317
+ ]
2318
+ }
2319
+ ),
2320
+ isOpen ? /* @__PURE__ */ jsxRuntime.jsx(Pointer, { "aria-hidden": "true" }) : null,
2321
+ /* @__PURE__ */ jsxRuntime.jsx(
2322
+ CategoryDropdown,
2323
+ {
2324
+ items: category.items ?? [],
2325
+ open: isOpen,
2326
+ panelId: itemPanelId,
2327
+ LinkComponent,
2328
+ onItemClick: () => setOpenIndex(null)
2329
+ }
2330
+ )
2331
+ ] }, category.label);
2332
+ }) }) }),
2333
+ phoneNumber ? /* @__PURE__ */ jsxRuntime.jsx(
2334
+ MobilePhone,
2335
+ {
2336
+ href: `tel:${phoneNumber.replace(/\s+/g, "")}`,
2337
+ "aria-label": `Call ${phoneNumber}`,
2338
+ children: phoneNumber
2339
+ }
2340
+ ) : null,
2341
+ /* @__PURE__ */ jsxRuntime.jsxs(MobileActions, { children: [
2342
+ searchHref ? /* @__PURE__ */ jsxRuntime.jsx(SearchIconLink, { as: Link, href: searchHref, "aria-label": "Search", children: /* @__PURE__ */ jsxRuntime.jsx(SearchSvg, {}) }) : /* @__PURE__ */ jsxRuntime.jsx(SearchIconButton, { type: "button", "aria-label": "Search", children: /* @__PURE__ */ jsxRuntime.jsx(SearchSvg, {}) }),
2343
+ /* @__PURE__ */ jsxRuntime.jsx(
2344
+ Hamburger,
2345
+ {
2346
+ open: drawerOpen,
2347
+ onClick: () => setDrawerOpen(!drawerOpen),
2348
+ controls: drawerId
2349
+ }
2350
+ )
2351
+ ] })
2352
+ ] }),
2353
+ /* @__PURE__ */ jsxRuntime.jsx(
2354
+ MobileDrawer,
2355
+ {
2356
+ open: drawerOpen,
2357
+ onClose: () => setDrawerOpen(false),
2358
+ categories,
2359
+ LinkComponent,
2360
+ drawerId,
2361
+ footerLinks: mobileFooterLinks,
2362
+ cta: mobileCta
2363
+ }
2364
+ )
2365
+ ] });
2366
+ }
2367
+ );
2368
+ CategoryNavbar.displayName = "CategoryNavbar";
2369
+ var Section2 = styled30__default.default.section`
2370
+ display: flex;
2371
+ justify-content: center;
2372
+ padding: 0 80px;
2373
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2374
+
2375
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2376
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
2377
+ }
2378
+ `;
2379
+ var Inner = styled30__default.default.div`
2380
+ display: flex;
2381
+ align-items: center;
2382
+ justify-content: space-between;
2383
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
2384
+ width: 100%;
2385
+ max-width: 1106px;
2386
+
2387
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2388
+ flex-direction: column;
2389
+ align-items: stretch;
2390
+ }
2391
+ `;
2392
+ var IllustrationSlot = styled30__default.default.div`
2393
+ flex: 0 0 auto;
2394
+ display: flex;
2395
+ align-items: center;
2396
+ justify-content: center;
2397
+
2398
+ & > svg,
2399
+ & > img {
2400
+ width: 367px;
2401
+ max-width: 100%;
2402
+ height: auto;
2403
+ }
2404
+
2405
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2406
+ & > svg,
2407
+ & > img {
2408
+ width: 240px;
2409
+ }
2410
+ }
2411
+ `;
2412
+ var FormSlot = styled30__default.default.div`
2413
+ flex: 0 0 auto;
2414
+ display: flex;
2415
+ justify-content: center;
2416
+ `;
2417
+ var ContactSection = react.forwardRef(
2418
+ ({
2419
+ illustration,
2420
+ eyebrow,
2421
+ heading,
2422
+ submitLabel,
2423
+ headerIllustration,
2424
+ countryCodes,
2425
+ destinations,
2426
+ onSubmit,
2427
+ ...rest
2428
+ }, ref) => /* @__PURE__ */ jsxRuntime.jsx(Section2, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsxs(Inner, { children: [
2429
+ /* @__PURE__ */ jsxRuntime.jsx(IllustrationSlot, { "aria-hidden": "true", children: illustration }),
2430
+ /* @__PURE__ */ jsxRuntime.jsx(FormSlot, { children: /* @__PURE__ */ jsxRuntime.jsx(
2431
+ ContactForm,
2432
+ {
2433
+ eyebrow,
2434
+ heading,
2435
+ submitLabel,
2436
+ headerIllustration,
2437
+ countryCodes,
2438
+ destinations,
2439
+ onSubmit
2440
+ }
2441
+ ) })
2442
+ ] }) })
2443
+ );
2444
+ ContactSection.displayName = "ContactSection";
2445
+ var Section3 = styled30__default.default.section`
2446
+ display: flex;
2447
+ justify-content: center;
2448
+ padding: 0 80px;
2449
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2450
+
2451
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2452
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
2453
+ }
2454
+ `;
2455
+ var Banner = styled30__default.default.div`
2456
+ position: relative;
2457
+ display: flex;
2458
+ align-items: center;
2459
+ width: 100%;
2460
+ min-height: 300px;
2461
+ padding-left: 50px;
2462
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
2463
+ background-color: ${({ $backgroundColor, theme: theme2 }) => $backgroundColor ?? theme2.colors.primary};
2464
+ background-image: ${({ $backgroundImage }) => $backgroundImage ? `url(${$backgroundImage})` : "none"};
2465
+ background-size: cover;
2466
+ background-position: center;
2467
+ overflow: hidden;
2468
+
2469
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2470
+ padding-left: ${({ theme: theme2 }) => theme2.spacing.lg};
2471
+ padding-right: ${({ theme: theme2 }) => theme2.spacing.lg};
2472
+ min-height: 300px;
2473
+ }
2474
+ `;
2475
+ var Content2 = styled30__default.default.div`
2476
+ display: flex;
2477
+ flex-direction: column;
2478
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
2479
+ max-width: 550px;
2480
+ `;
2481
+ var TextStack = styled30__default.default.div`
2482
+ display: flex;
2483
+ flex-direction: column;
2484
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
2485
+ color: #ffffff;
2486
+ `;
2487
+ var Title4 = styled30__default.default.h2`
2488
+ margin: 0;
2489
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
2490
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2491
+ line-height: 1.4;
2492
+ `;
2493
+ var Subtitle = styled30__default.default.p`
2494
+ margin: 0;
2495
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
2496
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
2497
+ line-height: 1.5;
2498
+ `;
2499
+ var CtaButton2 = styled30__default.default.button`
2500
+ display: inline-flex;
2501
+ align-items: center;
2502
+ justify-content: center;
2503
+ align-self: flex-start;
2504
+ height: 44px;
2505
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.xl};
2506
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
2507
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
2508
+ border: none;
2509
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
2510
+ font-family: inherit;
2511
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
2512
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
2513
+ line-height: 18px;
2514
+ cursor: pointer;
2515
+ box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.14);
2516
+ transition: background 0.15s ease;
2517
+
2518
+ &:hover {
2519
+ background: ${({ theme: theme2 }) => polished.darken(0.05, theme2.colors.accent)};
2520
+ }
2521
+
2522
+ &:focus-visible {
2523
+ outline: 2px solid #ffffff;
2524
+ outline-offset: 2px;
2525
+ }
2526
+ `;
2527
+ var CtaBanner = react.forwardRef(
2528
+ ({ title, subtitle, backgroundImage, backgroundColor, cta, ...rest }, ref) => {
2529
+ const handleCtaClick = () => {
2530
+ if (cta.href) {
2531
+ window.location.assign(cta.href);
2532
+ return;
2533
+ }
2534
+ cta.onClick?.();
2535
+ };
2536
+ return /* @__PURE__ */ jsxRuntime.jsx(Section3, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsx(Banner, { $backgroundImage: backgroundImage, $backgroundColor: backgroundColor, children: /* @__PURE__ */ jsxRuntime.jsxs(Content2, { children: [
2537
+ /* @__PURE__ */ jsxRuntime.jsxs(TextStack, { children: [
2538
+ /* @__PURE__ */ jsxRuntime.jsx(Title4, { children: title }),
2539
+ subtitle ? /* @__PURE__ */ jsxRuntime.jsx(Subtitle, { children: subtitle }) : null
2540
+ ] }),
2541
+ /* @__PURE__ */ jsxRuntime.jsx(CtaButton2, { type: "button", onClick: handleCtaClick, children: cta.label })
2542
+ ] }) }) });
2543
+ }
2544
+ );
2545
+ CtaBanner.displayName = "CtaBanner";
2546
+ var Section4 = styled30__default.default.section`
2547
+ display: flex;
2548
+ flex-direction: column;
2549
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
2550
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
2551
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2552
+ `;
2553
+ var Heading3 = styled30__default.default.h2`
2554
+ margin: 0;
2555
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
2556
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2557
+ line-height: 1.2;
2558
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
2559
+ `;
2560
+ var ScrollFrame = styled30__default.default.div`
2561
+ display: flex;
2562
+ flex-direction: column;
2563
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
2564
+ overflow-x: auto;
2565
+ scrollbar-width: none;
2566
+
2567
+ &::-webkit-scrollbar {
2568
+ display: none;
2569
+ }
2570
+ `;
2571
+ var Row2 = styled30__default.default.div`
2572
+ display: flex;
2573
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
2574
+ width: max-content;
2575
+ `;
2576
+ var DestinationsSection = react.forwardRef(
2577
+ ({ heading, destinations, ...rest }, ref) => {
2578
+ const half = Math.ceil(destinations.length / 2);
2579
+ const firstRow = destinations.slice(0, half);
2580
+ const secondRow = destinations.slice(half);
2581
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section4, { ref, ...rest, children: [
2582
+ /* @__PURE__ */ jsxRuntime.jsx(Heading3, { children: heading }),
2583
+ /* @__PURE__ */ jsxRuntime.jsxs(ScrollFrame, { children: [
2584
+ /* @__PURE__ */ jsxRuntime.jsx(Row2, { children: firstRow.map((destination) => /* @__PURE__ */ jsxRuntime.jsx(
2585
+ DestinationCard,
2586
+ {
2587
+ image: destination.image,
2588
+ alt: destination.alt,
2589
+ label: destination.label,
2590
+ href: destination.href
2591
+ },
2592
+ `r1-${destination.label}`
2593
+ )) }),
2594
+ secondRow.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(Row2, { children: secondRow.map((destination) => /* @__PURE__ */ jsxRuntime.jsx(
2595
+ DestinationCard,
2596
+ {
2597
+ image: destination.image,
2598
+ alt: destination.alt,
2599
+ label: destination.label,
2600
+ href: destination.href
2601
+ },
2602
+ `r2-${destination.label}`
2603
+ )) }) : null
2604
+ ] })
2605
+ ] });
2606
+ }
2607
+ );
2608
+ DestinationsSection.displayName = "DestinationsSection";
2609
+ var useScrollSnap = (itemCount) => {
2610
+ const elRef = react.useRef(null);
2611
+ const [canPrev, setCanPrev] = react.useState(false);
2612
+ const [canNext, setCanNext] = react.useState(itemCount > 1);
2613
+ const [activeIndex, setActiveIndex] = react.useState(0);
2614
+ const [scrollProgress, setScrollProgress] = react.useState(0);
2615
+ const recompute = react.useCallback(() => {
2616
+ const el = elRef.current;
2617
+ if (!el) return;
2618
+ setCanPrev(el.scrollLeft > 0);
2619
+ setCanNext(el.scrollLeft + el.clientWidth < el.scrollWidth - 1);
2620
+ const maxScroll = el.scrollWidth - el.clientWidth;
2621
+ setScrollProgress(maxScroll > 0 ? el.scrollLeft / maxScroll : 0);
2622
+ if (itemCount > 0) {
2623
+ const itemWidth = el.scrollWidth / itemCount;
2624
+ setActiveIndex(Math.round(el.scrollLeft / itemWidth));
2625
+ }
2626
+ }, [itemCount]);
2627
+ const setRef = react.useCallback(
2628
+ (node) => {
2629
+ const previous = elRef.current;
2630
+ if (previous) {
2631
+ previous.removeEventListener("scroll", recompute);
2632
+ }
2633
+ elRef.current = node;
2634
+ if (node) {
2635
+ node.addEventListener("scroll", recompute, { passive: true });
2636
+ recompute();
2637
+ }
2638
+ },
2639
+ [recompute]
2640
+ );
2641
+ react.useEffect(() => {
2642
+ if (typeof window === "undefined") return;
2643
+ window.addEventListener("resize", recompute);
2644
+ return () => window.removeEventListener("resize", recompute);
2645
+ }, [recompute]);
2646
+ const scrollPrev = react.useCallback(() => {
2647
+ elRef.current?.scrollBy({ left: -elRef.current.clientWidth, behavior: "smooth" });
2648
+ }, []);
2649
+ const scrollNext = react.useCallback(() => {
2650
+ elRef.current?.scrollBy({ left: elRef.current.clientWidth, behavior: "smooth" });
2651
+ }, []);
2652
+ return { ref: setRef, scrollPrev, scrollNext, canPrev, canNext, activeIndex, scrollProgress };
2653
+ };
2654
+ var Section5 = styled30__default.default.section`
2655
+ position: relative;
2656
+ display: flex;
2657
+ flex-direction: column;
2658
+ align-items: center;
2659
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
2660
+ padding: 0 80px;
2661
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2662
+
2663
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2664
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
2665
+ }
2666
+ `;
2667
+ var Track = styled30__default.default.div`
2668
+ display: flex;
2669
+ width: 100%;
2670
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
2671
+ overflow-x: auto;
2672
+ scroll-snap-type: x mandatory;
2673
+ scrollbar-width: none;
2674
+
2675
+ &::-webkit-scrollbar {
2676
+ display: none;
2677
+ }
2678
+ `;
2679
+ var Indicators = styled30__default.default.div`
2680
+ display: flex;
2681
+ align-items: center;
2682
+ justify-content: center;
2683
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
2684
+ `;
2685
+ var Dot = styled30__default.default.span`
2686
+ display: inline-block;
2687
+ width: ${({ $active }) => $active ? "20px" : "5px"};
2688
+ height: 6px;
2689
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
2690
+ background: ${({ $active, theme: theme2 }) => $active ? theme2.colors.primary : theme2.colors.border};
2691
+ transition: width 0.2s ease, background 0.2s ease;
2692
+ `;
2693
+ var ArrowButton = styled30__default.default.button`
2694
+ position: absolute;
2695
+ top: 130px;
2696
+ ${({ $side }) => $side === "left" ? "left: 60px;" : "right: 60px;"}
2697
+ display: inline-flex;
2698
+ align-items: center;
2699
+ justify-content: center;
2700
+ width: 32px;
2701
+ height: 32px;
2702
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2703
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
2704
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
2705
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
2706
+ cursor: pointer;
2707
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
2708
+ transition: opacity 0.15s ease;
2709
+
2710
+ &:disabled {
2711
+ opacity: 0.4;
2712
+ cursor: not-allowed;
2713
+ }
2714
+
2715
+ &:focus-visible {
2716
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
2717
+ outline-offset: 2px;
2718
+ }
2719
+
2720
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2721
+ display: none;
2722
+ }
2723
+ `;
2724
+ var ChevronLeft = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
2725
+ "path",
2726
+ {
2727
+ d: "M10 12L6 8l4-4",
2728
+ stroke: "currentColor",
2729
+ strokeWidth: "1.5",
2730
+ strokeLinecap: "round",
2731
+ strokeLinejoin: "round"
2732
+ }
2733
+ ) });
2734
+ var ChevronRight = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
2735
+ "path",
2736
+ {
2737
+ d: "M6 4l4 4-4 4",
2738
+ stroke: "currentColor",
2739
+ strokeWidth: "1.5",
2740
+ strokeLinecap: "round",
2741
+ strokeLinejoin: "round"
2742
+ }
2743
+ ) });
2744
+ var EventCarousel = react.forwardRef(
2745
+ ({ events, ...rest }, ref) => {
2746
+ const {
2747
+ ref: trackRef,
2748
+ scrollPrev,
2749
+ scrollNext,
2750
+ canPrev,
2751
+ canNext,
2752
+ activeIndex
2753
+ } = useScrollSnap(events.length);
2754
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section5, { ref, ...rest, children: [
2755
+ /* @__PURE__ */ jsxRuntime.jsx(Track, { ref: trackRef, children: events.map((event) => /* @__PURE__ */ jsxRuntime.jsx(
2756
+ EventBanner,
2757
+ {
2758
+ image: event.image,
2759
+ alt: event.alt,
2760
+ href: event.href
2761
+ },
2762
+ `${event.image}|${event.alt}`
2763
+ )) }),
2764
+ events.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx(Indicators, { role: "tablist", "aria-label": "Event carousel position", children: events.map((event, index) => /* @__PURE__ */ jsxRuntime.jsx(
2765
+ Dot,
2766
+ {
2767
+ $active: index === activeIndex,
2768
+ "aria-hidden": "true"
2769
+ },
2770
+ `${event.image}|${event.alt}|dot`
2771
+ )) }) : null,
2772
+ /* @__PURE__ */ jsxRuntime.jsx(
2773
+ ArrowButton,
2774
+ {
2775
+ type: "button",
2776
+ $side: "left",
2777
+ onClick: scrollPrev,
2778
+ disabled: !canPrev,
2779
+ "aria-label": "Previous event",
2780
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft, {})
2781
+ }
2782
+ ),
2783
+ /* @__PURE__ */ jsxRuntime.jsx(
2784
+ ArrowButton,
2785
+ {
2786
+ type: "button",
2787
+ $side: "right",
2788
+ onClick: scrollNext,
2789
+ disabled: !canNext,
2790
+ "aria-label": "Next event",
2791
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight, {})
2792
+ }
2793
+ )
2794
+ ] });
2795
+ }
2796
+ );
2797
+ EventCarousel.displayName = "EventCarousel";
2798
+ var Section6 = styled30__default.default.section`
2799
+ display: flex;
2800
+ flex-direction: column;
2801
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
2802
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
2803
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
2804
+ `;
2805
+ var Heading4 = styled30__default.default.h2`
2806
+ margin: 0;
2807
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
2808
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2809
+ line-height: 1.2;
2810
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
2811
+ `;
2812
+ var Track2 = styled30__default.default.div`
2813
+ display: flex;
2814
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
2815
+ overflow-x: auto;
2816
+ scroll-snap-type: x proximity;
2817
+ scrollbar-width: none;
2818
+
2819
+ &::-webkit-scrollbar {
2820
+ display: none;
2821
+ }
2822
+ `;
2823
+ var ExploreSection = react.forwardRef(
2824
+ ({ heading, items, ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Section6, { ref, ...rest, children: [
2825
+ /* @__PURE__ */ jsxRuntime.jsx(Heading4, { children: heading }),
2826
+ /* @__PURE__ */ jsxRuntime.jsx(Track2, { children: items.map((item) => /* @__PURE__ */ jsxRuntime.jsx(
2827
+ ExploreCard,
2828
+ {
2829
+ image: item.image,
2830
+ alt: item.alt,
2831
+ label: item.label,
2832
+ href: item.href
2833
+ },
2834
+ item.label
2835
+ )) })
2836
+ ] })
2837
+ );
2838
+ ExploreSection.displayName = "ExploreSection";
2839
+ var Section7 = styled30__default.default.section`
2840
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
2841
+ `;
2842
+ var List = styled30__default.default.div`
2843
+ display: flex;
2844
+ flex-direction: column;
2845
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
2846
+ max-width: ${({ theme: theme2 }) => theme2.layout.contentWidth};
2847
+ margin: 0 auto;
2848
+ `;
2849
+ var FaqSection = ({
2850
+ heading,
2851
+ subheading,
2852
+ faqs,
2853
+ singleOpen = false,
2854
+ ...rest
2855
+ }) => {
2856
+ const [openIndex, setOpenIndex] = react.useState(null);
2857
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section7, { ...rest, children: [
2858
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
2859
+ /* @__PURE__ */ jsxRuntime.jsx(List, { children: faqs.map((faq, index) => {
2860
+ if (!singleOpen) {
2861
+ return /* @__PURE__ */ jsxRuntime.jsx(FaqExpandable, { ...faq }, faq.question);
2862
+ }
2863
+ return /* @__PURE__ */ jsxRuntime.jsx(
2864
+ FaqExpandable,
2865
+ {
2866
+ ...faq,
2867
+ expanded: openIndex === index,
2868
+ onToggle: (next) => setOpenIndex(next ? index : null)
2869
+ },
2870
+ faq.question
2871
+ );
2872
+ }) })
2873
+ ] });
2874
+ };
2875
+ FaqSection.displayName = "FaqSection";
2876
+ var Wrapper6 = styled30__default.default.footer`
2877
+ display: flex;
2878
+ flex-direction: column;
2879
+ align-items: center;
2880
+ `;
2881
+ var TopAccent = styled30__default.default.div`
2882
+ width: 100%;
2883
+ height: 8px;
2884
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
2885
+ border-top-left-radius: 200px;
2886
+ border-top-right-radius: 200px;
2887
+ `;
2888
+ var DarkArea = styled30__default.default.div`
2889
+ width: 100%;
2890
+ display: flex;
2891
+ flex-direction: column;
2892
+ align-items: center;
2893
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
2894
+ padding: 40px 0;
2895
+ background: #112023;
2896
+ color: #ffffff;
2897
+
2898
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2899
+ padding: 40px ${({ theme: theme2 }) => theme2.spacing.md};
2900
+ }
2901
+ `;
2902
+ var ColumnsRow = styled30__default.default.div`
2903
+ display: flex;
2904
+ flex-wrap: wrap;
2905
+ gap: 96px;
2906
+ width: 100%;
2907
+ max-width: 1106px;
2908
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.lg};
2909
+ align-items: flex-start;
2910
+ justify-content: center;
2911
+
2912
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2913
+ flex-direction: column;
2914
+ gap: 0;
2915
+ padding: 0;
2916
+ }
2917
+ `;
2918
+ var Column = styled30__default.default.div`
2919
+ display: flex;
2920
+ flex-direction: column;
2921
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
2922
+
2923
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2924
+ width: 100%;
2925
+ gap: 0;
2926
+ padding: ${({ theme: theme2 }) => theme2.spacing.md} 0;
2927
+ border-top: 1px solid rgba(255, 255, 255, 0.18);
2928
+
2929
+ &:last-of-type {
2930
+ border-bottom: 1px solid rgba(255, 255, 255, 0.18);
2931
+ }
2932
+ }
2933
+ `;
2934
+ var ColumnHeader = styled30__default.default.button`
2935
+ display: inline-flex;
2936
+ align-items: center;
2937
+ width: 100%;
2938
+ margin: 0;
2939
+ padding: 0;
2940
+ background: transparent;
2941
+ border: none;
2942
+ color: inherit;
2943
+ font-family: inherit;
2944
+ font-size: 14px;
2945
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
2946
+ line-height: 24px;
2947
+ text-align: left;
2948
+ cursor: default;
2949
+ pointer-events: none;
2950
+
2951
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2952
+ justify-content: space-between;
2953
+ cursor: pointer;
2954
+ pointer-events: auto;
2955
+ }
2956
+
2957
+ &:focus-visible {
2958
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
2959
+ outline-offset: 2px;
2960
+ }
2961
+ `;
2962
+ var ColumnHeading = styled30__default.default.span`
2963
+ display: inline-block;
2964
+ white-space: nowrap;
2965
+ `;
2966
+ var ColumnChevron = styled30__default.default.span`
2967
+ display: none;
2968
+
2969
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2970
+ display: inline-flex;
2971
+ transition: transform 0.2s ease;
2972
+ transform: rotate(${({ $open }) => $open ? "180deg" : "0deg"});
2973
+ }
2974
+ `;
2975
+ var ColumnLinks = styled30__default.default.ul`
2976
+ display: flex;
2977
+ flex-direction: column;
2978
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
2979
+ margin: 0;
2980
+ padding: 0;
2981
+ list-style: none;
2982
+
2983
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
2984
+ display: ${({ $open }) => $open ? "flex" : "none"};
2985
+ padding-top: ${({ theme: theme2 }) => theme2.spacing.md};
2986
+ }
2987
+ `;
2988
+ var ColumnLink = styled30__default.default.a`
2989
+ display: inline-block;
2990
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
2991
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
2992
+ line-height: 18px;
2993
+ color: inherit;
2994
+ text-decoration: none;
2995
+ white-space: nowrap;
2996
+
2997
+ &:hover {
2998
+ text-decoration: underline;
2999
+ }
3000
+
3001
+ &:focus-visible {
3002
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3003
+ outline-offset: 2px;
3004
+ }
3005
+ `;
3006
+ var Divider3 = styled30__default.default.span`
3007
+ display: block;
3008
+ width: 1106px;
3009
+ max-width: calc(100% - ${({ theme: theme2 }) => theme2.spacing.lg});
3010
+ height: 1px;
3011
+ background: rgba(255, 255, 255, 0.4);
3012
+
3013
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3014
+ max-width: 100%;
3015
+ }
3016
+ `;
3017
+ var Address2 = styled30__default.default.div`
3018
+ display: flex;
3019
+ flex-direction: column;
3020
+ align-items: center;
3021
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3022
+ text-align: center;
3023
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
3024
+
3025
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3026
+ padding: 0;
3027
+ width: 100%;
3028
+ }
3029
+ `;
3030
+ var CompanyName = styled30__default.default.p`
3031
+ margin: 0;
3032
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
3033
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
3034
+ line-height: 32px;
3035
+ `;
3036
+ var AddressLine = styled30__default.default.p`
3037
+ margin: 0;
3038
+ font-size: 14px;
3039
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3040
+ line-height: 24px;
3041
+ `;
3042
+ var CinLine = styled30__default.default.p`
3043
+ margin: 0;
3044
+ font-size: 14px;
3045
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3046
+ line-height: 24px;
3047
+ letter-spacing: 0.04em;
3048
+ `;
3049
+ var ContactRow = styled30__default.default.div`
3050
+ display: flex;
3051
+ flex-wrap: wrap;
3052
+ align-items: center;
3053
+ justify-content: center;
3054
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
3055
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
3056
+
3057
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3058
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
3059
+ padding: 0;
3060
+ width: 100%;
3061
+ }
3062
+ `;
3063
+ var ContactItem = styled30__default.default.a`
3064
+ display: inline-flex;
3065
+ align-items: center;
3066
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3067
+ color: inherit;
3068
+ text-decoration: none;
3069
+ font-size: 14px;
3070
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3071
+ line-height: 24px;
3072
+
3073
+ &:hover {
3074
+ text-decoration: underline;
3075
+ }
3076
+
3077
+ &:focus-visible {
3078
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3079
+ outline-offset: 2px;
3080
+ }
3081
+ `;
3082
+ var ContactIcon = styled30__default.default.span`
3083
+ display: inline-flex;
3084
+ align-items: center;
3085
+ justify-content: center;
3086
+ width: 24px;
3087
+ height: 24px;
3088
+
3089
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3090
+ display: none;
3091
+ }
3092
+ `;
3093
+ var SocialPill = styled30__default.default.div`
3094
+ display: inline-flex;
3095
+ align-items: center;
3096
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
3097
+ padding: 16px 32px;
3098
+ background: #212e30;
3099
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3100
+ `;
3101
+ var SocialLink2 = styled30__default.default.a`
3102
+ display: inline-flex;
3103
+ align-items: center;
3104
+ justify-content: center;
3105
+ width: 30px;
3106
+ height: 30px;
3107
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3108
+ color: inherit;
3109
+ text-decoration: none;
3110
+
3111
+ &:focus-visible {
3112
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3113
+ outline-offset: 2px;
3114
+ }
3115
+
3116
+ & > img,
3117
+ & > svg {
3118
+ width: 30px;
3119
+ height: 30px;
3120
+ object-fit: contain;
3121
+ }
3122
+ `;
3123
+ var FooterImage = styled30__default.default.img`
3124
+ display: block;
3125
+ width: 1104px;
3126
+ max-width: 100%;
3127
+ height: 70px;
3128
+ object-fit: cover;
3129
+
3130
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3131
+ width: 100%;
3132
+ height: auto;
3133
+ object-fit: contain;
3134
+ }
3135
+ `;
3136
+ var ScrollToTopButton = styled30__default.default.button`
3137
+ position: fixed;
3138
+ right: ${({ theme: theme2 }) => theme2.spacing.md};
3139
+ bottom: ${({ theme: theme2 }) => theme2.spacing.lg};
3140
+ display: inline-flex;
3141
+ align-items: center;
3142
+ justify-content: center;
3143
+ width: 36px;
3144
+ height: 36px;
3145
+ background: #ffffff;
3146
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
3147
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3148
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
3149
+ cursor: pointer;
3150
+ box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
3151
+ z-index: 50;
3152
+ transition: transform 0.15s ease;
3153
+
3154
+ &:hover {
3155
+ transform: translateY(-1px);
3156
+ }
3157
+
3158
+ &:focus-visible {
3159
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3160
+ outline-offset: 2px;
3161
+ }
3162
+ `;
3163
+ var Copyright = styled30__default.default.p`
3164
+ margin: 0;
3165
+ font-size: 14px;
3166
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3167
+ line-height: 24px;
3168
+ text-align: center;
3169
+ `;
3170
+ var GlobeSvg = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
3171
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "12", cy: "12", r: "9", stroke: "currentColor", strokeWidth: "1.6" }),
3172
+ /* @__PURE__ */ jsxRuntime.jsx(
3173
+ "path",
3174
+ {
3175
+ d: "M3 12h18M12 3a14 14 0 0 1 0 18M12 3a14 14 0 0 0 0 18",
3176
+ stroke: "currentColor",
3177
+ strokeWidth: "1.6"
3178
+ }
3179
+ )
3180
+ ] });
3181
+ var MailSvg2 = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: [
3182
+ /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "3", y: "5", width: "18", height: "14", rx: "2", stroke: "currentColor", strokeWidth: "1.6" }),
3183
+ /* @__PURE__ */ jsxRuntime.jsx("path", { d: "m3 7 9 6 9-6", stroke: "currentColor", strokeWidth: "1.6", strokeLinejoin: "round" })
3184
+ ] });
3185
+ var PhoneSvg = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3186
+ "path",
3187
+ {
3188
+ d: "M5 4h4l2 5-3 2a12 12 0 0 0 5 5l2-3 5 2v4a2 2 0 0 1-2 2A17 17 0 0 1 3 6a2 2 0 0 1 2-2Z",
3189
+ stroke: "currentColor",
3190
+ strokeWidth: "1.6",
3191
+ strokeLinejoin: "round"
3192
+ }
3193
+ ) });
3194
+ var ChevronDown = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3195
+ "path",
3196
+ {
3197
+ d: "M4 6l4 4 4-4",
3198
+ stroke: "currentColor",
3199
+ strokeWidth: "1.5",
3200
+ strokeLinecap: "round",
3201
+ strokeLinejoin: "round"
3202
+ }
3203
+ ) });
3204
+ var ChevronUp = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3205
+ "path",
3206
+ {
3207
+ d: "M4 10l4-4 4 4",
3208
+ stroke: "currentColor",
3209
+ strokeWidth: "1.5",
3210
+ strokeLinecap: "round",
3211
+ strokeLinejoin: "round"
3212
+ }
3213
+ ) });
3214
+ var scrollToTop = () => {
3215
+ if (typeof window === "undefined") return;
3216
+ window.scrollTo({ top: 0, behavior: "smooth" });
3217
+ };
3218
+ var Footer2 = react.forwardRef(
3219
+ ({
3220
+ columns,
3221
+ companyName,
3222
+ cin,
3223
+ address,
3224
+ contact,
3225
+ socials,
3226
+ footerImage,
3227
+ footerImageAlt = "",
3228
+ copyright,
3229
+ showScrollToTop = false,
3230
+ ...rest
3231
+ }, ref) => {
3232
+ const [openColumns, setOpenColumns] = react.useState({});
3233
+ const toggleColumn = (heading) => {
3234
+ setOpenColumns((prev) => ({ ...prev, [heading]: !prev[heading] }));
3235
+ };
3236
+ return /* @__PURE__ */ jsxRuntime.jsxs(Wrapper6, { ref, ...rest, children: [
3237
+ /* @__PURE__ */ jsxRuntime.jsx(TopAccent, { "aria-hidden": "true" }),
3238
+ /* @__PURE__ */ jsxRuntime.jsxs(DarkArea, { children: [
3239
+ /* @__PURE__ */ jsxRuntime.jsx(ColumnsRow, { children: columns.map((column) => {
3240
+ const isOpen = !!openColumns[column.heading];
3241
+ return /* @__PURE__ */ jsxRuntime.jsxs(Column, { children: [
3242
+ /* @__PURE__ */ jsxRuntime.jsxs(
3243
+ ColumnHeader,
3244
+ {
3245
+ type: "button",
3246
+ "aria-expanded": isOpen,
3247
+ onClick: () => toggleColumn(column.heading),
3248
+ children: [
3249
+ /* @__PURE__ */ jsxRuntime.jsx(ColumnHeading, { children: column.heading }),
3250
+ /* @__PURE__ */ jsxRuntime.jsx(ColumnChevron, { $open: isOpen, "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(ChevronDown, {}) })
3251
+ ]
3252
+ }
3253
+ ),
3254
+ /* @__PURE__ */ jsxRuntime.jsx(ColumnLinks, { $open: isOpen, children: column.links.map((link) => /* @__PURE__ */ jsxRuntime.jsx("li", { children: /* @__PURE__ */ jsxRuntime.jsx(ColumnLink, { href: link.href, children: link.label }) }, `${column.heading}|${link.label}`)) })
3255
+ ] }, column.heading);
3256
+ }) }),
3257
+ /* @__PURE__ */ jsxRuntime.jsx(Divider3, { "aria-hidden": "true" }),
3258
+ /* @__PURE__ */ jsxRuntime.jsxs(Address2, { children: [
3259
+ /* @__PURE__ */ jsxRuntime.jsx(CompanyName, { children: companyName }),
3260
+ cin ? /* @__PURE__ */ jsxRuntime.jsx(CinLine, { children: cin }) : null,
3261
+ /* @__PURE__ */ jsxRuntime.jsx(AddressLine, { children: address })
3262
+ ] }),
3263
+ contact ? /* @__PURE__ */ jsxRuntime.jsxs(ContactRow, { children: [
3264
+ contact.email ? /* @__PURE__ */ jsxRuntime.jsxs(ContactItem, { href: `mailto:${contact.email}`, children: [
3265
+ /* @__PURE__ */ jsxRuntime.jsx(ContactIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(MailSvg2, {}) }),
3266
+ contact.email
3267
+ ] }) : null,
3268
+ contact.phone ? /* @__PURE__ */ jsxRuntime.jsxs(ContactItem, { href: `tel:${contact.phone.replace(/\s+/g, "")}`, children: [
3269
+ /* @__PURE__ */ jsxRuntime.jsx(ContactIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(PhoneSvg, {}) }),
3270
+ contact.phone
3271
+ ] }) : null,
3272
+ contact.websiteUrl ? /* @__PURE__ */ jsxRuntime.jsxs(ContactItem, { href: contact.websiteUrl, target: "_blank", rel: "noopener noreferrer", children: [
3273
+ /* @__PURE__ */ jsxRuntime.jsx(ContactIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(GlobeSvg, {}) }),
3274
+ contact.websiteLabel ?? contact.websiteUrl
3275
+ ] }) : null
3276
+ ] }) : null,
3277
+ socials && socials.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(SocialPill, { children: socials.map((social) => /* @__PURE__ */ jsxRuntime.jsx(
3278
+ SocialLink2,
3279
+ {
3280
+ href: social.href,
3281
+ "aria-label": social.label,
3282
+ target: "_blank",
3283
+ rel: "noopener noreferrer",
3284
+ children: social.icon
3285
+ },
3286
+ social.label
3287
+ )) }) : null,
3288
+ footerImage ? /* @__PURE__ */ jsxRuntime.jsx(FooterImage, { src: footerImage, alt: footerImageAlt }) : null,
3289
+ /* @__PURE__ */ jsxRuntime.jsx(Divider3, { "aria-hidden": "true" }),
3290
+ /* @__PURE__ */ jsxRuntime.jsx(Copyright, { children: copyright })
3291
+ ] }),
3292
+ showScrollToTop ? /* @__PURE__ */ jsxRuntime.jsx(ScrollToTopButton, { type: "button", onClick: scrollToTop, "aria-label": "Scroll to top", children: /* @__PURE__ */ jsxRuntime.jsx(ChevronUp, {}) }) : null
3293
+ ] });
3294
+ }
3295
+ );
3296
+ Footer2.displayName = "Footer";
3297
+ var Section8 = styled30__default.default.section`
3298
+ position: relative;
3299
+ display: flex;
3300
+ flex-direction: column;
3301
+ align-items: center;
3302
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
3303
+ padding: 0 80px;
3304
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
3305
+
3306
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3307
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
3308
+ }
3309
+ `;
3310
+ var PhotosFrame = styled30__default.default.div`
3311
+ position: relative;
3312
+ width: 100%;
3313
+ `;
3314
+ var Track3 = styled30__default.default.div`
3315
+ display: flex;
3316
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3317
+ padding: 0 60px;
3318
+ overflow-x: auto;
3319
+ scroll-snap-type: x mandatory;
3320
+ scrollbar-width: none;
3321
+
3322
+ &::-webkit-scrollbar {
3323
+ display: none;
3324
+ }
3325
+
3326
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3327
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
3328
+ }
3329
+ `;
3330
+ var ArrowButton2 = styled30__default.default.button`
3331
+ position: absolute;
3332
+ top: 50%;
3333
+ ${({ $side }) => $side === "left" ? "left: 8px;" : "right: 8px;"}
3334
+ transform: translateY(-50%);
3335
+ display: inline-flex;
3336
+ align-items: center;
3337
+ justify-content: center;
3338
+ width: 32px;
3339
+ height: 32px;
3340
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
3341
+ border: none;
3342
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3343
+ color: #fbfbfb;
3344
+ cursor: pointer;
3345
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
3346
+ transition: opacity 0.15s ease;
3347
+ z-index: 1;
3348
+
3349
+ &:disabled {
3350
+ opacity: 0.4;
3351
+ cursor: not-allowed;
3352
+ }
3353
+
3354
+ &:focus-visible {
3355
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3356
+ outline-offset: 2px;
3357
+ }
3358
+
3359
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3360
+ display: none;
3361
+ }
3362
+ `;
3363
+ var ChevronLeft2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3364
+ "path",
3365
+ {
3366
+ d: "M10 12L6 8l4-4",
3367
+ stroke: "currentColor",
3368
+ strokeWidth: "1.5",
3369
+ strokeLinecap: "round",
3370
+ strokeLinejoin: "round"
3371
+ }
3372
+ ) });
3373
+ var ChevronRight2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3374
+ "path",
3375
+ {
3376
+ d: "M6 4l4 4-4 4",
3377
+ stroke: "currentColor",
3378
+ strokeWidth: "1.5",
3379
+ strokeLinecap: "round",
3380
+ strokeLinejoin: "round"
3381
+ }
3382
+ ) });
3383
+ var GallerySection = react.forwardRef(
3384
+ ({ heading, subheading, photos, ...rest }, ref) => {
3385
+ const { ref: trackRef, scrollPrev, scrollNext, canPrev, canNext } = useScrollSnap(photos.length);
3386
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section8, { ref, ...rest, children: [
3387
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading, align: "center" }),
3388
+ /* @__PURE__ */ jsxRuntime.jsxs(PhotosFrame, { children: [
3389
+ /* @__PURE__ */ jsxRuntime.jsx(
3390
+ ArrowButton2,
3391
+ {
3392
+ type: "button",
3393
+ $side: "left",
3394
+ onClick: scrollPrev,
3395
+ disabled: !canPrev,
3396
+ "aria-label": "Previous photos",
3397
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft2, {})
3398
+ }
3399
+ ),
3400
+ /* @__PURE__ */ jsxRuntime.jsx(Track3, { ref: trackRef, children: photos.map((photo) => /* @__PURE__ */ jsxRuntime.jsx(
3401
+ GalleryPhoto,
3402
+ {
3403
+ image: photo.image,
3404
+ alt: photo.alt,
3405
+ destination: photo.destination
3406
+ },
3407
+ `${photo.image}|${photo.alt}`
3408
+ )) }),
3409
+ /* @__PURE__ */ jsxRuntime.jsx(
3410
+ ArrowButton2,
3411
+ {
3412
+ type: "button",
3413
+ $side: "right",
3414
+ onClick: scrollNext,
3415
+ disabled: !canNext,
3416
+ "aria-label": "Next photos",
3417
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight2, {})
3418
+ }
3419
+ )
3420
+ ] })
3421
+ ] });
3422
+ }
3423
+ );
3424
+ GallerySection.displayName = "GallerySection";
3425
+ var Section9 = styled30__default.default.section`
3426
+ position: relative;
3427
+ display: flex;
3428
+ flex-direction: column;
3429
+ align-items: ${({ $variant }) => $variant === "centered" ? "center" : "flex-start"};
3430
+ justify-content: center;
3431
+ text-align: ${({ $variant }) => $variant === "centered" ? "center" : "left"};
3432
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
3433
+ min-height: 420px;
3434
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.xl} ${theme2.spacing.xl}`};
3435
+ color: #ffffff;
3436
+ background-color: ${({ $backgroundColor, theme: theme2 }) => $backgroundColor ?? theme2.colors.primary};
3437
+ background-image: ${({ $backgroundImage }) => $backgroundImage ? `url(${$backgroundImage})` : "none"};
3438
+ background-size: cover;
3439
+ background-position: center;
3440
+
3441
+ &::before {
3442
+ content: '';
3443
+ position: absolute;
3444
+ inset: 0;
3445
+ background: ${({ $backgroundImage }) => $backgroundImage ? "rgba(0, 0, 0, 0.45)" : "transparent"};
3446
+ pointer-events: none;
3447
+ }
3448
+
3449
+ & > * {
3450
+ position: relative;
3451
+ }
3452
+
3453
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3454
+ align-items: center;
3455
+ text-align: center;
3456
+ min-height: 360px;
3457
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.xl} ${theme2.spacing.md} 0`};
3458
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
3459
+ }
3460
+ `;
3461
+ var TopAccent2 = styled30__default.default.span`
3462
+ position: absolute;
3463
+ top: 0;
3464
+ left: 0;
3465
+ right: 0;
3466
+ height: 3px;
3467
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
3468
+ `;
3469
+ var TitleAccent = styled30__default.default.div`
3470
+ display: flex;
3471
+ align-items: stretch;
3472
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
3473
+
3474
+ &::before {
3475
+ content: '';
3476
+ width: 4px;
3477
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
3478
+ border-radius: ${({ theme: theme2 }) => theme2.radii.sm};
3479
+ }
3480
+
3481
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3482
+ justify-content: center;
3483
+ gap: 0;
3484
+
3485
+ &::before {
3486
+ display: none;
3487
+ }
3488
+ }
3489
+ `;
3490
+ var Title5 = styled30__default.default.h1`
3491
+ margin: 0;
3492
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes["2xl"]};
3493
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
3494
+ line-height: 1.2;
3495
+ max-width: 760px;
3496
+
3497
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3498
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
3499
+ }
3500
+ `;
3501
+ var Subtitle2 = styled30__default.default.p`
3502
+ margin: 0;
3503
+ max-width: 640px;
3504
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.lg};
3505
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3506
+ line-height: 1.5;
3507
+ opacity: 0.95;
3508
+ `;
3509
+ var SubtitlePill = styled30__default.default.p`
3510
+ display: inline-block;
3511
+ margin: 0;
3512
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.sm} ${theme2.spacing.md}`};
3513
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
3514
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
3515
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
3516
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
3517
+ line-height: 1.4;
3518
+
3519
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3520
+ background: transparent;
3521
+ color: ${({ theme: theme2 }) => theme2.colors.accent};
3522
+ padding: 0;
3523
+ align-self: center;
3524
+ }
3525
+ `;
3526
+ var ReviewsRow = styled30__default.default.div`
3527
+ display: flex;
3528
+ flex-wrap: wrap;
3529
+ align-items: center;
3530
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
3531
+ margin-top: auto;
3532
+ padding-top: ${({ theme: theme2 }) => theme2.spacing.xl};
3533
+
3534
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3535
+ width: calc(100% + 2 * ${({ theme: theme2 }) => theme2.spacing.md});
3536
+ margin: ${({ theme: theme2 }) => theme2.spacing.lg} -${({ theme: theme2 }) => theme2.spacing.md} 0;
3537
+ padding: ${({ theme: theme2 }) => theme2.spacing.md};
3538
+ background: #e8fbff;
3539
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
3540
+ justify-content: space-around;
3541
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3542
+ }
3543
+ `;
3544
+ var Wrapper7 = styled30__default.default.div`
3545
+ display: inline-flex;
3546
+ align-items: center;
3547
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3548
+ color: inherit;
3549
+ `;
3550
+ var Logo3 = styled30__default.default.img`
3551
+ width: 32px;
3552
+ height: 32px;
3553
+ object-fit: contain;
3554
+ `;
3555
+ var Meta = styled30__default.default.div`
3556
+ display: flex;
3557
+ flex-direction: column;
3558
+ line-height: 1.2;
3559
+ `;
3560
+ var RatingLine = styled30__default.default.span`
3561
+ display: inline-flex;
3562
+ align-items: center;
3563
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
3564
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
3565
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
3566
+ `;
3567
+ var Star = styled30__default.default.span`
3568
+ color: ${({ theme: theme2 }) => theme2.colors.accent};
3569
+ `;
3570
+ var ReviewCount = styled30__default.default.span`
3571
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
3572
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.regular};
3573
+ opacity: 0.9;
3574
+ `;
3575
+ var RatingBadge = ({ logo, alt, rating, reviewCount }) => /* @__PURE__ */ jsxRuntime.jsxs(Wrapper7, { children: [
3576
+ /* @__PURE__ */ jsxRuntime.jsx(Logo3, { src: logo, alt }),
3577
+ /* @__PURE__ */ jsxRuntime.jsxs(Meta, { children: [
3578
+ /* @__PURE__ */ jsxRuntime.jsxs(RatingLine, { children: [
3579
+ /* @__PURE__ */ jsxRuntime.jsx(Star, { "aria-hidden": "true", children: "\u2605" }),
3580
+ rating.toFixed(1)
3581
+ ] }),
3582
+ /* @__PURE__ */ jsxRuntime.jsxs(ReviewCount, { children: [
3583
+ "(",
3584
+ reviewCount.toLocaleString("en-US"),
3585
+ " reviews)"
3586
+ ] })
3587
+ ] })
3588
+ ] });
3589
+ var Hero = react.forwardRef((props, ref) => {
3590
+ const variant = props.variant ?? "centered";
3591
+ if (variant === "reviews") {
3592
+ const reviewProps = props;
3593
+ const {
3594
+ title: title2,
3595
+ subtitle: subtitle2,
3596
+ backgroundImage: backgroundImage2,
3597
+ backgroundColor: backgroundColor2,
3598
+ reviews,
3599
+ variant: _variant2,
3600
+ ...rest2
3601
+ } = reviewProps;
3602
+ return /* @__PURE__ */ jsxRuntime.jsxs(
3603
+ Section9,
3604
+ {
3605
+ ref,
3606
+ $backgroundImage: backgroundImage2,
3607
+ $backgroundColor: backgroundColor2,
3608
+ $variant: "reviews",
3609
+ ...rest2,
3610
+ children: [
3611
+ /* @__PURE__ */ jsxRuntime.jsx(TopAccent2, { "aria-hidden": "true" }),
3612
+ /* @__PURE__ */ jsxRuntime.jsx(TitleAccent, { children: /* @__PURE__ */ jsxRuntime.jsx(Title5, { children: title2 }) }),
3613
+ subtitle2 ? /* @__PURE__ */ jsxRuntime.jsx(SubtitlePill, { children: subtitle2 }) : null,
3614
+ reviews.length > 0 ? /* @__PURE__ */ jsxRuntime.jsx(ReviewsRow, { children: reviews.map((review) => /* @__PURE__ */ jsxRuntime.jsx(RatingBadge, { ...review }, `${review.alt}-${review.rating}`)) }) : null
3615
+ ]
3616
+ }
3617
+ );
3618
+ }
3619
+ const centeredProps = props;
3620
+ const {
3621
+ title,
3622
+ subtitle,
3623
+ backgroundImage,
3624
+ backgroundColor,
3625
+ variant: _variant,
3626
+ ...rest
3627
+ } = centeredProps;
3628
+ return /* @__PURE__ */ jsxRuntime.jsxs(
3629
+ Section9,
3630
+ {
3631
+ ref,
3632
+ $backgroundImage: backgroundImage,
3633
+ $backgroundColor: backgroundColor,
3634
+ $variant: "centered",
3635
+ ...rest,
3636
+ children: [
3637
+ /* @__PURE__ */ jsxRuntime.jsx(Title5, { children: title }),
3638
+ subtitle ? /* @__PURE__ */ jsxRuntime.jsx(Subtitle2, { children: subtitle }) : null
3639
+ ]
3640
+ }
3641
+ );
3642
+ });
3643
+ Hero.displayName = "Hero";
3644
+ var Bar3 = styled30__default.default.header`
3645
+ position: sticky;
3646
+ top: 0;
3647
+ z-index: 99;
3648
+ display: flex;
3649
+ align-items: center;
3650
+ justify-content: space-between;
3651
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
3652
+ width: 100%;
3653
+ height: 64px;
3654
+ padding: ${({ theme: theme2 }) => `${theme2.spacing.sm} 48px`};
3655
+ background: ${({ theme: theme2 }) => theme2.colors.background};
3656
+
3657
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3658
+ display: none;
3659
+ }
3660
+ `;
3661
+ var LeftGroup = styled30__default.default.div`
3662
+ display: flex;
3663
+ align-items: center;
3664
+ gap: 64px;
3665
+ `;
3666
+ var RightGroup = styled30__default.default.div`
3667
+ display: flex;
3668
+ align-items: center;
3669
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
3670
+ `;
3671
+ var LogoLink = styled30__default.default.a`
3672
+ display: inline-flex;
3673
+ align-items: center;
3674
+ text-decoration: none;
3675
+ `;
3676
+ var LogoSlot = styled30__default.default.span`
3677
+ display: inline-flex;
3678
+ align-items: center;
3679
+ justify-content: center;
3680
+ width: 60px;
3681
+ height: 60px;
3682
+ flex-shrink: 0;
3683
+
3684
+ & > img,
3685
+ & > svg {
3686
+ width: 100%;
3687
+ height: 100%;
3688
+ object-fit: contain;
3689
+ }
3690
+ `;
3691
+ var SearchLink = styled30__default.default.a`
3692
+ display: inline-flex;
3693
+ text-decoration: none;
3694
+ flex-shrink: 0;
3695
+ `;
3696
+ var SearchInput = styled30__default.default.span`
3697
+ display: inline-flex;
3698
+ align-items: center;
3699
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3700
+ width: 302px;
3701
+ height: 38px;
3702
+ padding: 0 12px 0 24px;
3703
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
3704
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.primary};
3705
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3706
+ color: #707070;
3707
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
3708
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.light};
3709
+ line-height: 24px;
3710
+ `;
3711
+ var SearchPlaceholder = styled30__default.default.span`
3712
+ flex: 1 1 auto;
3713
+ min-width: 0;
3714
+ `;
3715
+ var SearchIcon = styled30__default.default.span`
3716
+ display: inline-flex;
3717
+ align-items: center;
3718
+ justify-content: center;
3719
+ width: 20px;
3720
+ height: 20px;
3721
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
3722
+ flex-shrink: 0;
3723
+ `;
3724
+ var NavList = styled30__default.default.ul`
3725
+ display: flex;
3726
+ align-items: center;
3727
+ gap: 24px;
3728
+ margin: 0;
3729
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.sm};
3730
+ list-style: none;
3731
+ `;
3732
+ var NavItem = styled30__default.default.li`
3733
+ display: inline-flex;
3734
+ align-items: center;
3735
+ `;
3736
+ var NavLinkText = styled30__default.default.a`
3737
+ position: relative;
3738
+ display: inline-flex;
3739
+ align-items: center;
3740
+ gap: ${({ theme: theme2 }) => theme2.spacing.xs};
3741
+ color: #2d2d2d;
3742
+ text-decoration: none;
3743
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
3744
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
3745
+ line-height: 20px;
3746
+ white-space: nowrap;
3747
+
3748
+ &::after {
3749
+ content: '';
3750
+ position: absolute;
3751
+ left: 0;
3752
+ bottom: -4px;
3753
+ width: 100%;
3754
+ height: 2px;
3755
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
3756
+ transform: scaleX(0);
3757
+ transform-origin: left;
3758
+ transition: transform 0.2s ease;
3759
+ }
3760
+
3761
+ &:hover::after,
3762
+ &:focus-visible::after {
3763
+ transform: scaleX(1);
3764
+ }
3765
+ `;
3766
+ var BadgeIcon = styled30__default.default.span`
3767
+ display: inline-flex;
3768
+ align-items: center;
3769
+ justify-content: center;
3770
+ width: 16px;
3771
+ height: 16px;
3772
+ `;
3773
+ var PhoneButton = styled30__default.default.a`
3774
+ display: inline-flex;
3775
+ align-items: center;
3776
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3777
+ padding: ${({ theme: theme2 }) => theme2.spacing.sm} 20px;
3778
+ background: transparent;
3779
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.primary};
3780
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3781
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
3782
+ text-decoration: none;
3783
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
3784
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.sm};
3785
+ line-height: 20px;
3786
+ white-space: nowrap;
3787
+ transition: background 0.15s ease, color 0.15s ease;
3788
+
3789
+ &:hover {
3790
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
3791
+ color: #ffffff;
3792
+ }
3793
+ `;
3794
+ var PhoneIconDefault = styled30__default.default.span`
3795
+ display: inline-flex;
3796
+ align-items: center;
3797
+ justify-content: center;
3798
+ width: 16px;
3799
+ height: 16px;
3800
+ flex-shrink: 0;
3801
+ `;
3802
+ var SearchSvg2 = () => /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: [
3803
+ /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "9", cy: "9", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
3804
+ /* @__PURE__ */ jsxRuntime.jsx(
3805
+ "line",
3806
+ {
3807
+ x1: "13.5",
3808
+ y1: "13.5",
3809
+ x2: "17.5",
3810
+ y2: "17.5",
3811
+ stroke: "currentColor",
3812
+ strokeWidth: "1.5",
3813
+ strokeLinecap: "round"
3814
+ }
3815
+ )
3816
+ ] });
3817
+ var PhoneSvg2 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3818
+ "path",
3819
+ {
3820
+ d: "M14 11.32v2a1.33 1.33 0 0 1-1.45 1.33 13.2 13.2 0 0 1-5.76-2.05 13 13 0 0 1-4-4 13.2 13.2 0 0 1-2.05-5.79 1.33 1.33 0 0 1 1.32-1.45h2a1.33 1.33 0 0 1 1.33 1.15c.08.64.23 1.27.45 1.87a1.33 1.33 0 0 1-.3 1.4l-.85.85a10.67 10.67 0 0 0 4 4l.85-.85a1.33 1.33 0 0 1 1.4-.3c.6.22 1.23.37 1.87.45A1.33 1.33 0 0 1 14 11.32Z",
3821
+ stroke: "currentColor",
3822
+ strokeWidth: "1.4",
3823
+ strokeLinecap: "round",
3824
+ strokeLinejoin: "round"
3825
+ }
3826
+ ) });
3827
+ var Navbar = react.forwardRef(
3828
+ ({
3829
+ logo,
3830
+ logoHref = "/",
3831
+ links,
3832
+ searchPlaceholder = "Where do you want to go?",
3833
+ searchHref = "/search",
3834
+ phoneNumber,
3835
+ phoneIcon,
3836
+ LinkComponent,
3837
+ ...rest
3838
+ }, ref) => {
3839
+ const Link = LinkComponent ?? "a";
3840
+ return /* @__PURE__ */ jsxRuntime.jsxs(Bar3, { ref, ...rest, children: [
3841
+ /* @__PURE__ */ jsxRuntime.jsxs(LeftGroup, { children: [
3842
+ /* @__PURE__ */ jsxRuntime.jsx(LogoLink, { as: Link, href: logoHref, "aria-label": "Home", children: /* @__PURE__ */ jsxRuntime.jsx(LogoSlot, { children: typeof logo === "string" ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logo, alt: "" }) : logo }) }),
3843
+ /* @__PURE__ */ jsxRuntime.jsx(SearchLink, { as: Link, href: searchHref, children: /* @__PURE__ */ jsxRuntime.jsxs(SearchInput, { children: [
3844
+ /* @__PURE__ */ jsxRuntime.jsx(SearchPlaceholder, { children: searchPlaceholder }),
3845
+ /* @__PURE__ */ jsxRuntime.jsx(SearchIcon, { children: /* @__PURE__ */ jsxRuntime.jsx(SearchSvg2, {}) })
3846
+ ] }) })
3847
+ ] }),
3848
+ /* @__PURE__ */ jsxRuntime.jsxs(RightGroup, { children: [
3849
+ /* @__PURE__ */ jsxRuntime.jsx("nav", { "aria-label": "Primary", children: /* @__PURE__ */ jsxRuntime.jsx(NavList, { children: links.map((link) => /* @__PURE__ */ jsxRuntime.jsx(NavItem, { children: /* @__PURE__ */ jsxRuntime.jsxs(NavLinkText, { as: Link, href: link.href, children: [
3850
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: link.label }),
3851
+ link.badgeIcon ? /* @__PURE__ */ jsxRuntime.jsx(BadgeIcon, { "aria-hidden": "true", children: link.badgeIcon }) : null
3852
+ ] }) }, link.href)) }) }),
3853
+ phoneNumber ? /* @__PURE__ */ jsxRuntime.jsxs(PhoneButton, { href: `tel:${phoneNumber.replace(/\s+/g, "")}`, children: [
3854
+ phoneIcon ?? /* @__PURE__ */ jsxRuntime.jsx(PhoneIconDefault, { "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(PhoneSvg2, {}) }),
3855
+ /* @__PURE__ */ jsxRuntime.jsx("span", { children: phoneNumber })
3856
+ ] }) : null
3857
+ ] })
3858
+ ] });
3859
+ }
3860
+ );
3861
+ Navbar.displayName = "Navbar";
3862
+ var Section10 = styled30__default.default.section`
3863
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
3864
+ `;
3865
+ var Row3 = styled30__default.default.div`
3866
+ display: flex;
3867
+ flex-wrap: wrap;
3868
+ gap: ${({ theme: theme2 }) => theme2.layout.gridGap};
3869
+
3870
+ & > * {
3871
+ flex: 1 1 280px;
3872
+ }
3873
+ `;
3874
+ var OfficesSection = ({
3875
+ heading,
3876
+ subheading,
3877
+ locations,
3878
+ ...rest
3879
+ }) => {
3880
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section10, { ...rest, children: [
3881
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
3882
+ /* @__PURE__ */ jsxRuntime.jsx(Row3, { children: locations.map((office) => /* @__PURE__ */ jsxRuntime.jsx(LocationCard, { ...office }, office.location)) })
3883
+ ] });
3884
+ };
3885
+ OfficesSection.displayName = "OfficesSection";
3886
+ var Section11 = styled30__default.default.section`
3887
+ display: flex;
3888
+ flex-direction: column;
3889
+ align-items: center;
3890
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
3891
+ padding: 0 80px;
3892
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
3893
+
3894
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3895
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
3896
+ }
3897
+ `;
3898
+ var Inner2 = styled30__default.default.div`
3899
+ display: flex;
3900
+ flex-direction: column;
3901
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
3902
+ width: 100%;
3903
+ `;
3904
+ var Header3 = styled30__default.default.div`
3905
+ display: flex;
3906
+ align-items: center;
3907
+ justify-content: space-between;
3908
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
3909
+ `;
3910
+ var Heading5 = styled30__default.default.h2`
3911
+ margin: 0;
3912
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
3913
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
3914
+ line-height: 20px;
3915
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
3916
+ `;
3917
+ var ViewAllLink = styled30__default.default.a`
3918
+ display: inline-flex;
3919
+ align-items: center;
3920
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3921
+ color: #0b3741;
3922
+ text-decoration: none;
3923
+ font-size: 12px;
3924
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
3925
+ line-height: 20px;
3926
+
3927
+ &:hover {
3928
+ text-decoration: underline;
3929
+ }
3930
+
3931
+ &:focus-visible {
3932
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3933
+ outline-offset: 2px;
3934
+ }
3935
+ `;
3936
+ var CarouselArea = styled30__default.default.div`
3937
+ position: relative;
3938
+ width: 100%;
3939
+ `;
3940
+ var Track4 = styled30__default.default.div`
3941
+ display: flex;
3942
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
3943
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.lg};
3944
+ overflow-x: auto;
3945
+ scroll-snap-type: x mandatory;
3946
+ scrollbar-width: none;
3947
+
3948
+ &::-webkit-scrollbar {
3949
+ display: none;
3950
+ }
3951
+ `;
3952
+ var ArrowButton3 = styled30__default.default.button`
3953
+ position: absolute;
3954
+ top: 50%;
3955
+ ${({ $side }) => $side === "left" ? "left: -8px;" : "right: -8px;"}
3956
+ transform: translateY(-50%);
3957
+ display: inline-flex;
3958
+ align-items: center;
3959
+ justify-content: center;
3960
+ width: 32px;
3961
+ height: 32px;
3962
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
3963
+ border: none;
3964
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
3965
+ color: #fbfbfb;
3966
+ cursor: pointer;
3967
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
3968
+ transition: opacity 0.15s ease;
3969
+ z-index: 1;
3970
+
3971
+ &:disabled {
3972
+ opacity: 0.4;
3973
+ cursor: not-allowed;
3974
+ }
3975
+
3976
+ &:focus-visible {
3977
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
3978
+ outline-offset: 2px;
3979
+ }
3980
+
3981
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
3982
+ display: none;
3983
+ }
3984
+ `;
3985
+ var ChevronLeft3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3986
+ "path",
3987
+ {
3988
+ d: "M10 12L6 8l4-4",
3989
+ stroke: "currentColor",
3990
+ strokeWidth: "1.5",
3991
+ strokeLinecap: "round",
3992
+ strokeLinejoin: "round"
3993
+ }
3994
+ ) });
3995
+ var ChevronRight3 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
3996
+ "path",
3997
+ {
3998
+ d: "M6 4l4 4-4 4",
3999
+ stroke: "currentColor",
4000
+ strokeWidth: "1.5",
4001
+ strokeLinecap: "round",
4002
+ strokeLinejoin: "round"
4003
+ }
4004
+ ) });
4005
+ var ArrowRight = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "14", height: "14", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
4006
+ "path",
4007
+ {
4008
+ d: "M3 8h10M9 4l4 4-4 4",
4009
+ stroke: "currentColor",
4010
+ strokeWidth: "1.5",
4011
+ strokeLinecap: "round",
4012
+ strokeLinejoin: "round"
4013
+ }
4014
+ ) });
4015
+ var PackagesCarousel = react.forwardRef(
4016
+ ({
4017
+ heading,
4018
+ viewAllHref,
4019
+ viewAllLabel = "View All",
4020
+ months,
4021
+ activeMonthId,
4022
+ onMonthChange,
4023
+ packages,
4024
+ ...rest
4025
+ }, ref) => {
4026
+ const {
4027
+ ref: trackRef,
4028
+ scrollPrev,
4029
+ scrollNext,
4030
+ canPrev,
4031
+ canNext
4032
+ } = useScrollSnap(packages.length);
4033
+ return /* @__PURE__ */ jsxRuntime.jsx(Section11, { ref, ...rest, children: /* @__PURE__ */ jsxRuntime.jsxs(Inner2, { children: [
4034
+ /* @__PURE__ */ jsxRuntime.jsxs(Header3, { children: [
4035
+ /* @__PURE__ */ jsxRuntime.jsx(Heading5, { children: heading }),
4036
+ viewAllHref ? /* @__PURE__ */ jsxRuntime.jsxs(ViewAllLink, { href: viewAllHref, children: [
4037
+ viewAllLabel,
4038
+ /* @__PURE__ */ jsxRuntime.jsx(ArrowRight, {})
4039
+ ] }) : null
4040
+ ] }),
4041
+ /* @__PURE__ */ jsxRuntime.jsx(MonthTabs, { months, activeMonthId, onMonthChange }),
4042
+ /* @__PURE__ */ jsxRuntime.jsxs(CarouselArea, { children: [
4043
+ /* @__PURE__ */ jsxRuntime.jsx(
4044
+ ArrowButton3,
4045
+ {
4046
+ type: "button",
4047
+ $side: "left",
4048
+ onClick: scrollPrev,
4049
+ disabled: !canPrev,
4050
+ "aria-label": "Previous packages",
4051
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft3, {})
4052
+ }
4053
+ ),
4054
+ /* @__PURE__ */ jsxRuntime.jsx(Track4, { ref: trackRef, children: packages.map((pkg) => /* @__PURE__ */ jsxRuntime.jsx(
4055
+ PackageCard,
4056
+ {
4057
+ image: pkg.image,
4058
+ alt: pkg.alt,
4059
+ title: pkg.title,
4060
+ currentPrice: pkg.currentPrice,
4061
+ originalPrice: pkg.originalPrice,
4062
+ priceSuffix: pkg.priceSuffix,
4063
+ duration: pkg.duration,
4064
+ location: pkg.location,
4065
+ date: pkg.date,
4066
+ href: pkg.href
4067
+ },
4068
+ `${pkg.image}|${pkg.title}|${pkg.date}`
4069
+ )) }),
4070
+ /* @__PURE__ */ jsxRuntime.jsx(
4071
+ ArrowButton3,
4072
+ {
4073
+ type: "button",
4074
+ $side: "right",
4075
+ onClick: scrollNext,
4076
+ disabled: !canNext,
4077
+ "aria-label": "Next packages",
4078
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight3, {})
4079
+ }
4080
+ )
4081
+ ] })
4082
+ ] }) });
4083
+ }
4084
+ );
4085
+ PackagesCarousel.displayName = "PackagesCarousel";
4086
+ var Section12 = styled30__default.default.section`
4087
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
4088
+ `;
4089
+ var Grid = styled30__default.default.div`
4090
+ display: grid;
4091
+ grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
4092
+ gap: ${({ theme: theme2 }) => theme2.layout.gridGap};
4093
+
4094
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4095
+ display: flex;
4096
+ flex-wrap: nowrap;
4097
+ overflow-x: auto;
4098
+ scroll-snap-type: x proximity;
4099
+ scrollbar-width: none;
4100
+ -ms-overflow-style: none;
4101
+
4102
+ &::-webkit-scrollbar {
4103
+ display: none;
4104
+ }
4105
+ }
4106
+ `;
4107
+ var TeamSection = ({ heading, subheading, members, ...rest }) => {
4108
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section12, { ...rest, children: [
4109
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
4110
+ /* @__PURE__ */ jsxRuntime.jsx(Grid, { children: members.map((member) => /* @__PURE__ */ jsxRuntime.jsx(TeamInfoCard, { ...member }, `${member.name}-${member.designation}`)) })
4111
+ ] });
4112
+ };
4113
+ TeamSection.displayName = "TeamSection";
4114
+ var Section13 = styled30__default.default.section`
4115
+ display: flex;
4116
+ flex-direction: column;
4117
+ align-items: center;
4118
+ gap: 28px;
4119
+ padding: 0 80px;
4120
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
4121
+
4122
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4123
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
4124
+ }
4125
+ `;
4126
+ var Controls = styled30__default.default.div`
4127
+ display: flex;
4128
+ align-items: center;
4129
+ justify-content: center;
4130
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
4131
+ `;
4132
+ var ControlArrow = styled30__default.default.button`
4133
+ display: inline-flex;
4134
+ align-items: center;
4135
+ justify-content: center;
4136
+ width: 36px;
4137
+ height: 36px;
4138
+ padding: 0;
4139
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
4140
+ border: none;
4141
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
4142
+ color: #fbfbfb;
4143
+ cursor: pointer;
4144
+ transition: opacity 0.15s ease;
4145
+
4146
+ &:disabled {
4147
+ opacity: 0.4;
4148
+ cursor: not-allowed;
4149
+ }
4150
+
4151
+ &:focus-visible {
4152
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
4153
+ outline-offset: 2px;
4154
+ }
4155
+ `;
4156
+ var Indicators2 = styled30__default.default.div`
4157
+ display: flex;
4158
+ align-items: center;
4159
+ justify-content: center;
4160
+ gap: 12px;
4161
+ `;
4162
+ var Dot2 = styled30__default.default.button`
4163
+ display: inline-block;
4164
+ width: ${({ $active }) => $active ? "20px" : "5px"};
4165
+ height: 6px;
4166
+ padding: 0;
4167
+ border: none;
4168
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
4169
+ background: ${({ $active, theme: theme2 }) => $active ? theme2.colors.primary : theme2.colors.border};
4170
+ cursor: pointer;
4171
+ transition: width 0.2s ease, background 0.2s ease;
4172
+
4173
+ &:focus-visible {
4174
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
4175
+ outline-offset: 2px;
4176
+ }
4177
+ `;
4178
+ var ChevronLeft4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
4179
+ "path",
4180
+ {
4181
+ d: "M12 15l-5-5 5-5",
4182
+ stroke: "currentColor",
4183
+ strokeWidth: "2",
4184
+ strokeLinecap: "round",
4185
+ strokeLinejoin: "round"
4186
+ }
4187
+ ) });
4188
+ var ChevronRight4 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 20 20", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
4189
+ "path",
4190
+ {
4191
+ d: "M8 5l5 5-5 5",
4192
+ stroke: "currentColor",
4193
+ strokeWidth: "2",
4194
+ strokeLinecap: "round",
4195
+ strokeLinejoin: "round"
4196
+ }
4197
+ ) });
4198
+ var TestimonialsCarousel = react.forwardRef(
4199
+ ({ testimonials, defaultIndex = 0, activeIndex, onActiveIndexChange, ...rest }, ref) => {
4200
+ const isControlled = activeIndex !== void 0;
4201
+ const [internalIndex, setInternalIndex] = react.useState(defaultIndex);
4202
+ const currentIndex = isControlled ? activeIndex : internalIndex;
4203
+ const setIndex = (next) => {
4204
+ if (!isControlled) setInternalIndex(next);
4205
+ onActiveIndexChange?.(next);
4206
+ };
4207
+ const current = testimonials[currentIndex];
4208
+ if (!current) return null;
4209
+ const isFirst = currentIndex <= 0;
4210
+ const isLast = currentIndex >= testimonials.length - 1;
4211
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section13, { ref, ...rest, children: [
4212
+ /* @__PURE__ */ jsxRuntime.jsx(
4213
+ TestimonialCard,
4214
+ {
4215
+ thumbnail: current.thumbnail,
4216
+ thumbnailAlt: current.thumbnailAlt,
4217
+ logo: current.logo,
4218
+ logoAlt: current.logoAlt,
4219
+ caption: current.caption,
4220
+ videoHref: current.videoHref
4221
+ }
4222
+ ),
4223
+ testimonials.length > 1 ? /* @__PURE__ */ jsxRuntime.jsxs(Controls, { children: [
4224
+ /* @__PURE__ */ jsxRuntime.jsx(
4225
+ ControlArrow,
4226
+ {
4227
+ type: "button",
4228
+ onClick: () => setIndex(currentIndex - 1),
4229
+ disabled: isFirst,
4230
+ "aria-label": "Previous testimonial",
4231
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft4, {})
4232
+ }
4233
+ ),
4234
+ /* @__PURE__ */ jsxRuntime.jsx(Indicators2, { role: "tablist", "aria-label": "Testimonial slide", children: testimonials.map((testimonial, index) => /* @__PURE__ */ jsxRuntime.jsx(
4235
+ Dot2,
4236
+ {
4237
+ type: "button",
4238
+ role: "tab",
4239
+ "aria-selected": index === currentIndex,
4240
+ "aria-label": `Go to testimonial ${index + 1}`,
4241
+ $active: index === currentIndex,
4242
+ onClick: () => setIndex(index)
4243
+ },
4244
+ `${testimonial.thumbnail}|${testimonial.caption}`
4245
+ )) }),
4246
+ /* @__PURE__ */ jsxRuntime.jsx(
4247
+ ControlArrow,
4248
+ {
4249
+ type: "button",
4250
+ onClick: () => setIndex(currentIndex + 1),
4251
+ disabled: isLast,
4252
+ "aria-label": "Next testimonial",
4253
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight4, {})
4254
+ }
4255
+ )
4256
+ ] }) : null
4257
+ ] });
4258
+ }
4259
+ );
4260
+ TestimonialsCarousel.displayName = "TestimonialsCarousel";
4261
+ var Section14 = styled30__default.default.section`
4262
+ display: flex;
4263
+ flex-direction: column;
4264
+ align-items: ${({ $align }) => $align === "center" ? "center" : "flex-start"};
4265
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
4266
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
4267
+ text-align: ${({ $align }) => $align};
4268
+ `;
4269
+ var Heading6 = styled30__default.default.h2`
4270
+ margin: 0;
4271
+ ${({ theme: theme2 }) => theme2.typography.sectionHeading}
4272
+ `;
4273
+ var Paragraphs = styled30__default.default.div`
4274
+ display: flex;
4275
+ flex-direction: column;
4276
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
4277
+ max-width: ${({ theme: theme2 }) => theme2.layout.contentWidth};
4278
+ `;
4279
+ var Paragraph = styled30__default.default.p`
4280
+ margin: 0;
4281
+ ${({ theme: theme2 }) => theme2.typography.cardBody}
4282
+ `;
4283
+ var TextSection = react.forwardRef(
4284
+ ({ heading, paragraphs, align = "left", ...rest }, ref) => /* @__PURE__ */ jsxRuntime.jsxs(Section14, { ref, $align: align, ...rest, children: [
4285
+ /* @__PURE__ */ jsxRuntime.jsx(Heading6, { children: heading }),
4286
+ /* @__PURE__ */ jsxRuntime.jsx(Paragraphs, { children: paragraphs.map((paragraph) => /* @__PURE__ */ jsxRuntime.jsx(Paragraph, { children: paragraph }, paragraph)) })
4287
+ ] })
4288
+ );
4289
+ TextSection.displayName = "TextSection";
4290
+ var Section15 = styled30__default.default.section`
4291
+ position: relative;
4292
+ display: flex;
4293
+ flex-direction: column;
4294
+ padding: 0 80px;
4295
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
4296
+
4297
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4298
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
4299
+ }
4300
+ `;
4301
+ var Banner2 = styled30__default.default.div`
4302
+ position: relative;
4303
+ height: 318px;
4304
+ border-radius: ${({ theme: theme2 }) => theme2.radii.lg};
4305
+ overflow: hidden;
4306
+
4307
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4308
+ height: 260px;
4309
+ }
4310
+ `;
4311
+ var BannerMedia = styled30__default.default.div`
4312
+ position: absolute;
4313
+ inset: 0;
4314
+
4315
+ & > img,
4316
+ & > video {
4317
+ width: 100%;
4318
+ height: 100%;
4319
+ object-fit: cover;
4320
+ }
4321
+ `;
4322
+ var BannerContent = styled30__default.default.div`
4323
+ position: absolute;
4324
+ inset: 0;
4325
+ display: flex;
4326
+ flex-direction: column;
4327
+ justify-content: center;
4328
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
4329
+ padding: 44px;
4330
+ color: #f2f2f2;
4331
+ text-shadow: 0px 6px 24px rgba(0, 0, 0, 0.16);
4332
+ `;
4333
+ var BannerTitle = styled30__default.default.h2`
4334
+ margin: 0;
4335
+ font-size: 32px;
4336
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
4337
+ line-height: 40px;
4338
+ letter-spacing: 0.08px;
4339
+ max-width: 436px;
4340
+ `;
4341
+ var BannerDescription = styled30__default.default.p`
4342
+ margin: 0;
4343
+ font-size: 12px;
4344
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.bold};
4345
+ line-height: 20px;
4346
+ `;
4347
+ var BannerButton = styled30__default.default.button`
4348
+ display: inline-flex;
4349
+ align-items: center;
4350
+ justify-content: center;
4351
+ align-self: flex-start;
4352
+ height: 44px;
4353
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.xl};
4354
+ background: ${({ theme: theme2 }) => theme2.colors.accent};
4355
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
4356
+ border: none;
4357
+ border-radius: ${({ theme: theme2 }) => theme2.radii.md};
4358
+ font-family: inherit;
4359
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.md};
4360
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.medium};
4361
+ line-height: 18px;
4362
+ cursor: pointer;
4363
+ box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.14);
4364
+ transition: background 0.15s ease;
4365
+
4366
+ &:hover {
4367
+ background: ${({ theme: theme2 }) => polished.darken(0.05, theme2.colors.accent)};
4368
+ }
4369
+
4370
+ &:focus-visible {
4371
+ outline: 2px solid #ffffff;
4372
+ outline-offset: 2px;
4373
+ }
4374
+ `;
4375
+ var CardsArea = styled30__default.default.div`
4376
+ position: relative;
4377
+ margin-top: -68px;
4378
+ padding: ${({ theme: theme2 }) => theme2.spacing.sm} 25px 0;
4379
+ `;
4380
+ var Track5 = styled30__default.default.div`
4381
+ display: flex;
4382
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
4383
+ overflow-x: auto;
4384
+ scroll-snap-type: x mandatory;
4385
+ scrollbar-width: none;
4386
+
4387
+ &::-webkit-scrollbar {
4388
+ display: none;
4389
+ }
4390
+ `;
4391
+ var ProgressBar = styled30__default.default.div`
4392
+ position: relative;
4393
+ width: 120px;
4394
+ height: 6px;
4395
+ margin: ${({ theme: theme2 }) => theme2.spacing.md} auto 0;
4396
+ background: #d7d7d7;
4397
+ border-radius: 32px;
4398
+ overflow: hidden;
4399
+ `;
4400
+ var ProgressFill = styled30__default.default.span`
4401
+ position: absolute;
4402
+ top: 0;
4403
+ left: 0;
4404
+ width: ${({ $progress }) => `${Math.min(33 + $progress * (120 - 33), 120)}px`};
4405
+ height: 100%;
4406
+ background: ${({ theme: theme2 }) => theme2.colors.primary};
4407
+ border-radius: 32px;
4408
+ transition: width 0.2s ease;
4409
+ `;
4410
+ var ArrowButton4 = styled30__default.default.button`
4411
+ position: absolute;
4412
+ top: calc(50% + 30px);
4413
+ ${({ $side }) => $side === "left" ? "left: 8px;" : "right: 8px;"}
4414
+ transform: translateY(-50%);
4415
+ display: inline-flex;
4416
+ align-items: center;
4417
+ justify-content: center;
4418
+ width: 32px;
4419
+ height: 32px;
4420
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
4421
+ border: 1px solid ${({ theme: theme2 }) => theme2.colors.border};
4422
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
4423
+ color: ${({ theme: theme2 }) => theme2.colors.primary};
4424
+ cursor: pointer;
4425
+ box-shadow: ${({ theme: theme2 }) => theme2.shadows.card};
4426
+ transition: opacity 0.15s ease;
4427
+ z-index: 1;
4428
+
4429
+ &:disabled {
4430
+ opacity: 0.4;
4431
+ cursor: not-allowed;
4432
+ }
4433
+
4434
+ &:focus-visible {
4435
+ outline: 2px solid ${({ theme: theme2 }) => theme2.colors.accent};
4436
+ outline-offset: 2px;
4437
+ }
4438
+
4439
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4440
+ display: none;
4441
+ }
4442
+ `;
4443
+ var ChevronLeft5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
4444
+ "path",
4445
+ {
4446
+ d: "M10 12L6 8l4-4",
4447
+ stroke: "currentColor",
4448
+ strokeWidth: "1.5",
4449
+ strokeLinecap: "round",
4450
+ strokeLinejoin: "round"
4451
+ }
4452
+ ) });
4453
+ var ChevronRight5 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ jsxRuntime.jsx(
4454
+ "path",
4455
+ {
4456
+ d: "M6 4l4 4-4 4",
4457
+ stroke: "currentColor",
4458
+ strokeWidth: "1.5",
4459
+ strokeLinecap: "round",
4460
+ strokeLinejoin: "round"
4461
+ }
4462
+ ) });
4463
+ var TripsCategorySection = react.forwardRef(
4464
+ ({ title, description, cta, poster, videoSrc, trips, ...rest }, ref) => {
4465
+ const {
4466
+ ref: trackRef,
4467
+ scrollPrev,
4468
+ scrollNext,
4469
+ canPrev,
4470
+ canNext,
4471
+ scrollProgress
4472
+ } = useScrollSnap(trips.length);
4473
+ const handleCtaClick = () => {
4474
+ if (cta.href) {
4475
+ window.location.assign(cta.href);
4476
+ return;
4477
+ }
4478
+ cta.onClick?.();
4479
+ };
4480
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section15, { ref, ...rest, children: [
4481
+ /* @__PURE__ */ jsxRuntime.jsxs(Banner2, { children: [
4482
+ /* @__PURE__ */ jsxRuntime.jsx(BannerMedia, { children: /* @__PURE__ */ jsxRuntime.jsx("video", { autoPlay: true, muted: true, loop: true, playsInline: true, poster, src: videoSrc }) }),
4483
+ /* @__PURE__ */ jsxRuntime.jsxs(BannerContent, { children: [
4484
+ /* @__PURE__ */ jsxRuntime.jsx(BannerTitle, { children: title }),
4485
+ /* @__PURE__ */ jsxRuntime.jsx(BannerDescription, { children: description }),
4486
+ /* @__PURE__ */ jsxRuntime.jsx(BannerButton, { type: "button", onClick: handleCtaClick, children: cta.label })
4487
+ ] })
4488
+ ] }),
4489
+ /* @__PURE__ */ jsxRuntime.jsxs(CardsArea, { children: [
4490
+ /* @__PURE__ */ jsxRuntime.jsx(
4491
+ ArrowButton4,
4492
+ {
4493
+ type: "button",
4494
+ $side: "left",
4495
+ onClick: scrollPrev,
4496
+ disabled: !canPrev,
4497
+ "aria-label": "Previous trips",
4498
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronLeft5, {})
4499
+ }
4500
+ ),
4501
+ /* @__PURE__ */ jsxRuntime.jsx(Track5, { ref: trackRef, children: trips.map((trip) => /* @__PURE__ */ jsxRuntime.jsx(
4502
+ TripCategoryCard,
4503
+ {
4504
+ image: trip.image,
4505
+ alt: trip.alt,
4506
+ destination: trip.destination,
4507
+ startingPrice: trip.startingPrice,
4508
+ href: trip.href
4509
+ },
4510
+ `${trip.image}|${trip.destination}`
4511
+ )) }),
4512
+ /* @__PURE__ */ jsxRuntime.jsx(
4513
+ ArrowButton4,
4514
+ {
4515
+ type: "button",
4516
+ $side: "right",
4517
+ onClick: scrollNext,
4518
+ disabled: !canNext,
4519
+ "aria-label": "Next trips",
4520
+ children: /* @__PURE__ */ jsxRuntime.jsx(ChevronRight5, {})
4521
+ }
4522
+ ),
4523
+ /* @__PURE__ */ jsxRuntime.jsx(
4524
+ ProgressBar,
4525
+ {
4526
+ role: "progressbar",
4527
+ "aria-valuenow": Math.round(scrollProgress * 100),
4528
+ "aria-valuemin": 0,
4529
+ "aria-valuemax": 100,
4530
+ "aria-label": "Scroll position",
4531
+ children: /* @__PURE__ */ jsxRuntime.jsx(ProgressFill, { $progress: scrollProgress })
4532
+ }
4533
+ )
4534
+ ] })
4535
+ ] });
4536
+ }
4537
+ );
4538
+ TripsCategorySection.displayName = "TripsCategorySection";
4539
+ var Section16 = styled30__default.default.section`
4540
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
4541
+ `;
4542
+ var List2 = styled30__default.default.div`
4543
+ display: flex;
4544
+ flex-direction: column;
4545
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
4546
+ max-width: ${({ theme: theme2 }) => theme2.layout.contentWidth};
4547
+ margin: 0 auto;
4548
+ `;
4549
+ var ValuesSection = ({
4550
+ heading,
4551
+ subheading,
4552
+ values,
4553
+ singleOpen = false,
4554
+ ...rest
4555
+ }) => {
4556
+ const [openIndex, setOpenIndex] = react.useState(null);
4557
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section16, { ...rest, children: [
4558
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
4559
+ /* @__PURE__ */ jsxRuntime.jsx(List2, { children: values.map((value, index) => {
4560
+ const serialNumber = index + 1;
4561
+ if (!singleOpen) {
4562
+ return /* @__PURE__ */ jsxRuntime.jsx(
4563
+ ExpandableValueCard,
4564
+ {
4565
+ serialNumber,
4566
+ title: value.title,
4567
+ bullets: value.bullets
4568
+ },
4569
+ value.title
4570
+ );
4571
+ }
4572
+ return /* @__PURE__ */ jsxRuntime.jsx(
4573
+ ExpandableValueCard,
4574
+ {
4575
+ serialNumber,
4576
+ title: value.title,
4577
+ bullets: value.bullets,
4578
+ expanded: openIndex === index,
4579
+ onToggle: (next) => setOpenIndex(next ? index : null)
4580
+ },
4581
+ value.title
4582
+ );
4583
+ }) })
4584
+ ] });
4585
+ };
4586
+ ValuesSection.displayName = "ValuesSection";
4587
+ var Section17 = styled30__default.default.section`
4588
+ padding: ${({ theme: theme2 }) => theme2.layout.sectionPadding};
4589
+ `;
4590
+ var Grid2 = styled30__default.default.div`
4591
+ display: grid;
4592
+ grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
4593
+ gap: ${({ theme: theme2 }) => theme2.layout.gridGap};
4594
+ `;
4595
+ var WarriorsSection = ({
4596
+ heading,
4597
+ subheading,
4598
+ warriors,
4599
+ ...rest
4600
+ }) => {
4601
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section17, { ...rest, children: [
4602
+ /* @__PURE__ */ jsxRuntime.jsx(SectionHeader, { heading, subheading }),
4603
+ /* @__PURE__ */ jsxRuntime.jsx(Grid2, { children: warriors.map((warrior) => /* @__PURE__ */ jsxRuntime.jsx(WarriorCard, { ...warrior }, warrior.name)) })
4604
+ ] });
4605
+ };
4606
+ WarriorsSection.displayName = "WarriorsSection";
4607
+ var Section18 = styled30__default.default.section`
4608
+ display: flex;
4609
+ flex-direction: column;
4610
+ align-items: center;
4611
+ gap: ${({ theme: theme2 }) => theme2.spacing.xl};
4612
+ padding: 0 80px;
4613
+ background: ${({ theme: theme2 }) => theme2.colors.surface};
4614
+
4615
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4616
+ padding: 0 ${({ theme: theme2 }) => theme2.spacing.md};
4617
+ gap: ${({ theme: theme2 }) => theme2.spacing.lg};
4618
+ }
4619
+ `;
4620
+ var Heading7 = styled30__default.default.h2`
4621
+ margin: 0;
4622
+ font-size: ${({ theme: theme2 }) => theme2.fontSizes.xl};
4623
+ font-weight: ${({ theme: theme2 }) => theme2.fontWeights.semibold};
4624
+ line-height: 20px;
4625
+ color: ${({ theme: theme2 }) => theme2.colors.secondary};
4626
+ text-align: center;
4627
+ `;
4628
+ var Cards = styled30__default.default.div`
4629
+ display: flex;
4630
+ flex-wrap: wrap;
4631
+ align-items: flex-start;
4632
+ justify-content: center;
4633
+ gap: 16px;
4634
+ width: 100%;
4635
+ max-width: 1106px;
4636
+
4637
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4638
+ flex-wrap: nowrap;
4639
+ justify-content: flex-start;
4640
+ gap: ${({ theme: theme2 }) => theme2.spacing.md};
4641
+ overflow-x: auto;
4642
+ scroll-snap-type: x mandatory;
4643
+ padding: ${({ theme: theme2 }) => `0 ${theme2.spacing.xl}`};
4644
+ scrollbar-width: none;
4645
+
4646
+ &::-webkit-scrollbar {
4647
+ display: none;
4648
+ }
4649
+ }
4650
+ `;
4651
+ var Dots = styled30__default.default.div`
4652
+ display: none;
4653
+
4654
+ @media (max-width: ${({ theme: theme2 }) => theme2.layout.mobileBreakpoint}) {
4655
+ display: flex;
4656
+ align-items: center;
4657
+ justify-content: center;
4658
+ gap: ${({ theme: theme2 }) => theme2.spacing.sm};
4659
+ }
4660
+ `;
4661
+ var Dot3 = styled30__default.default.span`
4662
+ width: ${({ $active }) => $active ? "20px" : "8px"};
4663
+ height: 8px;
4664
+ border-radius: ${({ theme: theme2 }) => theme2.radii.full};
4665
+ background: ${({ $active, theme: theme2 }) => $active ? theme2.colors.primary : theme2.colors.border};
4666
+ transition: width 0.2s ease, background 0.2s ease;
4667
+ `;
4668
+ var WhyChooseSection = react.forwardRef(
4669
+ ({ heading, features, ...rest }, ref) => {
4670
+ const { ref: trackRef, activeIndex } = useScrollSnap(features.length);
4671
+ return /* @__PURE__ */ jsxRuntime.jsxs(Section18, { ref, ...rest, children: [
4672
+ /* @__PURE__ */ jsxRuntime.jsx(Heading7, { children: heading }),
4673
+ /* @__PURE__ */ jsxRuntime.jsx(Cards, { ref: trackRef, children: features.map((feature) => /* @__PURE__ */ jsxRuntime.jsx(
4674
+ FeatureCard,
4675
+ {
4676
+ title: feature.title,
4677
+ description: feature.description,
4678
+ illustration: feature.illustration,
4679
+ illustrationAlt: feature.illustrationAlt
4680
+ },
4681
+ feature.title
4682
+ )) }),
4683
+ features.length > 1 ? /* @__PURE__ */ jsxRuntime.jsx(Dots, { role: "tablist", "aria-label": "Feature carousel position", children: features.map((feature, index) => /* @__PURE__ */ jsxRuntime.jsx(
4684
+ Dot3,
4685
+ {
4686
+ $active: index === activeIndex,
4687
+ "aria-hidden": "true"
4688
+ },
4689
+ `${feature.title}|dot`
4690
+ )) }) : null
4691
+ ] });
4692
+ }
4693
+ );
4694
+ WhyChooseSection.displayName = "WhyChooseSection";
4695
+ var tokens = {
4696
+ colors: {
4697
+ primary: "#01AFD1",
4698
+ primaryHover: "#0089A6",
4699
+ accent: "#FEE60B",
4700
+ accentHover: "#E6CF09",
4701
+ secondary: "#4A4A4A",
4702
+ secondaryHover: "#333333",
4703
+ danger: "#DC2626",
4704
+ text: "#4A4A4A",
4705
+ textMuted: "#848484",
4706
+ background: "#FFFFFF",
4707
+ surface: "#FFFFFF",
4708
+ border: "#E2E8F0"
4709
+ },
4710
+ spacing: {
4711
+ xs: "4px",
4712
+ sm: "8px",
4713
+ md: "16px",
4714
+ lg: "24px",
4715
+ xl: "32px"
4716
+ },
4717
+ radii: {
4718
+ sm: "4px",
4719
+ md: "8px",
4720
+ lg: "12px",
4721
+ full: "9999px"
4722
+ },
4723
+ fontSizes: {
4724
+ sm: "14px",
4725
+ md: "16px",
4726
+ lg: "18px",
4727
+ xl: "24px",
4728
+ "2xl": "32px"
4729
+ },
4730
+ fontWeights: {
4731
+ light: 300,
4732
+ regular: 400,
4733
+ medium: 500,
4734
+ semibold: 600,
4735
+ bold: 700
4736
+ },
4737
+ shadows: {
4738
+ card: "0px 6px 12px rgba(0, 0, 0, 0.16)",
4739
+ cardLg: "0px 6px 12px rgba(0, 0, 0, 0.40)"
4740
+ }
4741
+ };
4742
+ var typography = {
4743
+ sectionHeading: styled30.css`
4744
+ font-size: ${tokens.fontSizes["2xl"]};
4745
+ font-weight: ${tokens.fontWeights.bold};
4746
+ color: ${tokens.colors.text};
4747
+ line-height: 1.2;
4748
+ `,
4749
+ sectionSubheading: styled30.css`
4750
+ font-size: ${tokens.fontSizes.md};
4751
+ font-weight: ${tokens.fontWeights.regular};
4752
+ color: ${tokens.colors.textMuted};
4753
+ line-height: 1.5;
4754
+ `,
4755
+ cardTitle: styled30.css`
4756
+ font-size: ${tokens.fontSizes.lg};
4757
+ font-weight: ${tokens.fontWeights.semibold};
4758
+ color: ${tokens.colors.text};
4759
+ line-height: 1.3;
4760
+ `,
4761
+ cardBody: styled30.css`
4762
+ font-size: ${tokens.fontSizes.sm};
4763
+ font-weight: ${tokens.fontWeights.light};
4764
+ color: ${tokens.colors.text};
4765
+ line-height: 1.5;
4766
+ `,
4767
+ cardLabel: styled30.css`
4768
+ font-size: ${tokens.fontSizes.sm};
4769
+ font-weight: ${tokens.fontWeights.medium};
4770
+ color: ${tokens.colors.textMuted};
4771
+ line-height: 1.4;
4772
+ `
4773
+ };
4774
+ var layout = {
4775
+ sectionPadding: `${tokens.spacing.xl} ${tokens.spacing.lg}`,
4776
+ cardPadding: tokens.spacing.lg,
4777
+ gridGap: tokens.spacing.lg,
4778
+ contentWidth: "760px",
4779
+ mobileBreakpoint: "768px"
4780
+ };
4781
+ var theme = {
4782
+ ...tokens,
4783
+ typography,
4784
+ layout
4785
+ };
4786
+
4787
+ exports.BottomNav = BottomNav;
4788
+ exports.BrandLogo = BrandLogo;
4789
+ exports.BrandsSection = BrandsSection;
4790
+ exports.CategoryNavbar = CategoryNavbar;
4791
+ exports.ContactForm = ContactForm;
4792
+ exports.ContactSection = ContactSection;
4793
+ exports.CtaBanner = CtaBanner;
4794
+ exports.DestinationCard = DestinationCard;
4795
+ exports.DestinationsSection = DestinationsSection;
4796
+ exports.EventBanner = EventBanner;
4797
+ exports.EventCarousel = EventCarousel;
4798
+ exports.ExpandableValueCard = ExpandableValueCard;
4799
+ exports.ExploreCard = ExploreCard;
4800
+ exports.ExploreSection = ExploreSection;
4801
+ exports.FaqExpandable = FaqExpandable;
4802
+ exports.FaqSection = FaqSection;
4803
+ exports.FeatureCard = FeatureCard;
4804
+ exports.Footer = Footer2;
4805
+ exports.GalleryPhoto = GalleryPhoto;
4806
+ exports.GallerySection = GallerySection;
4807
+ exports.Hero = Hero;
4808
+ exports.LocationCard = LocationCard;
4809
+ exports.MonthTabs = MonthTabs;
4810
+ exports.Navbar = Navbar;
4811
+ exports.OfficesSection = OfficesSection;
4812
+ exports.PackageCard = PackageCard;
4813
+ exports.PackagesCarousel = PackagesCarousel;
4814
+ exports.SectionHeader = SectionHeader;
4815
+ exports.TeamInfoCard = TeamInfoCard;
4816
+ exports.TeamSection = TeamSection;
4817
+ exports.TestimonialCard = TestimonialCard;
4818
+ exports.TestimonialsCarousel = TestimonialsCarousel;
4819
+ exports.TextSection = TextSection;
4820
+ exports.TripCategoryCard = TripCategoryCard;
4821
+ exports.TripsCategorySection = TripsCategorySection;
4822
+ exports.ValuesSection = ValuesSection;
4823
+ exports.WarriorCard = WarriorCard;
4824
+ exports.WarriorsSection = WarriorsSection;
4825
+ exports.WhyChooseSection = WhyChooseSection;
4826
+ exports.theme = theme;
4827
+ //# sourceMappingURL=index.cjs.map
4828
+ //# sourceMappingURL=index.cjs.map