:root { --ink:#302838; --muted:#746b7d; --canvas:#f7f4f9; --paper:#fff; --line:#e2dce7; --brand:#76518d; --brand-dark:#503663; --soft:#eee6f3; --accent:#b36c8f; --accent-soft:#f7e9ef; }
* { box-sizing:border-box; }
body { margin:0; min-width:320px; color:var(--ink); background:var(--canvas); font-family:Heebo,sans-serif; }.topbar { height:64px; display:flex; align-items:center; justify-content:space-between; padding:0 max(20px,calc((100vw - 1040px)/2)); color:#fff; background:var(--brand-dark); }.brand { display:flex; align-items:center; gap:10px; color:inherit; text-decoration:none; font:600 1.3rem Newsreader,serif; }.brand-mark { width:32px; height:32px; display:grid; place-items:center; border:1px solid rgb(255 255 255 / 45%); border-radius:50%; font-family:Heebo,sans-serif; }.top-actions { display:flex; gap:6px; }.icon-button { width:40px; height:40px; display:grid; place-items:center; color:inherit; border:1px solid rgb(255 255 255 / 25%); border-radius:5px; text-decoration:none; }.icon-button svg { width:19px; }
.tour-shell { width:min(1040px,calc(100% - 28px)); margin:24px auto 48px; overflow:hidden; background:var(--paper); border:1px solid var(--line); border-radius:7px; }.tour-hero { display:flex; align-items:center; justify-content:space-between; gap:28px; padding:42px 48px; color:#fff; background:var(--brand-dark); }.tour-hero h1 { margin:0; font-size:2.15rem; line-height:1.2; letter-spacing:0; }.tour-hero p:last-child { max-width:680px; margin:12px 0 0; color:#eee5f2; font-size:1.02rem; line-height:1.7; }.tour-hero > svg { width:65px; height:65px; flex:0 0 auto; color:#edb6c9; }.eyebrow { margin:0 0 5px; color:var(--brand); font-size:.72rem; font-weight:800; }.tour-hero .eyebrow { color:#e9d8f0; }.tour-intro { display:flex; align-items:end; justify-content:space-between; gap:24px; padding:32px 48px 22px; }.tour-intro h2 { margin:0; font-size:1.55rem; }.tour-intro > p { max-width:500px; margin:0; color:var(--muted); line-height:1.7; }
.tour-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:0 48px 38px; }.tour-card { position:relative; min-height:245px; display:flex; flex-direction:column; align-items:flex-start; padding:22px 20px 18px; color:var(--ink); background:#fcfbfd; border:1px solid var(--line); border-radius:7px; text-decoration:none; transition:transform .2s ease, border-color .2s ease, box-shadow .2s ease; }.tour-card:hover { transform:translateY(-3px); border-color:var(--brand); box-shadow:0 9px 24px rgb(80 54 99 / 12%); }.tour-card.featured { color:#fff; background:var(--brand); border-color:var(--brand); }.tour-card.full-process { background:var(--accent); border-color:var(--accent); }.tour-card > svg { width:28px; height:28px; color:var(--accent); }.tour-card.featured > svg { color:#f3bfd0; }.tour-number { position:absolute; inset-block-start:18px; inset-inline-end:18px; color:var(--muted); font-size:.78rem; font-weight:800; }.tour-card.featured .tour-number { color:#e8d9ed; }.tour-card h3 { margin:20px 0 6px; font-size:1.15rem; }.tour-card p { margin:0; color:var(--muted); line-height:1.65; }.tour-card.featured p { color:#eee5f2; }.tour-card-action { display:inline-flex; align-items:center; gap:7px; margin-top:auto; padding-top:18px; color:var(--brand); font-size:.82rem; font-weight:800; }.tour-card.featured .tour-card-action { color:#fff; }.tour-card-action svg { width:16px; }.tour-note { display:flex; align-items:center; gap:10px; margin:0 48px 34px; padding:13px 15px; color:#59425f; background:var(--accent-soft); border-inline-start:4px solid var(--accent); border-radius:4px; }.tour-note svg { width:19px; flex:0 0 auto; }.tour-note p { margin:0; font-size:.84rem; }
@media(max-width:760px) { .tour-hero { padding:32px 24px; }.tour-hero h1 { font-size:1.85rem; }.tour-intro { align-items:flex-start; flex-direction:column; padding:28px 24px 20px; }.tour-grid { grid-template-columns:repeat(2,minmax(0,1fr)); padding:0 24px 30px; }.tour-note { margin-inline:24px; } }
@media(max-width:480px) { .tour-shell { width:calc(100% - 20px); margin-top:12px; }.tour-hero { padding:26px 18px; }.tour-hero > svg { width:44px; height:44px; }.tour-hero h1 { font-size:1.65rem; }.tour-grid { grid-template-columns:1fr; padding-inline:18px; }.tour-note { margin-inline:18px; }.brand > span:not(.brand-mark) { display:none; } }