.guide-main { padding-top: 6.5rem; background: #fff; }
.guide-hero { position: relative; min-height: 42rem; display: grid; align-items: end; overflow: hidden; color: white; background: linear-gradient(105deg, rgba(2,45,55,.97), rgba(0,137,151,.77), rgba(62,212,195,.18)), url('/assets/skyline-hero.png') center/cover; }
.guide-hero::after { content: ""; position: absolute; inset: auto -8rem -11rem auto; width: 32rem; height: 32rem; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; }
.guide-hero-inner { position: relative; z-index: 2; width: min(74rem, calc(100% - 2.5rem)); margin: 0 auto; padding: 4.5rem 0 5.5rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .6rem; margin-bottom: 4rem; color: rgba(255,255,255,.62); font-size: .78rem; }
.breadcrumbs a { color: white; }
.guide-hero .eyebrow { color: #8ed3ca; }
.guide-hero h1 { max-width: 64rem; margin: .8rem 0 1.2rem; font: 500 clamp(3.2rem, 7vw, 6.7rem)/.92 var(--serif); letter-spacing: -.05em; text-wrap: balance; }
.guide-intro { max-width: 50rem; color: rgba(255,255,255,.82); font-size: clamp(1.08rem, 1.8vw, 1.35rem); line-height: 1.65; }
.hero-action { display: inline-flex; gap: 1rem; margin-top: 1.25rem; padding: .95rem 1.2rem; border-radius: 999px; color: var(--ink); background: #efce8b; text-decoration: none; font-weight: 600; }
.guide-article { width: min(74rem, calc(100% - 2.5rem)); margin: 0 auto; display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: clamp(3rem, 8vw, 9rem); padding: clamp(5rem, 9vw, 9rem) 0; }
.guide-aside { position: sticky; top: 8.5rem; align-self: start; display: flex; flex-direction: column; border-top: 2px solid var(--gold); }
.guide-aside > span { padding: 1rem 0 .75rem; color: #9a7438; text-transform: uppercase; letter-spacing: .14em; font-size: .7rem; font-weight: 600; }
.guide-aside a { padding: .72rem 0; border-top: 1px solid var(--line); color: #5a727a; text-decoration: none; font-size: .88rem; line-height: 1.35; }
.guide-aside a:hover { color: var(--ocean); }
.guide-content > section { padding: 0 0 4.8rem; margin: 0 0 4.8rem; border-bottom: 1px solid var(--line); scroll-margin-top: 8rem; }
.guide-content > section:last-child { margin-bottom: 0; border-bottom: 0; }
.section-label { color: #a0783a; font-size: .72rem; letter-spacing: .18em; }
.guide-content h2, .related h2, .page-cta h2 { margin: .65rem 0 1.3rem; font: 500 clamp(2.3rem, 4vw, 4.2rem)/1 var(--serif); letter-spacing: -.035em; }
.guide-content h3 { margin: .5rem 0 .7rem; font: 500 1.55rem/1.15 var(--serif); }
.guide-content p, .guide-content li { color: #4e6871; font-size: 1.04rem; line-height: 1.8; }
.guide-content a { color: var(--ocean); font-weight: 600; text-underline-offset: .3rem; }
.guide-content blockquote { margin: 2rem 0; padding: 1.5rem 0 1.5rem 2rem; border-left: 3px solid var(--gold); color: var(--ink); font: italic 500 clamp(1.5rem, 3vw, 2.3rem)/1.3 var(--serif); }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 2rem 0; background: var(--line); border: 1px solid var(--line); }
.feature-grid article { min-height: 13rem; padding: 1.5rem; background: linear-gradient(145deg, #effbf7, #ddf7f0); }
.feature-grid article > span { color: #a0783a; font-size: .68rem; }
.feature-grid article p { margin-bottom: 0; font-size: .92rem; line-height: 1.65; }
.steps { list-style: none; padding: 0; margin: 1.5rem 0; counter-reset: steps; }
.steps li { display: grid; grid-template-columns: minmax(12rem, .6fr) 1fr; gap: 1.5rem; padding: 1.2rem 0; border-top: 1px solid var(--line); }
.steps strong { color: var(--ink); font: 500 1.25rem var(--serif); }
.steps span { color: #61777e; }
.check-list { padding: 0; list-style: none; }
.check-list li { position: relative; padding: .8rem 0 .8rem 2rem; border-bottom: 1px solid var(--line); }
.check-list li::before { content: "✓"; position: absolute; left: .25rem; color: var(--ocean); font-weight: 700; }
.area-table { margin: 2rem 0; border: 1px solid var(--line); }
.table-row { display: grid; grid-template-columns: 1fr 1.4fr 1fr; gap: 1rem; padding: 1rem 1.2rem; border-bottom: 1px solid var(--line); }
.table-row:last-child { border-bottom: 0; }
.table-row.head { color: white; background: var(--ink); text-transform: uppercase; letter-spacing: .12em; font-size: .7rem; }
.table-row span { color: #5d747b; }
.table-row.head span { color: white; }
.wide-figure { margin: 2rem 0; }
.wide-figure img { display: block; width: 100%; max-height: 38rem; object-fit: cover; border-radius: 1rem; }
.wide-figure figcaption { padding: .9rem 0; color: #687e84; font-size: .83rem; line-height: 1.5; }
.logo-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: center; padding: 2rem; background: #f5f1e8; border-radius: 1rem; }
.logo-panel img { width: 100%; mix-blend-mode: multiply; }
.page-form { margin-top: 1.5rem; background: #f5f8f6; box-shadow: none; border: 1px solid var(--line); }
.booking-wizard { scroll-margin-top: 8rem; }
.booking-progress { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; margin: 2rem 0 2.5rem; padding: 0; list-style: none; }
.booking-progress li { display: flex; align-items: center; gap: .5rem; padding: .7rem; color: #71878c; border-bottom: 2px solid #cfdedb; font-size: .78rem; font-weight: 600; }
.booking-progress li span { display: grid; place-items: center; width: 1.65rem; height: 1.65rem; border-radius: 50%; color: #5d757b; background: #deebe8; }
.booking-progress li.active { color: var(--ocean); border-color: var(--ocean); }
.booking-progress li.active span { color: white; background: var(--ocean); }
.booking-progress li.complete { color: #3f8378; border-color: var(--aqua); }
.booking-progress li.complete span { color: var(--ink); background: var(--aqua); }
.booking-step { min-width: 0; margin: 0; padding: 0; border: 0; }
.booking-step legend { padding: 0; color: var(--ink); font: 500 clamp(1.8rem, 3vw, 2.7rem)/1.05 var(--serif); }
.step-help { margin: .6rem 0 1.5rem; color: #668087 !important; font-size: .95rem !important; }
.choice-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin: 1.5rem 0 2rem; }
.choice-grid label { cursor: pointer; }
.choice-grid input { position: absolute; opacity: 0; pointer-events: none; }
.choice-grid label > span { min-height: 10rem; display: flex; flex-direction: column; padding: 1.2rem; border: 2px solid transparent; border-radius: 1rem; color: var(--ink); background: white; box-shadow: 0 10px 28px rgba(3,61,73,.07); }
.choice-grid label > span > strong { margin: .9rem 0 .35rem; font: 500 1.25rem var(--serif); }
.choice-grid label > span > small { color: #657e84; font-size: .82rem; line-height: 1.45; }
.choice-grid input:checked + span { border-color: var(--ocean); background: #dcf8f1; box-shadow: 0 12px 30px rgba(0,143,163,.15); }
.choice-grid input:focus-visible + span { outline: 3px solid var(--sun); outline-offset: 2px; }
.wizard-actions { display: grid; grid-template-columns: auto 1fr; gap: .8rem; align-items: stretch; }
.wizard-actions > button:first-child { padding: .9rem 1.1rem; border: 1px solid #b9cdca; border-radius: .45rem; color: var(--ink); background: white; cursor: pointer; }
.stay-summary { display: flex; flex-direction: column; gap: .35rem; margin: 1.5rem 0 .5rem; padding: 1.2rem; border-left: 4px solid var(--gold); border-radius: .7rem; background: linear-gradient(135deg, #fff2d2, #e3faf4); }
.stay-summary > span { color: #9a7438; text-transform: uppercase; letter-spacing: .14em; font-size: .65rem; font-weight: 600; }
.stay-summary > strong { font: 500 1.2rem var(--serif); }
.stay-summary > small { color: #60797f; font-size: .85rem; }
.itinerary-planner { margin: 2rem 0; }
#itinerary-builder { padding: clamp(1.3rem, 4vw, 2.5rem); border-radius: 1.2rem; color: white; background: linear-gradient(145deg, #043d49, #007f91); }
.planner-heading > span { color: var(--sun); text-transform: uppercase; letter-spacing: .15em; font-size: .68rem; font-weight: 600; }
.planner-heading h3 { margin: .55rem 0 !important; color: white; font-size: clamp(2rem, 4vw, 3rem) !important; }
.planner-heading p { margin: 0 0 1.5rem; color: rgba(255,255,255,.72) !important; font-size: .93rem !important; }
.planner-controls { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }
.planner-controls label > span { display: block; margin-bottom: .4rem; color: #a9eee5; text-transform: uppercase; letter-spacing: .1em; font-size: .68rem; }
.planner-controls select { width: 100%; padding: .85rem; border: 1px solid rgba(255,255,255,.25); border-radius: .5rem; color: var(--ink); background: white; }
#itinerary-builder fieldset { margin: 1.7rem 0; padding: 0; border: 0; }
#itinerary-builder legend { margin-bottom: .8rem; color: white; font: 500 1.2rem var(--serif); }
.interest-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; }
.interest-grid label { cursor: pointer; }
.interest-grid input { position: absolute; opacity: 0; pointer-events: none; }
.interest-grid label span { display: block; padding: .8rem; border: 1px solid rgba(255,255,255,.2); border-radius: .55rem; color: rgba(255,255,255,.72); background: rgba(255,255,255,.06); font-size: .78rem; }
.interest-grid input:checked + span { border-color: var(--sun); color: var(--ink); background: var(--sun); }
.interest-grid input:focus-visible + span { outline: 3px solid white; outline-offset: 2px; }
#itinerary-builder .primary-button { background: var(--coral); }
.itinerary-output { scroll-margin-top: 8rem; margin-top: 1.5rem; padding: clamp(1.3rem, 4vw, 2.5rem); border: 1px solid var(--line); border-radius: 1.2rem; background: #fff; box-shadow: 0 22px 55px rgba(3,61,73,.1); }
.itinerary-output > header { display: grid; grid-template-columns: 8rem 1fr; gap: 1.5rem; align-items: center; padding-bottom: 1.5rem; border-bottom: 2px solid var(--gold); }
.itinerary-output > header img { width: 100%; mix-blend-mode: multiply; }
.itinerary-output > header span { color: #9a7438; text-transform: uppercase; letter-spacing: .15em; font-size: .68rem; }
.itinerary-output > header h3 { margin: .35rem 0 !important; font-size: clamp(1.8rem, 4vw, 2.8rem) !important; }
.itinerary-output > header p { margin: 0; color: #637c82; font-size: .84rem; }
.plan-days { display: grid; gap: .8rem; margin: 1.5rem 0; }
.plan-days article { padding: 1.1rem; border-radius: .7rem; background: #effaf6; }
.plan-days h4 { margin: 0 0 .75rem; font: 500 1.3rem var(--serif); }
.plan-days h4 span { margin-right: .7rem; color: var(--ocean); font: 600 .68rem var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.plan-days ul { margin: 0; padding: 0; list-style: none; }
.plan-days li { display: grid; grid-template-columns: 5rem 1fr; gap: .7rem; padding: .4rem 0; color: #4f6d73; font-size: .87rem; line-height: 1.45; }
.plan-days li span { color: #9a7438; text-transform: uppercase; letter-spacing: .08em; font-size: .62rem; font-weight: 600; }
.plan-notes { padding: 1.2rem; border: 1px dashed #9ab9b4; border-radius: .7rem; }
.plan-notes h4 { margin: 0; font: 500 1.25rem var(--serif); }
.plan-notes li, .plan-notes p { font-size: .82rem; line-height: 1.55; }
.planner-actions { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin-top: 1rem; }
.planner-actions button { padding: .9rem 1.1rem; border: 0; border-radius: 999px; color: white; background: var(--ocean); font-weight: 600; cursor: pointer; }
.planner-actions a { font-size: .85rem; }

/* Itinerary planner — a working travel surface, not a generic article. */
.itinerary-page .itinerary-hero { min-height: 34rem; }
.itinerary-page .itinerary-hero .guide-hero-inner { padding-bottom: 4.2rem; }
.itinerary-page .itinerary-hero h1 { max-width: 54rem; font-size: clamp(3.2rem, 6.5vw, 6.2rem); }
.itinerary-page .itinerary-article { padding-top: clamp(3.5rem, 7vw, 6rem); }
.planner-controls-three { grid-template-columns: repeat(3, 1fr); }
#itinerary-builder { position: relative; overflow: hidden; box-shadow: 0 22px 60px rgba(3,61,73,.18); }
#itinerary-builder::after { content: ""; position: absolute; right: -7rem; top: -8rem; width: 18rem; height: 18rem; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; pointer-events: none; }
#itinerary-builder .primary-button { position: relative; z-index: 1; }
.plan-overview { display: grid; grid-template-columns: 1fr .7fr auto; gap: 1rem; align-items: center; margin: 1.5rem 0; padding: 1rem 1.1rem; border-radius: .8rem; background: linear-gradient(115deg, #073a4a, #087f8e); color: white; }
.plan-overview span, .plan-overview strong { display: block; }
.plan-overview span { margin-bottom: .25rem; color: #9edbd5; font-size: .66rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.plan-overview strong { font-size: .9rem; }
.plan-overview a { padding: .7rem .9rem; border: 1px solid rgba(255,255,255,.35); border-radius: 999px; color: white; text-decoration: none; white-space: nowrap; font-size: .78rem; }
.plan-days { counter-reset: plan-day; }
.plan-days article { padding: 1.25rem; border: 1px solid #d5e9e4; background: linear-gradient(145deg, #f3fcf9, #e4f7f1); }
.plan-days article > header { display: flex; justify-content: space-between; align-items: start; gap: 1rem; padding-bottom: .9rem; border-bottom: 1px solid #c9dfda; }
.plan-days article > header span { color: #9a7438; font-size: .65rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.plan-days article > header h4 { margin: .25rem 0 .2rem; color: var(--ink); font-size: 1.55rem; }
.plan-days article > header p { margin: 0; color: #617d82; font-size: .75rem; }
.plan-days article > header > a { flex: none; padding: .55rem .7rem; border-radius: 999px; color: white; background: var(--ocean); text-decoration: none; font-size: .72rem; }
.plan-days li { grid-template-columns: 4.5rem 1fr; gap: .9rem; padding: .85rem 0; border-bottom: 1px solid rgba(7,58,74,.1); }
.plan-days li > span { padding-top: .2rem; }
.plan-days li strong, .plan-days li small { display: block; }
.plan-days li strong { color: var(--ink); font-size: .98rem; }
.plan-days li small { margin-top: .15rem; color: #6c858a; font-size: .72rem; }
.plan-days li p { margin: .45rem 0 .55rem; color: #536f75; font-size: .78rem; line-height: 1.5; }
.plan-days li button, .place-card button { padding: 0; border: 0; color: var(--ocean); background: transparent; cursor: pointer; font-size: .74rem; font-weight: 600; text-decoration: underline; text-underline-offset: .2rem; }
.plan-days li a { margin-left: .8rem; font-size: .74rem; }
.day-tip { margin: .8rem 0 0 !important; padding: .75rem .85rem; border-left: 3px solid var(--gold); color: #526e74 !important; background: rgba(255,255,255,.7); font-size: .77rem !important; line-height: 1.5 !important; }
.secondary-plan-button { border: 1px solid #a8c4c0 !important; color: var(--ink) !important; background: white !important; }
.island-map-shell { margin-top: 1.7rem; overflow: hidden; border: 1px solid var(--line); border-radius: 1.2rem; background: #eaf7f3; box-shadow: 0 18px 45px rgba(3,61,73,.1); }
.map-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.2rem 1.3rem; }
.map-heading span { color: #9a7438; font-size: .66rem; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; }
.map-heading h3 { margin: .25rem 0 !important; color: var(--ink); font-size: 1.65rem !important; }
.map-heading p { margin: 0; color: #668087; font-size: .78rem; }
.map-heading a { flex: none; padding: .7rem .9rem; border-radius: 999px; color: white; background: var(--ocean); text-decoration: none; font-size: .78rem; }
.island-map-shell iframe { display: block; width: 100%; height: 27rem; border: 0; background: #d5ebe5; }
.place-filters { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.6rem 0; }
.place-filters button { padding: .65rem .85rem; border: 1px solid #b9d0cc; border-radius: 999px; color: #46656d; background: white; cursor: pointer; font-size: .78rem; font-weight: 600; }
.place-filters button.active { border-color: var(--ocean); color: white; background: var(--ocean); }
.place-directory { display: grid; grid-template-columns: repeat(2, 1fr); gap: .8rem; }
.place-card { display: flex; flex-direction: column; min-height: 17rem; padding: 1.25rem; border: 1px solid #d8e6e3; border-radius: 1rem; background: linear-gradient(145deg, #fff, #f0faf6); box-shadow: 0 10px 25px rgba(3,61,73,.06); }
.place-card-top { display: flex; justify-content: space-between; gap: .8rem; }
.place-card-top span { color: #9a7438; font-size: .65rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.place-card-top small { color: #6c8489; font-size: .7rem; }
.place-card h3 { margin: 1rem 0 .2rem; color: var(--ink); font-size: 1.45rem; }
.place-card .place-address { margin: 0; color: var(--ocean); font-size: .73rem; font-weight: 600; }
.place-card > p:not(.place-address) { margin: .8rem 0 1rem; color: #587279; font-size: .82rem; line-height: 1.55; }
.place-card > div:last-child { margin-top: auto; }
.place-card a { margin-left: .9rem; font-size: .74rem; }
.planning-rules strong { min-width: 0; }
.related { padding: clamp(4rem, 8vw, 7rem) max(1.25rem, calc((100vw - 74rem) / 2)); background: linear-gradient(135deg, #fff5dc, #ddf8f0); }
.related h2 { max-width: 45rem; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-top: 2.5rem; }
.related-grid a { min-height: 14rem; display: flex; flex-direction: column; padding: 1.5rem; border: 0; border-radius: 1.2rem; background: white; box-shadow: 0 16px 40px rgba(3,61,73,.1); text-decoration: none; }
.related-grid a > span { color: #9a7438; text-transform: uppercase; letter-spacing: .14em; font-size: .66rem; }
.related-grid strong { margin-top: 2.5rem; font: 500 1.5rem/1.18 var(--serif); }
.related-grid b { margin-top: auto; color: var(--ocean); font-size: .84rem; }
.page-cta { display: flex; justify-content: space-between; align-items: end; gap: 3rem; padding: clamp(4rem, 8vw, 7rem) max(1.25rem, calc((100vw - 74rem) / 2)); color: white; background: var(--ink); }
.page-cta .eyebrow { color: #83cbc4; }
.page-cta h2 { margin-bottom: .7rem; }
.page-cta p:not(.eyebrow) { max-width: 40rem; color: rgba(255,255,255,.65); line-height: 1.7; }
.page-cta > a { flex: none; display: flex; gap: 1rem; padding: 1rem 1.25rem; border-radius: 999px; color: var(--ink); background: #efce8b; text-decoration: none; font-weight: 600; }

/* Approved itinerary-led visual system for every interior page */
.guide-main { padding-top: 0; background: linear-gradient(145deg, #fffdf9 0%, #f8efe1 48%, #e9f6fb 100%); }
.guide-hero { min-height: 40rem; background: linear-gradient(90deg, rgba(13,55,86,.78) 0%, rgba(18,115,158,.39) 52%, rgba(244,124,104,.07) 80%), url('/assets/skyline-hero.png') center/cover; }
.guide-hero::after { border-color: rgba(231,180,94,.28); }
.breadcrumbs { color: rgba(255,255,255,.72); font-size: .8rem; }
.guide-hero .eyebrow { color: #f2d398; }
.guide-hero h1 { text-shadow: 0 5px 24px rgba(13,55,86,.18); }
.guide-intro { color: rgba(255,255,255,.9); }
.hero-action, .page-cta > a { border: 0; color: white; background: linear-gradient(110deg, #f47c68, #efa95c); box-shadow: 0 12px 28px rgba(244,124,104,.26); }
.hero-action:hover, .hero-action:focus-visible, .page-cta > a:hover, .page-cta > a:focus-visible { color: white; background: linear-gradient(110deg, #f68b77, #f2b66c); transform: translateY(-2px); }
.guide-article { position: relative; }
.guide-aside { border-top-color: #e7b45e; }
.guide-aside > span, .section-label { color: #b47a35; }
.guide-aside a { color: #587481; }
.guide-aside a:hover, .guide-aside a:focus-visible, .guide-aside a[aria-current="page"] { color: #168bb8; }
.guide-content > section { border-bottom-color: rgba(18,58,90,.14); }
.guide-content h2, .guide-content h3, .related h2 { color: #123a5a; }
.guide-content p, .guide-content li { color: #587481; }
.guide-content a { color: #168bb8; }
.guide-content blockquote { border-left-color: #e7b45e; color: #17384a; }
.feature-grid { gap: 1rem; border: 0; background: transparent; }
.feature-grid article { border: 1px solid rgba(18,58,90,.14); border-radius: .95rem; background: rgba(255,255,255,.9); box-shadow: 0 14px 32px rgba(18,58,90,.07); }
.feature-grid article:nth-child(2) { background: linear-gradient(145deg, #fffdf9, #e9f6fb); }
.feature-grid article:nth-child(3) { background: linear-gradient(145deg, #fffdf9, #f8efe1); }
.feature-grid article > span { color: #b47a35; }
.steps strong { color: #123a5a; }
.steps span { color: #587481; }
.check-list li::before { color: #20a99f; }
.area-table { overflow: hidden; border-color: rgba(18,58,90,.14); border-radius: .8rem; background: rgba(255,255,255,.82); box-shadow: 0 12px 28px rgba(18,58,90,.06); }
.table-row.head { background: linear-gradient(110deg, #123a5a, #168bb8); }
.wide-figure img { border: 1px solid rgba(18,58,90,.12); border-radius: .95rem; box-shadow: 0 18px 42px rgba(18,58,90,.1); transition: transform .45s ease, box-shadow .25s ease; }
.wide-figure:hover img { transform: scale(1.01); box-shadow: 0 22px 48px rgba(18,58,90,.14); }
.logo-panel { border: 1px solid rgba(18,58,90,.12); background: linear-gradient(145deg, #fffdf9, #f8efe1 58%, #e9f6fb); }
.page-form { background: rgba(255,255,255,.9); box-shadow: 0 18px 46px rgba(18,58,90,.09); }
.booking-progress li { color: #587481; border-bottom-color: rgba(18,58,90,.18); font-size: .875rem; }
.booking-progress li span { color: #587481; background: #e9f6fb; }
.booking-progress li.active { color: #168bb8; border-color: #20a99f; }
.booking-progress li.active span { color: white; background: #20a99f; }
.booking-progress li.complete { color: #168bb8; border-color: #20a99f; }
.booking-progress li.complete span { color: white; background: #168bb8; }
.choice-grid label > span { min-height: 10rem; border: 1px solid rgba(18,58,90,.14); border-radius: .9rem; background: #fff; box-shadow: 0 10px 28px rgba(18,58,90,.06); }
.choice-grid input:checked + span { border-color: #20a99f; background: #e6f7f5; box-shadow: 0 12px 30px rgba(32,169,159,.13); }
.choice-grid input:focus-visible + span { outline-color: rgba(32,169,159,.5); }
.wizard-actions > button:first-child { border-color: rgba(18,58,90,.24); color: #168bb8; background: white; }
.stay-summary { border-left-color: #20a99f; background: linear-gradient(135deg, #fffdf9, #f8efe1 54%, #e9f6fb); }
.stay-summary > span { color: #b47a35; }

/* The approved planner: light settings, turquoise selections, sunset action. */
#itinerary-builder { color: #17384a; background: linear-gradient(145deg, #fffdf9 0%, #f8efe1 54%, #e9f6fb 100%); border: 1px solid rgba(18,58,90,.14); border-radius: 1rem; box-shadow: 0 22px 58px rgba(18,58,90,.12); }
#itinerary-builder::after { border-color: rgba(74,174,218,.18); }
.planner-heading > span { color: #b47a35; }
.planner-heading h3 { color: #123a5a !important; }
.planner-heading p { color: #587481 !important; font-size: 1rem !important; }
.planner-controls { padding: 1rem; border: 1px solid rgba(18,58,90,.1); border-radius: .8rem; background: rgba(255,255,255,.58); }
.planner-controls label > span { color: #315f76; font-size: .875rem; }
.planner-controls select { border-color: rgba(18,58,90,.2); color: #17384a; background: white; }
.planner-controls select:focus { border-color: #20a99f; box-shadow: 0 0 0 3px rgba(32,169,159,.12); }
#itinerary-builder legend { color: #123a5a; }
.interest-grid label span { min-height: 3rem; display: grid; place-items: center start; border-color: rgba(18,58,90,.16); color: #31596d; background: rgba(255,255,255,.74); font-size: .875rem; }
.interest-grid input:checked + span { border-color: #20a99f; color: #123a5a; background: #e6f7f5; box-shadow: inset 3px 0 #20a99f; }
.interest-grid input:focus-visible + span { outline-color: rgba(32,169,159,.55); }
#itinerary-builder .primary-button { border-radius: .65rem; background: linear-gradient(110deg, #f47c68, #efa95c); box-shadow: 0 10px 26px rgba(244,124,104,.24); }
.itinerary-output { border-color: rgba(18,58,90,.14); border-radius: 1rem; background: rgba(255,255,255,.94); box-shadow: 0 22px 55px rgba(18,58,90,.1); }
.itinerary-output > header { border-bottom-color: #e7b45e; }
.itinerary-output > header span { color: #b47a35; }
.itinerary-output > header h3 { color: #123a5a !important; }
.plan-overview { border-left: 4px solid #20a99f; border-radius: .7rem; background: linear-gradient(110deg, #123a5a, #168bb8); box-shadow: 0 12px 28px rgba(18,58,90,.13); }
.plan-overview span { color: #bcefea; }
.plan-overview a { color: #fff1cf; }
.plan-days article { overflow: hidden; padding: 0; border-color: rgba(18,58,90,.14); border-radius: .9rem; background: white; box-shadow: 0 12px 28px rgba(18,58,90,.07); }
.plan-days article > header { padding: 1.1rem 1.2rem; border-bottom-color: rgba(18,58,90,.12); background: linear-gradient(110deg, #e9f6fb, #f8efe1); }
.plan-days article > header h4, .plan-days li strong { color: #123a5a; }
.plan-days article > header > a { color: #168bb8; background: white; border: 1px solid rgba(22,139,184,.28); }
.plan-days ul, .day-tip { margin-left: 1.2rem !important; margin-right: 1.2rem !important; }
.plan-days li { border-bottom-color: rgba(18,58,90,.1); }
.plan-days li > span { color: #b47a35; font-size: .75rem; }
.plan-days li p { color: #587481; font-size: .875rem; }
.plan-days li button, .place-card button { color: #20a99f; font-size: .875rem; }
.plan-days li a { color: #168bb8; font-size: .875rem; }
.day-tip { margin-bottom: 1.2rem !important; border-left-color: #e7b45e; background: #fffaf1; }
.plan-notes { border-color: rgba(22,139,184,.35); background: #fffdf9; }
.planner-actions button { color: white; background: linear-gradient(110deg, #f47c68, #efa95c); box-shadow: 0 9px 22px rgba(244,124,104,.2); }
.secondary-plan-button { border: 1px solid rgba(22,139,184,.35) !important; color: #168bb8 !important; background: white !important; box-shadow: none !important; }
.island-map-shell { border-color: rgba(18,58,90,.14); background: white; box-shadow: 0 18px 45px rgba(18,58,90,.12); }
.map-heading { position: relative; color: white; background: linear-gradient(110deg, #123a5a, #168bb8); }
.map-heading::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #20a99f; }
.map-heading span { color: #bcefea; }
.map-heading h3 { color: white !important; }
.map-heading p { color: rgba(255,255,255,.75); }
.map-heading a { color: #fff1cf; border: 1px solid rgba(255,241,207,.45); background: transparent; }
.island-map-shell iframe { background: #e9f6fb; }
.place-filters button { min-height: 2.75rem; border-color: rgba(22,139,184,.28); color: #168bb8; background: white; font-size: .875rem; }
.place-filters button.active { border-color: #20a99f; color: white; background: #20a99f; }
.place-card { border-color: rgba(18,58,90,.14); border-radius: .9rem; background: rgba(255,255,255,.93); box-shadow: 0 12px 28px rgba(18,58,90,.07); }
.place-card:nth-child(4n+2), .place-card:nth-child(4n+3) { background: linear-gradient(145deg, #fff, #f8efe1); }
.place-card-top span { color: #b47a35; }
.place-card h3 { color: #123a5a; }
.place-card .place-address { color: #168bb8; }
.place-card > p:not(.place-address) { color: #587481; }
.related { background: linear-gradient(135deg, #e9f6fb 0%, #fffdf9 52%, #f8efe1 100%); }
.related-grid a { border: 1px solid rgba(18,58,90,.14); border-radius: .95rem; background: rgba(255,255,255,.92); box-shadow: 0 16px 38px rgba(18,58,90,.08); }
.related-grid a:hover { transform: translateY(-3px); box-shadow: 0 20px 46px rgba(18,58,90,.13); }
.related-grid a > span { color: #b47a35; }
.related-grid b { color: #20a99f; }
.page-cta { background: linear-gradient(110deg, #123a5a, #167ca5); }
.page-cta .eyebrow { color: #f2d398; }
.page-cta p:not(.eyebrow) { color: rgba(255,255,255,.76); }

@media (max-width: 900px) { .guide-main { padding-top: 0; } .guide-article { grid-template-columns: 1fr; } .guide-aside { position: static; display: grid; grid-template-columns: repeat(2, 1fr); } .guide-aside > span { grid-column: 1/-1; } .feature-grid, .related-grid { grid-template-columns: 1fr; } .feature-grid article { min-height: 0; } .page-cta { align-items: start; flex-direction: column; } .planner-controls-three { grid-template-columns: 1fr 1fr; } .planner-controls-three label:last-child { grid-column: 1/-1; } .plan-overview { grid-template-columns: 1fr 1fr; } .plan-overview > a { grid-column: 1/-1; text-align: center; } }
@media (max-width: 560px) { .guide-hero { min-height: 38rem; } .itinerary-page .itinerary-hero { min-height: 32rem; } .guide-hero-inner { padding: 3rem 0 4rem; } .breadcrumbs { margin-bottom: 2.5rem; } .guide-article { padding: 4rem 0; } .guide-aside { grid-template-columns: 1fr; } .guide-aside > span { grid-column: auto; } .guide-content > section { padding-bottom: 3.5rem; margin-bottom: 3.5rem; } .steps li { grid-template-columns: 1fr; gap: .45rem; } .table-row { grid-template-columns: 1fr; gap: .35rem; } .table-row.head { display: none; } .logo-panel { grid-template-columns: 1fr; } .page-cta > a { align-self: stretch; justify-content: space-between; } .booking-progress li { flex-direction: column; align-items: flex-start; padding: .55rem .2rem; } .choice-grid { grid-template-columns: 1fr; } .choice-grid label > span { min-height: 0; } .planner-controls, .planner-controls-three, .interest-grid, .place-directory, .plan-overview { grid-template-columns: 1fr; } .planner-controls-three label:last-child, .plan-overview > a { grid-column: auto; } .itinerary-output > header { grid-template-columns: 5rem 1fr; } .plan-days article > header, .map-heading { align-items: stretch; flex-direction: column; } .plan-days article > header > a, .map-heading a { text-align: center; } .plan-days li { grid-template-columns: 1fr; gap: .35rem; } .planner-actions { align-items: stretch; flex-direction: column; } .planner-actions button, .planner-actions a { width: 100%; text-align: center; } .island-map-shell iframe { height: 22rem; } }

@media print {
  body * { visibility: hidden !important; }
  #itinerary-output, #itinerary-output * { visibility: visible !important; }
  #itinerary-output { position: absolute; inset: 0; width: 100%; margin: 0; padding: .35in; border: 0; box-shadow: none; }
  #itinerary-output .planner-actions { display: none !important; }
  #itinerary-output .plan-overview a, #itinerary-output a, #itinerary-output button { display: none !important; }
  #itinerary-output .plan-days { grid-template-columns: 1fr 1fr; gap: .15in; }
  #itinerary-output .plan-days article { break-inside: avoid; padding: .12in; border: 1px solid #c9dfda; }
  #itinerary-output .plan-notes { break-inside: avoid; }
  @page { margin: .35in; }
}