/* ─── MyIceland hero · chapter 3 v2 (hero-side styles; the portal's own CSS is ch3/portal.css) ─── */
/* hero.css pins every image in .mi-screen absolute + will-change; undo that for the live portal */
.c3p img{position:static;inset:auto;width:auto;height:auto;display:inline;will-change:auto}
.c3p .pt-scroller{overflow:hidden!important}
.c3p .card .card__type{transform-origin:0 100%}
/* the header's two texts (Tour overview / More experiences) stacked in one cell so they can cross-fade */
.c3p .pt-eyebrow.c3-x,.c3p .pt-title.c3-x{display:grid;justify-items:center}
.c3-x>span{grid-area:1/1}
/* the Tour overview's timeline: chapter 1's first screen, below the live header */
.c3p img.c3-ov{position:absolute;left:0;top:0;width:402px;height:870px;display:block;z-index:2;-webkit-mask-image:linear-gradient(180deg,transparent 0,transparent 280px,#000 304px);mask-image:linear-gradient(180deg,transparent 0,transparent 280px,#000 304px);pointer-events:none;will-change:transform,opacity}
.c3o{position:absolute;inset:0;z-index:20;pointer-events:none}
.c3o *{box-sizing:border-box}
.c3-shade{position:absolute;inset:0;border-radius:inherit;background:#000;opacity:0;pointer-events:none;z-index:3}

/* ── the zoom: the real card's own layers plus the hero's big type ── */
.c3z-scrim{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transform-origin:50% 100%;background:linear-gradient(180deg,rgba(0,0,0,0) 28%,rgba(0,0,0,.26) 48%,rgba(0,0,0,.74) 76%,rgba(0,0,0,.9) 100%)}
.c3z-type{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:0 26px 26px;color:#fff;opacity:0;transform-origin:0 100%;font-family:'Schibsted Grotesk',system-ui,sans-serif;-webkit-font-smoothing:antialiased;pointer-events:none}
.c3z-rate{display:flex;align-items:center;gap:8px;font-size:18px;line-height:1.2;color:rgba(245,240,232,.88);margin-bottom:12px;text-shadow:0 1px 2px rgba(0,0,0,.5)}
.c3z-star{color:var(--brand-star)}
.c3z-rate b{color:#fff;font-weight:600}
.c3z-sep{color:rgba(245,240,232,.5)}
.c3z-title{font-size:42px;line-height:1.04;font-weight:600;letter-spacing:-.025em;margin:0 0 12px;color:#fff;text-wrap:balance}
.c3z-meta{font-size:19px;line-height:1.25;color:rgba(245,240,232,.86);margin:0 0 18px}
.c3z-price{position:relative;display:flex;align-items:baseline;gap:12px;height:40px}
.c3z-now{font-size:34px;font-weight:700;letter-spacing:-.015em;font-variant-numeric:tabular-nums;white-space:nowrap}
.c3z-now2{position:absolute;left:0;bottom:0;opacity:0}
.c3z-was{font-size:20px;color:rgba(245,240,232,.55);text-decoration:line-through;font-variant-numeric:tabular-nums;white-space:nowrap}
.c3z-off{position:absolute;top:30px;right:0;z-index:2;padding:calc(12px * var(--offk,1.35)) calc(22px * var(--offk,1.35)) calc(12px * var(--offk,1.35)) calc(72px * var(--offk,1.35));background:rgba(122,31,43,.66);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);-webkit-mask-image:linear-gradient(to left,#000 0,#000 55%,rgba(0,0,0,.4) 78%,transparent 94%);mask-image:linear-gradient(to left,#000 0,#000 55%,rgba(0,0,0,.4) 78%,transparent 94%);color:#fff;font:600 calc(19px * var(--offk,1.35))/1 var(--font-tabs);letter-spacing:.04em;opacity:0;pointer-events:none}
/* review knob: MOST LOVED on the real card, scaled from the product's size */
.c3p .card .chip--tag{font-size:calc(11px * var(--tagk,1.8));padding:calc(9px * var(--tagk,1.8)) calc(56px * var(--tagk,1.8)) calc(9px * var(--tagk,1.8)) calc(14px * var(--tagk,1.8));gap:calc(6px * var(--tagk,1.8))}
.c3p .card .chip--tag::before{width:calc(12px * var(--tagk,1.8));height:calc(12px * var(--tagk,1.8))}
/* the CTA: the product's label, then the hero's big labels stacked on top */
.c3p .cta.c3z-cta{position:relative;overflow:hidden;padding:0}
.c3z-ls{position:absolute;inset:0}
.c3z-l{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;font-size:22px;font-weight:600;letter-spacing:-.012em;opacity:0;white-space:nowrap}
.c3z-lp{font-weight:500;opacity:.82;font-variant-numeric:tabular-nums}

/* ── a booking panel rising inside the zoomed card from its bottom edge ── */
.c3pn-clip{position:absolute;overflow:hidden;border-radius:0 0 24px 24px;visibility:hidden}
.c3pn{position:absolute;left:0;right:0;bottom:0;background:#fff;border-radius:22px 22px 24px 24px;box-shadow:0 -14px 34px -16px rgba(0,0,0,.5);font-family:'Schibsted Grotesk',system-ui,sans-serif;color:var(--t-text-hi);-webkit-font-smoothing:antialiased}
.c3pn-h{position:absolute;left:24px;top:20px;font-size:16px;font-weight:600;letter-spacing:.005em;color:var(--t-text-lo)}
.c3-days{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;gap:8px}
.c3-day{position:relative;width:62px;height:84px;flex:none;border-radius:16px;background:color-mix(in srgb,var(--brand) 10%,transparent);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px}
.c3-day i,.c3-day__f i{font-style:normal;font:500 13px/1 var(--font-tabs);letter-spacing:.06em;text-transform:uppercase;color:var(--t-text-lo)}
.c3-day b,.c3-day__f b{font-size:30px;font-weight:700;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums;color:var(--t-text-hi)}
.c3-day--off{background:transparent}.c3-day--off b{color:var(--t-text-faint);font-weight:500}
.c3-day__f{position:absolute;inset:0;border-radius:inherit;background:var(--brand);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;opacity:0}
.c3-day__f i{color:rgba(255,255,255,.8)}.c3-day__f b{color:#fff}
.c3-step{display:flex;align-items:center;gap:16px}
.c3-step__b{position:relative;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(20,18,14,.18);display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:500;line-height:1;overflow:hidden;color:var(--t-text-hi)}
.c3-roll{display:inline-block;height:30px;overflow:hidden;min-width:18px;text-align:center}
.c3-roll>span{display:flex;flex-direction:column;font-size:26px;font-weight:700;line-height:30px;font-variant-numeric:tabular-nums}

/* ── Booking confirmed (Reschedule complete's family, in the purchase's amber) ── */
.c3m{position:absolute;inset:0}
.c3m-dim{position:absolute;inset:0;background:linear-gradient(180deg,oklch(0.26 0.06 290/.62),oklch(0.24 0.06 170/.62));opacity:0}
.c3m-pop{position:absolute;left:40px;top:292px;width:322px;padding:34px 26px 30px;border-radius:34px;background:#fff;box-shadow:0 44px 90px -28px rgba(10,8,20,.55),0 2px 8px rgba(10,8,20,.1);text-align:center;display:flex;flex-direction:column;align-items:center;font-family:'Schibsted Grotesk',system-ui,sans-serif;color:#161513;-webkit-font-smoothing:antialiased;opacity:0;transform-origin:50% 40%}
.c3m-ic{position:relative;width:108px;height:108px;margin-bottom:18px;flex:none}
.c3m-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(239,159,39,.95),rgba(247,198,107,.55) 36%,rgba(239,159,39,.08) 56%,rgba(239,159,39,.95));-webkit-mask:radial-gradient(closest-side,transparent calc(100% - 4px),#000 calc(100% - 3.5px));mask:radial-gradient(closest-side,transparent calc(100% - 4px),#000 calc(100% - 3.5px));opacity:0}
.c3m-disc{position:absolute;inset:12px;border-radius:50%;background:linear-gradient(160deg,#F6B64E,#E2852B);box-shadow:0 12px 24px -10px rgba(226,133,43,.75),inset 0 1px 0 rgba(255,255,255,.35);transform:scale(0)}
.c3m-ck{position:absolute;left:50%;top:50%;width:46px;height:46px;margin:-23px 0 0 -23px;overflow:visible}
.c3m-ck path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:19;stroke-dashoffset:19}
.c3m-ray{position:absolute;left:50%;top:50%;width:5px;height:14px;margin:-7px 0 0 -2.5px;border-radius:3px;transform:rotate(var(--a)) translateY(calc(var(--r,58) * -1px)) scaleY(var(--k,1));opacity:var(--o,0)}
.c3m-pulse{position:absolute;inset:0;border-radius:50%;border:2px solid rgba(239,159,39,.7);opacity:0}
.c3m-slot{position:absolute;opacity:0}
.c3m-slot svg,.c3-alt svg{display:block;width:100%;height:100%;overflow:visible}
.c3m-t{font-size:28px;line-height:1.1;font-weight:600;letter-spacing:-.022em;margin:0 0 10px}
.c3m-b{font-size:19px;line-height:1.3;font-weight:600;margin:0}
.c3m-s{font-size:18px;line-height:1.3;color:#6a655d;margin:4px 0 0;font-variant-numeric:tabular-nums}
.mi-star__spin{position:relative}
.c3-alt{position:absolute;inset:0;opacity:0}

/* ── beside the phone: glass tabs, the operator's switch, the revenue card ── */
.c3-bt,.c3-pr,.c3-ta,.c3-coin,.c3-win{box-sizing:border-box}
.c3-pr{position:absolute;display:flex;align-items:center;justify-content:space-between;padding:0 50px 0 32px;border-radius:32px;background:rgba(255,255,255,.96);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 60px -20px rgba(22,21,19,.26),0 1px 3px rgba(22,21,19,.06);font:600 34px/1 'Schibsted Grotesk',system-ui,sans-serif;letter-spacing:-.025em;color:#161513;white-space:nowrap;transform-origin:100% 50%;pointer-events:none;will-change:transform,opacity}
/* the admin toggle (uploads/hero-southcoast/toggle/toggle.css, verbatim values), pseudo-elements made real */
.c3-tg{position:relative;display:block;flex:none;width:38px;height:22px;border-radius:999px;background:#d6d7d3;box-shadow:inset 0 2px 4px rgba(0,0,0,.22),inset 0 -1px 1px rgba(255,255,255,.30);isolation:isolate;transform-origin:100% 50%}
.c3-tg__on{position:absolute;inset:0;z-index:0;border-radius:999px;box-shadow:inset 0 2px 5px rgba(4,8,22,.40),inset 0 0 0 1px rgba(255,255,255,.06);opacity:0}
.c3-tg__f{position:absolute;inset:0;z-index:0;border-radius:999px;background-image:linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.03) 9%,transparent 26%),linear-gradient(rgba(255,255,255,.05),rgba(255,255,255,.05)),url("assets/aurora-toggle-field.png");background-size:cover;background-position:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.42),inset 0 0 0 1px rgba(255,255,255,.16),inset 0 -7px 11px -9px rgba(4,8,22,.5);opacity:0;transform:scale(.96)}
.c3-tg__k{position:absolute;top:2px;left:2px;z-index:2;width:18px;height:18px;border-radius:50%;background:linear-gradient(180deg,#fff,#f4f5f7);box-shadow:0 1px 3px rgba(6,10,26,.4),0 0 0 .5px rgba(6,10,26,.07),inset 0 1px 0 rgba(255,255,255,.9)}
.c3-ta{position:absolute;padding:26px 32px;border-radius:32px;background:rgba(255,255,255,.94);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 60px -20px rgba(22,21,19,.24),0 1px 3px rgba(22,21,19,.06);font-family:'Schibsted Grotesk',system-ui,sans-serif;color:#131211;transform-origin:100% 50%;pointer-events:none;will-change:transform,opacity}
.c3-ta__l{display:block;font-size:17px;font-weight:500;color:#8a857c;letter-spacing:.005em}
.c3-ta__n{display:block;margin-top:10px;font-size:52px;line-height:1;font-weight:700;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap;transform-origin:0 70%}
.c3-ta__d{display:inline-block;margin-top:14px;padding:7px 12px;border-radius:999px;background:rgba(151,196,89,.18);color:#3f6a1f;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;opacity:0;transform-origin:0 50%}
.c3-coin{position:absolute;left:0;top:0;padding:10px 16px;border-radius:999px;background:oklch(0.55 0.04 75);color:#fff;font:600 19px/1 'Schibsted Grotesk',system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap;box-shadow:0 14px 30px -10px rgba(22,21,19,.45);pointer-events:none;z-index:6}
/* the photograph spreading out around the phone: one pre-feathered layer, only its gradient mask resizes */
.c3-win{position:absolute;overflow:hidden;pointer-events:none;will-change:opacity;-webkit-mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.66) 62%,rgba(0,0,0,.22) 83%,transparent 100%);mask-image:radial-gradient(closest-side,#000 40%,rgba(0,0,0,.66) 62%,rgba(0,0,0,.22) 83%,transparent 100%);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;-webkit-mask-size:26% 26%;mask-size:26% 26%}
.c3-win img{position:absolute;left:-3%;top:-3%;width:106%;height:106%;object-fit:cover;object-position:50% 42%;display:block;will-change:transform}

/* idea 8 · Full bleed: frosted day chips on the photograph */
.c3fc{position:absolute;left:20px;width:362px;display:flex;gap:8px;opacity:0}
.c3fc-d{position:relative;flex:1;height:76px;border-radius:18px;background:rgba(255,255,255,.14);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%);border:1px solid rgba(255,255,255,.26);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#fff;font-family:'Schibsted Grotesk',system-ui,sans-serif}
.c3fc-d i,.c3fc-f i{font-style:normal;font:500 13px/1 var(--font-tabs);letter-spacing:.06em;text-transform:uppercase;opacity:.8}
.c3fc-d b,.c3fc-f b{font-size:28px;font-weight:700;line-height:1;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.c3fc-f{position:absolute;inset:-1px;border-radius:inherit;background:#fff;color:#161513;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;opacity:0}
/* idea 6 · Panorama: a sharp-edged rounded window of the photograph opening sideways out of the phone */
.c3-band{position:absolute;pointer-events:none}
.c3-band__win{position:absolute;top:0;height:100%;overflow:hidden}
.c3-band__pane{position:absolute;left:0;top:0;height:100%;overflow:hidden;will-change:transform,opacity}
.c3-band__off{position:absolute;left:0;top:44px;padding:14px 72px 14px 28px;background:rgba(122,31,43,.66);-webkit-backdrop-filter:blur(16px) saturate(160%);backdrop-filter:blur(16px) saturate(160%);-webkit-mask-image:linear-gradient(to right,#000 0,#000 55%,rgba(0,0,0,.4) 78%,transparent 94%);mask-image:linear-gradient(to right,#000 0,#000 55%,rgba(0,0,0,.4) 78%,transparent 94%);color:#fff;font:600 26px/1 'Inter Tight','Schibsted Grotesk',system-ui,sans-serif;letter-spacing:.04em;opacity:0}
.c3-band img{position:absolute;top:0;height:100%;object-fit:cover;object-position:50% 45%;display:block}
/* idea 4 · Adults: the row that pops in between the card and the button */
.c3-ad{position:absolute;left:16px;width:370px;height:64px;padding:0 12px 0 22px;border-radius:20px;background:#fff;border:.5px solid rgba(20,18,14,.1);box-shadow:0 10px 24px -14px rgba(22,21,19,.35);display:flex;align-items:center;justify-content:space-between;font-family:'Schibsted Grotesk',system-ui,sans-serif;color:var(--t-text-hi);opacity:0;visibility:hidden;transform-origin:50% 0}
.c3-ad__t{font-size:22px;font-weight:600;letter-spacing:-.01em}
/* idea 7 · New ticket: the booking as a ticket behind the phone */
.c3-tk{position:absolute;display:flex;align-items:stretch;border-radius:26px;background:rgba(255,255,255,.95);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border:1px solid rgba(255,255,255,.9);box-shadow:0 30px 60px -20px rgba(22,21,19,.26),0 1px 3px rgba(22,21,19,.06);font-family:'Schibsted Grotesk',system-ui,sans-serif;color:#161513;transform-origin:100% 50%;pointer-events:none;overflow:hidden;will-change:transform,opacity;box-sizing:border-box}
.c3-tk img{width:118px;flex:none;object-fit:cover;display:block}
.c3-tk__m{flex:1;min-width:0;padding:20px 20px 18px 22px;display:flex;flex-direction:column;justify-content:center;gap:7px}
.c3-tk__e{font:600 12px/1 var(--font-tabs,'Inter Tight',system-ui,sans-serif);letter-spacing:.12em;text-transform:uppercase;color:#C9821A}
.c3-tk__t{font-size:22px;font-weight:600;letter-spacing:-.02em;line-height:1.1}
.c3-tk__s{font-size:16px;color:#6a655d;font-variant-numeric:tabular-nums}
.c3-tk__stub{width:88px;flex:none;border-left:2px dashed rgba(20,18,14,.14);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.c3-tk__stub b{font-size:34px;font-weight:700;letter-spacing:-.03em;line-height:1}
.c3-tk__stub i{font-style:normal;font:600 11px/1 var(--font-tabs,'Inter Tight',system-ui,sans-serif);letter-spacing:.12em;text-transform:uppercase;color:#8a857c}
/* idea 8 · Revenue: big clean type beside the phone */
.c3-rv{position:absolute;font-family:'Schibsted Grotesk',system-ui,sans-serif;color:#161513;pointer-events:none;visibility:hidden;will-change:transform,opacity}
.c3-rv__l{display:block;font:600 13px/1 var(--font-tabs,'Inter Tight',system-ui,sans-serif);letter-spacing:.14em;text-transform:uppercase;color:#C9821A}
.c3-rv__n{display:block;margin-top:14px;font-size:66px;line-height:.95;font-weight:700;letter-spacing:-.045em;font-variant-numeric:tabular-nums;white-space:nowrap;transform-origin:0 80%}
.c3-rv__d{display:inline-flex;margin-top:16px;padding:8px 14px;border-radius:999px;background:#161513;color:#fff;font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;opacity:0;transform-origin:0 50%}
/* the More experiences tap, other ways (ch3-entrance.js) */
.c3-lift{position:absolute;z-index:4;transform-origin:50% 50%;pointer-events:none;will-change:transform,opacity}
.c3-lift__sh{position:absolute;inset:0;border-radius:999px;box-shadow:0 26px 44px -14px rgba(22,21,19,.42),0 4px 10px -4px rgba(22,21,19,.16);opacity:0}
.c3-lift .pt-tabs,.c3-loupe .pt-tabs{background:#efe8df;margin:0;white-space:nowrap}
.c3-loupe{position:absolute;z-index:4;border-radius:50%;overflow:hidden;pointer-events:none;box-shadow:0 30px 50px -18px rgba(22,21,19,.45),0 3px 10px rgba(22,21,19,.14);will-change:transform,opacity}
.c3-loupe__in{position:absolute;inset:0;background:#f7f0e8}
.c3-loupe__in .c3p{position:absolute;left:0;top:0;transform-origin:0 0}
.c3-loupe__rim{position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.95),inset 0 0 0 5px rgba(255,255,255,.35),inset 0 10px 18px -8px rgba(255,255,255,.9),inset 0 -12px 20px -12px rgba(22,21,19,.22);background:radial-gradient(120% 70% at 30% 0%,rgba(255,255,255,.35),rgba(255,255,255,0) 55%)}
.c3-act .mi-card__icon{display:grid;place-items:center}.c3-act .mi-card__icon svg{width:78%;height:78%}
.c3-bt{position:absolute;display:flex;align-items:center;gap:4px;padding:5px;border-radius:999px;background:rgba(255,255,255,.82);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.85);box-shadow:0 22px 46px -18px rgba(22,21,19,.24),0 1px 3px rgba(22,21,19,.06);font:500 17px/1 'Inter Tight','Schibsted Grotesk',system-ui,sans-serif;white-space:nowrap;transform-origin:100% 50%;pointer-events:none;box-sizing:border-box;will-change:transform,opacity}
.c3-bt__th{position:absolute;top:5px;bottom:5px;left:0;border-radius:999px;background:rgba(20,18,14,.075)}
.c3-bt__s{position:relative;display:flex;align-items:center;gap:9px;height:42px;padding:0 18px 0 16px;color:rgba(26,24,20,.45)}
.c3-bt__s i{width:6px;height:6px;border-radius:50%;flex:none;background:oklch(0.55 0.04 75);box-shadow:0 0 7px oklch(0.55 0.04 75);opacity:0}
