:root {
  color-scheme: dark;
  --bg: #251e1d;
  --panel: #29211f;
  --ink: #f7efe5;
  --muted: #c0aba0;
  --accent: #cda384;
  --accent-ink: #241a17;
  --hairline: rgba(244,222,204,.25);
  --stage-bg: #49352e;
  --shadow: rgba(9,8,9,.24);
  --image-filter: saturate(.90) contrast(1.04);
  --stage-photo: none;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; font-family: "DM Sans",system-ui,sans-serif; background: var(--bg); color: var(--ink); -webkit-font-smoothing: antialiased; }
body[data-season="spring"] {
  color-scheme: light;
  --bg: #e9e8dd;
  --panel: #f4f1e8;
  --ink: #29332e;
  --muted: #687569;
  --accent: #6d8068;
  --accent-ink: #fffdf5;
  --hairline: rgba(40,61,48,.23);
  --stage-bg: #b9bcab;
  --shadow: rgba(45,52,41,.15);
  --image-filter: saturate(.68) brightness(1.04);
}
body[data-season="summer"] {
  --bg: #123744;
  --panel: #12343e;
  --ink: #f7f5e9;
  --muted: #b8c6c8;
  --accent: #ecc787;
  --accent-ink: #1b3540;
  --hairline: rgba(244,244,223,.25);
  --stage-bg: #467381;
  --shadow: rgba(3,27,34,.3);
  --image-filter: saturate(1.1) contrast(1.03);
}
body[data-season="autumn"] {
  --bg: #251e1d;
  --panel: #29211f;
  --ink: #f7efe5;
  --muted: #c0aba0;
  --accent: #cda384;
  --accent-ink: #241a17;
  --hairline: rgba(244,222,204,.25);
  --stage-bg: #49352e;
  --shadow: rgba(9,8,9,.24);
  --image-filter: saturate(.87) sepia(.10) contrast(1.05);
}
body[data-season="winter"] {
  --bg: #15191f;
  --panel: #1c222b;
  --ink: #f2f3f5;
  --muted: #b0bbc5;
  --accent: #c8d0d8;
  --accent-ink: #1b222a;
  --hairline: rgba(240,244,250,.24);
  --stage-bg: #3a424b;
  --shadow: rgba(3,6,11,.35);
  --image-filter: grayscale(.82) contrast(1.13);
}
.page { min-height: 100svh; position: relative; background: var(--bg); overflow: hidden; }
.page::before { content:""; position:absolute; inset:0; background: radial-gradient(ellipse 75% 65% at 77% 43%,var(--stage-bg) 0%,transparent 79%); opacity:.27; pointer-events:none; }
.ambient { position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.25; background: repeating-linear-gradient(90deg,transparent 0 99px,var(--hairline) 100px 101px); mask-image:linear-gradient(90deg,transparent 0%,black 25%,transparent 100%); }
.page-frame { position:relative; z-index:1; width:min(1680px,100%); margin:auto; min-height:100svh; display:flex; flex-direction:column; padding:clamp(21px,3vw,42px) clamp(21px,4vw,78px) 18px; }
.site-header,.site-footer { width:100%; display:flex; align-items:center; justify-content:space-between; gap:18px; }
.site-header { position:relative; z-index:3; }
.wordmark { font-size:clamp(26px,2.8vw,38px); font-weight:700; line-height:1; letter-spacing:-.085em; color:var(--ink); text-decoration:none; }
.wordmark-dot { color:var(--accent); }
.header-meta { display:flex; align-items:center; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:.2em; white-space:nowrap; }
.meta-divider { padding:0 12px; opacity:.6; }
.meta-dot { background:var(--accent); width:6px; height:6px; border-radius:50%; margin-right:12px; }
.hero { flex:1; display:grid; grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr); align-items:center; gap:clamp(30px,5.4vw,96px); padding:clamp(25px,4.1vh,52px) 0; }
.content-panel { grid-column:1; grid-row:1; z-index:2; max-width:520px; padding:clamp(23px,3.5vw,45px) 0; }
.image-stage { grid-column:2; grid-row:1; position:relative; width:100%; height:min(74svh,780px); min-height:480px; display:flex; align-items:center; justify-content:center; background:var(--stage-bg); box-shadow: 0 26px 90px var(--shadow); overflow:hidden; }
.image-stage::before { content:""; position:absolute; inset:-30px; z-index:0; background-image:var(--stage-photo); background-size:cover; background-position:center; filter:blur(34px) brightness(.68); transform:scale(1.12); opacity:.5; }
.image-stage::after { content:""; position:absolute; inset:0; z-index:1; border:1px solid rgba(255,255,255,.17); pointer-events:none; }
.signature-frame { height:100%; width:100%; position:relative; z-index:1; display:flex; justify-content:center; align-items:center; }
.signature-frame img { width:100%; height:100%; max-width:100%; object-fit:contain; object-position:center; filter:var(--image-filter); display:block; }
.editorial-frame { display:none; position:relative; z-index:1; width:100%; height:100%; grid-template-columns:minmax(0,1.45fr) minmax(0,.85fr); grid-template-rows:1fr 1fr; gap:10px; padding:10px; }
.editorial-tile { position:relative; min-width:0; min-height:0; overflow:hidden; margin:0; background:var(--stage-bg); }
.editorial-tile img { display:block; width:100%; height:100%; object-fit:cover; object-position:center; filter:var(--image-filter); }
.editorial-lead { grid-column:1; grid-row:1/3; }
.editorial-top { grid-column:2; grid-row:1; }
.editorial-bottom { grid-column:2; grid-row:2; }
.editorial-lead img { object-position:50% 30%; }
.editorial-top img { object-position:50% 26%; }
.editorial-bottom img { object-position:50% 35%; }
body[data-layout="editorial"] .signature-frame { display:none; }
body[data-layout="editorial"] .editorial-frame { display:grid; }
.image-label { position:absolute; z-index:3; bottom:17px; left:17px; right:17px; display:flex; justify-content:space-between; color:#fff; mix-blend-mode:normal; text-shadow:0 1px 9px rgba(0,0,0,.75); font-size:9px; font-weight:700; letter-spacing:.22em; }
.eyebrow-row { display:flex; align-items:center; gap:18px; margin-bottom:12px; }
.eyebrow { font-size:10px; font-weight:700; letter-spacing:.27em; color:var(--accent); }
.eyebrow-row .line { flex:1; height:1px; max-width:95px; background:var(--hairline); }
h1 { margin:0 0 19px; font:400 clamp(64px,6.7vw,106px)/.88 "DM Serif Display",Georgia,serif; letter-spacing:-.055em; }
h1 em { font-weight:400; color:var(--accent); }
.intro { max-width:360px; color:var(--muted); font-size:14px; line-height:1.7; margin:0 0 31px; }
.destination-links { display:grid; gap:11px; }
.destination { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:78px; padding:14px 18px 14px 21px; color:var(--ink); text-decoration:none; transition:transform .2s ease,box-shadow .2s ease,background .2s ease; }
.destination:hover { transform:translateY(-2px); }
.destination-primary { background:var(--accent); color:var(--accent-ink); box-shadow:0 12px 28px var(--shadow); }
.destination-secondary { background:rgba(255,255,255,.035); border:1px solid var(--hairline); }
.destination-secondary:hover { background:rgba(255,255,255,.085); }
.destination-label { display:block; margin-bottom:4px; font-size:9px; font-weight:700; letter-spacing:.2em; opacity:.8; }
.destination strong { display:block; font-size:19px; font-weight:600; letter-spacing:-.03em; }
.destination-arrow { font-size:24px; line-height:1; }
.social-section { margin-top:29px; }
.social-section h2 { font-size:10px; letter-spacing:.23em; color:var(--muted); margin:0 0 10px; }
.social-links { display:grid; grid-template-columns:1fr 1fr; gap:12px 24px; }
.social-links a { display:flex; justify-content:space-between; align-items:center; color:var(--ink); text-decoration:none; padding:9px 0; font-size:13px; font-weight:500; }
.social-links a span,.more-links a span { color:var(--accent); }
.more-links { margin-top:20px; border:1px solid var(--hairline); }
.more-links summary { display:flex; justify-content:space-between; align-items:center; gap:10px; cursor:pointer; padding:12px 14px; font-size:10px; letter-spacing:.2em; font-weight:700; list-style:none; color:var(--muted); }
.more-links summary::-webkit-details-marker { display:none; }
.more-links[open] summary span { transform:rotate(45deg); }
.more-links summary span { color:var(--accent); font-size:18px; transition:transform .2s ease; }
.more-links nav { display:grid; grid-template-columns:1fr; gap:10px; padding:0 14px 12px; }
.more-links a { display:flex; justify-content:space-between; align-items:center; gap:10px; color:var(--ink); text-decoration:none; padding:9px 0; font-size:12px; }
.site-footer { color:var(--muted); font-size:9px; font-weight:700; letter-spacing:.2em; padding-top:10px; }
.footer-centre { opacity:.58; }
.design-preview { position:fixed; z-index:30; bottom:13px; right:13px; width:min(370px,calc(100vw - 26px)); border-radius:12px; border:1px solid rgba(255,255,255,.2); color:#fff; background:rgba(17,20,26,.97); box-shadow:0 12px 48px rgba(0,0,0,.4); padding:13px 14px; }
.design-preview[hidden] { display:none; }
.preview-title { display:flex; justify-content:space-between; font-size:11px; font-weight:700; letter-spacing:.15em; margin-bottom:11px; }
.preview-title span { font-size:9px; color:#abb3bc; }
.preview-group { margin-top:10px; }
.preview-group-label { font-size:9px; letter-spacing:.17em; color:#abb3bc; font-weight:700; }
.preview-actions { display:flex; gap:5px; flex-wrap:wrap; margin-top:7px; }
.preview-actions button { appearance:none; border:1px solid rgba(255,255,255,.24); border-radius:5px; background:transparent; color:white; font:600 11px "DM Sans",sans-serif; cursor:pointer; padding:7px 9px; }
.preview-actions button[aria-pressed="true"] { background:#f5eee5; color:#1b1f24; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.noscript { padding:15px; margin:0; text-align:center; font-size:12px; }
@media (min-width:1500px) { .hero { gap:90px; } .image-stage { height:min(79svh,860px); } }
@media (max-width:1040px) {
  .hero { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:26px; }
  .image-stage { min-height:450px; height:65svh; }
  h1 { font-size:clamp(63px,6vw,86px); }
  .content-panel { padding:20px 0; }
}
@media (max-width:730px) {
  .page-frame { padding:17px 17px 18px; }
  .site-header { margin-bottom:0; }
  .header-meta { font-size:9px; letter-spacing:.11em; }
  .meta-dot { display:none; }
  .header-meta #header-season,.meta-divider { display:none; }
  .hero { display:flex; flex-direction:column; gap:0; padding:22px 0 20px; align-items:stretch; }
  .image-stage { order:1; min-height:0; height:37svh; max-height:370px; width:100%; }
  .signature-frame img { object-position:center; }
  .editorial-frame { gap:6px; padding:6px; }
  .image-label { bottom:12px; left:12px; right:12px; font-size:8px; }
  .content-panel { order:2; width:calc(100% - 18px); max-width:none; margin:-35px auto 0; padding:29px 24px 24px; background:var(--panel); box-shadow:0 18px 40px var(--shadow); border:1px solid var(--hairline); }
  .eyebrow { font-size:9px; }
  h1 { font-size:clamp(55px,12vw,77px); margin-bottom:14px; }
  .intro { font-size:13px; margin-bottom:20px; }
  .destination { min-height:67px; }
  .destination strong { font-size:17px; }
  .social-section { margin-top:22px; }
  .site-footer { font-size:8px; letter-spacing:.13em; }
  .footer-centre { display:none; }
}
@media (max-width:410px) {
  .page-frame { padding-left:13px; padding-right:13px; }
  .content-panel { padding:23px 18px; }
  .image-stage { height:34svh; }
  .social-links { gap:0 14px; }
  .destination { padding:12px 14px; }
  .header-meta { font-size:8px; }
}
@media (prefers-reduced-motion:reduce) { *,*:before,*:after { scroll-behavior:auto!important; transition-duration:0s!important; animation-duration:0s!important; } }

/* Platform identities, consistently sized but retaining each official silhouette. */
.icon-sprite { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.platform-icon { width:20px; height:20px; flex:none; fill:currentColor; display:block; }
.platform-icon-of { width:29px; height:29px; }
.destination-body { display:flex; align-items:center; gap:17px; min-width:0; }
.social-label { display:inline-flex; align-items:center; gap:11px; min-width:0; }
.social-links a .social-label,.more-links a .social-label { color:inherit; }
.social-links a .social-label span,.more-links a .social-label span { color:var(--ink); }
.social-links a .link-arrow,.more-links a .link-arrow { color:var(--accent); }
.more-links nav .platform-icon { width:18px; height:18px; }
/* Portraits keep their full framing, without a coloured letterbox either side. */
body[data-layout="signature"] .image-stage { width:min(100%,590px); justify-self:center; background:transparent; box-shadow:none; }
body[data-layout="signature"] .image-stage::before,
body[data-layout="signature"] .image-stage::after { display:none; }
body[data-layout="signature"] .signature-frame img { box-shadow:0 22px 64px var(--shadow); }
body[data-layout="signature"] .image-label { left:32px; right:32px; }
@media (max-width:730px) {
  body[data-layout="signature"] .image-stage { width:100%; height:clamp(340px,47svh,470px); max-height:none; }
  .platform-icon-of { width:26px; height:26px; }
  .destination-body { gap:12px; }
}

/* Refinements after mobile review: let the photographs finish before the links begin. */
.social-links .platform-icon { width:26px; height:26px; }
@media (max-width:730px) {
  .content-panel { margin:16px auto 0; }
  .social-links .platform-icon { width:26px; height:26px; }
}

/* Keep the shareable mobile preview unobstructed while retaining both layout options. */
@media (max-width:730px) {
  .design-preview { position:relative; inset:auto; width:calc(100% - 26px); margin:14px auto 18px; }
}

/* Guidance for visitors whose social app has opened this page in a webview. */
.browser-guide[hidden], .browser-guide-trigger[hidden],
.browser-guide-status[hidden], .browser-guide-fallback[hidden],
.browser-guide-actions a[hidden] { display:none!important; }
.browser-guide { margin:0 0 23px; padding:18px 20px 19px; background:var(--panel); border:1px solid var(--hairline); border-left:3px solid var(--accent); box-shadow:0 12px 30px var(--shadow); }
.browser-guide-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.browser-guide-kicker { font-size:9px; font-weight:700; letter-spacing:.23em; color:var(--accent); }
.browser-guide-close { display:grid; place-items:center; width:31px; height:31px; border:0; background:transparent; color:var(--muted); font-size:25px; line-height:1; cursor:pointer; }
.browser-guide h2 { margin:0 0 10px; font:400 28px/1.1 "DM Serif Display",Georgia,serif; letter-spacing:-.03em; }
.browser-guide p { margin:0 0 10px; font-size:12px; line-height:1.6; color:var(--muted); }
.browser-guide p strong { color:var(--ink); font-weight:700; }
.browser-guide-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:16px; }
.browser-guide-actions button, .browser-guide-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:10px 13px; text-decoration:none; cursor:pointer; border:1px solid var(--hairline); font:600 11px/1.25 "DM Sans",sans-serif; }
.browser-guide-actions button { color:var(--accent-ink); background:var(--accent); border-color:var(--accent); }
.browser-guide-actions a { color:var(--ink); background:transparent; }
.browser-guide .browser-guide-status { margin:12px 0 0; color:var(--ink); font-weight:600; }
.browser-guide-fallback { margin-top:10px; width:100%; padding:9px; color:var(--ink); background:transparent; border:1px solid var(--hairline); font:12px "DM Sans",sans-serif; }
.browser-guide-trigger { display:block; appearance:none; margin:11px 0 0; padding:5px 0; border:0; background:transparent; color:var(--muted); text-decoration:underline; text-underline-offset:3px; text-decoration-thickness:1px; cursor:pointer; font:500 11px "DM Sans",sans-serif; }
@media (max-width:730px) { .browser-guide { padding:15px; } .browser-guide h2 { font-size:25px; } }
