:root{--ink:#17201e;--green:#173b34;--mint:#dce9df;--cream:#f4efe7;--paper:#fbfaf6;--orange:#f47a3c;--line:rgba(23,32,30,.16);--white:#fff;--muted:#66716e;--radius:28px}
*{box-sizing:border-box}html{scroll-behavior:smooth;overflow-x:hidden}body{margin:0;background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased}.skip{position:fixed;left:12px;top:-60px;z-index:100;background:var(--white);padding:12px 18px;color:#111}.skip:focus{top:12px}button,a{font:inherit}.site-header{height:82px;padding:0 clamp(22px,5vw,78px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(251,250,246,.94);position:sticky;top:0;z-index:40;backdrop-filter:blur(14px)}.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}.brand img{width:38px;height:38px;object-fit:contain}.brand span{display:flex;flex-direction:column}.brand b{font-family:Georgia,serif;font-size:21px;line-height:1}.brand small{font-size:8px;letter-spacing:.17em;margin-top:5px}.site-header nav{display:flex;gap:34px}.site-header nav a{color:var(--muted);text-decoration:none;font-size:14px;padding:31px 0 27px;border-bottom:3px solid transparent}.site-header nav a:hover,.site-header nav a.active{color:var(--ink);border-color:var(--orange)}.header-book,.primary,.light-button{border:0;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:14px;background:var(--green);color:#fff;padding:14px 20px;border-radius:100px;font-weight:700;cursor:pointer}.header-book span{color:#9fd5c2}.hero{min-height:680px;display:grid;grid-template-columns:1.02fr .98fr;background:var(--cream);overflow:hidden}.hero-copy{padding:clamp(70px,9vw,132px) clamp(32px,7vw,112px);align-self:center;min-width:0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.2em;color:var(--orange);margin:0 0 24px}.hero h1,.section-heading h2,.club-band h2,.faq h2,.modal-content h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.045em}.hero h1{font-size:clamp(54px,6vw,94px);line-height:.92;margin:0;max-width:720px}.hero h1 em{font-weight:400;color:var(--green)}.hero-lede{font-size:18px;line-height:1.65;color:#4f5b58;max-width:630px;margin:32px 0}.hero-actions{display:flex;align-items:center;gap:28px}.text-link{color:var(--ink);font-weight:700;text-decoration:none;border-bottom:1px solid var(--ink);padding:6px 0}.hero-proof{display:flex;gap:0;margin-top:70px;border-top:1px solid var(--line);padding-top:23px}.hero-proof span{display:flex;flex-direction:column;min-width:155px;padding-right:24px;margin-right:24px;border-right:1px solid var(--line)}.hero-proof span:last-child{border:0}.hero-proof b{font-size:13px}.hero-proof small{font-size:11px;color:var(--muted);margin-top:5px}.hero-art{position:relative;min-height:680px;background:linear-gradient(145deg,#bed0c7,#7ba291);overflow:hidden}.sun{position:absolute;width:360px;height:360px;border-radius:50%;right:-70px;top:-40px;background:#f4b276;filter:blur(1px)}.tower{position:absolute;bottom:-20px;background:linear-gradient(90deg,rgba(0,0,0,.18),rgba(255,255,255,.14));border-radius:34px 34px 0 0;box-shadow:inset 16px 0 rgba(255,255,255,.08)}.tower:after{content:"";position:absolute;inset:9% 18%;background:repeating-linear-gradient(0deg,rgba(244,239,231,.5) 0 8px,transparent 8px 29px)}.tower.one{height:76%;width:23%;left:4%;transform:skewY(6deg)}.tower.two{height:94%;width:29%;left:30%;background:linear-gradient(90deg,#244b42,#779489)}.tower.three{height:66%;width:30%;right:0;transform:skewY(-5deg)}.offer-ticket{position:absolute;right:8%;bottom:13%;width:min(330px,70%);aspect-ratio:1.25;background:rgba(251,250,246,.95);padding:28px;border-radius:20px;box-shadow:0 26px 70px rgba(14,42,34,.3);transform:rotate(-4deg);display:flex;flex-direction:column}.offer-ticket:before,.offer-ticket:after{content:"";position:absolute;top:44%;width:24px;height:24px;background:#6e9686;border-radius:50%}.offer-ticket:before{left:-12px}.offer-ticket:after{right:-12px}.offer-ticket span{font-size:9px;letter-spacing:.18em;font-weight:800;color:var(--orange)}.offer-ticket>b{font-family:Georgia,serif;font-size:88px;line-height:1;margin-top:18px;color:var(--green)}.offer-ticket>b small{font-family:Arial;font-size:13px;letter-spacing:.2em;margin-left:6px}.offer-ticket p{font-size:16px;font-weight:700;margin:auto 0 17px}.offer-ticket i{font-style:normal;font-size:8px;letter-spacing:.24em;border-top:1px dashed var(--line);padding-top:13px}.art-caption{position:absolute;top:36px;left:36px;color:white;font-family:Georgia,serif;font-size:20px}.offer-shell,.how-it-works,.faq{padding:110px clamp(24px,6vw,96px)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:60px;margin-bottom:50px}.section-heading h2{font-size:clamp(44px,5vw,72px);line-height:1;margin:0}.section-heading>p{width:470px;margin:0;color:var(--muted);line-height:1.7}.filter-row{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:34px}.filter-row button{border:1px solid var(--line);background:transparent;border-radius:100px;padding:11px 17px;color:var(--muted);cursor:pointer}.filter-row button.active,.filter-row button:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.offer-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:22px}.offer-card{grid-column:span 4;border:1px solid var(--line);background:var(--white);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-height:535px;transition:.3s transform,.3s box-shadow}.offer-card:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(23,32,30,.12)}.offer-card.featured{grid-column:span 8;display:grid;grid-template-columns:1.05fr .95fr}.card-art{min-height:235px;background:var(--mint);position:relative;overflow:hidden;padding:24px}.card-art:before{content:"";position:absolute;width:260px;height:260px;border:55px solid rgba(255,255,255,.42);border-radius:50%;right:-75px;bottom:-110px}.offer-card:nth-child(2n) .card-art{background:#efd7c2}.offer-card:nth-child(3n) .card-art{background:#c9d7e7}.offer-card:nth-child(4n) .card-art{background:#d9cfeb}.featured .card-art{min-height:100%;background:var(--green)}.featured .card-art:before{width:430px;height:430px;border-color:rgba(244,122,60,.5);right:-140px;bottom:-155px}.card-art>span{position:relative;z-index:1;font-size:10px;font-weight:800;letter-spacing:.17em}.featured .card-art>span{color:#fff}.card-value{position:absolute;left:24px;bottom:24px;font-family:Georgia,serif;font-size:72px;line-height:.9;color:var(--green);z-index:1}.featured .card-value{color:#fff;font-size:102px}.card-value small{font-family:Arial;font-size:11px;letter-spacing:.18em;margin-left:6px}.card-lock{position:absolute;right:22px;top:20px;background:rgba(255,255,255,.8);padding:9px 12px;border-radius:100px;font-size:10px;font-weight:800}.card-content{padding:28px;display:flex;flex-direction:column;flex:1}.card-meta{display:flex;justify-content:space-between;align-items:center;color:var(--orange);font-size:10px;font-weight:800;letter-spacing:.13em}.card-content h3{font-family:Georgia,serif;font-size:34px;line-height:1.05;font-weight:400;margin:22px 0 14px}.card-content p{color:var(--muted);line-height:1.6;margin:0}.card-facts{display:flex;gap:14px;flex-wrap:wrap;margin:24px 0}.card-facts span{font-size:11px;background:var(--cream);padding:8px 10px;border-radius:8px}.card-actions{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:20px;border-top:1px solid var(--line)}.card-actions button{border:0;background:transparent;font-weight:800;cursor:pointer;padding:7px 0;min-height:44px;display:inline-flex;align-items:center}.card-actions a{font-size:12px;color:var(--green);font-weight:800;text-decoration:none;min-height:44px;display:inline-flex;align-items:center}.offer-skeleton{grid-column:span 4;min-height:520px;border-radius:var(--radius);background:linear-gradient(100deg,#eee 30%,#fafafa 50%,#eee 70%);background-size:300% 100%;animation:load 1.2s infinite}@keyframes load{to{background-position:-150% 0}}.empty{text-align:center;padding:60px;border:1px dashed var(--line);border-radius:24px}.club-band{background:var(--green);color:white;min-height:570px;padding:90px clamp(25px,7vw,110px);display:grid;grid-template-columns:.65fr 1.2fr .55fr;gap:75px;align-items:center}.club-band .eyebrow{color:#f2a170}.club-band h2{font-size:clamp(45px,5vw,72px);margin:0 0 24px;line-height:1}.club-band p:not(.eyebrow){color:#c7d6d1;line-height:1.7;max-width:630px}.club-benefits{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.club-benefits span{border:1px solid rgba(255,255,255,.22);border-radius:100px;padding:10px 14px;font-size:12px}.light-button{background:white;color:var(--green);align-self:end;margin-bottom:60px}.club-orbit{width:220px;height:220px;border:1px solid rgba(255,255,255,.35);border-radius:50%;position:relative;display:grid;place-items:center}.club-orbit:before{content:"";position:absolute;inset:31px;border:1px solid rgba(255,255,255,.2);border-radius:50%}.club-orbit>span{font-family:Georgia,serif;font-size:70px;width:105px;height:105px;background:var(--orange);border-radius:50%;display:grid;place-items:center;z-index:1}.club-orbit i{position:absolute;width:12px;height:12px;background:#dbe9e2;border-radius:50%}.club-orbit i:nth-child(2){top:7px}.club-orbit i:nth-child(3){bottom:16px;left:27px}.club-orbit i:nth-child(4){right:9px;top:110px}.section-heading.compact{margin-bottom:55px}.steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.steps article{padding:28px 30px 20px 0;border-right:1px solid var(--line);min-height:260px}.steps article+article{padding-left:30px}.steps article:last-child{border:0}.steps span{color:var(--orange);font-size:11px;font-weight:800}.steps h3{font-family:Georgia,serif;font-size:28px;font-weight:400;margin:42px 0 14px}.steps p{font-size:14px;line-height:1.65;color:var(--muted)}.faq{background:var(--cream);display:grid;grid-template-columns:.8fr 1.2fr;gap:100px}.faq h2{font-size:57px;line-height:1;margin:0 0 24px}.faq>div>p:not(.eyebrow){color:var(--muted);line-height:1.6}.faq>div>a{color:var(--green);font-weight:800}.accordions details{border-top:1px solid var(--line);padding:23px 0}.accordions details:last-child{border-bottom:1px solid var(--line)}.accordions summary{font-family:Georgia,serif;font-size:23px;cursor:pointer;list-style:none;display:flex;justify-content:space-between}.accordions summary:after{content:"+"}.accordions details[open] summary:after{content:"−"}.accordions details p{color:var(--muted);line-height:1.65;padding-right:50px}footer{padding:70px clamp(25px,6vw,95px) 32px;background:#111b18;color:white;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:60px}footer .brand{color:white}footer>div:not(.brand){display:flex;flex-direction:column;gap:12px}footer>div>b{font-size:12px;color:#96aaa4;margin-bottom:8px}footer a{color:#fff;text-decoration:none;font-size:13px}footer>p{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:25px;color:#7f928c;font-size:11px}.modal{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:18px}.modal[hidden]{display:none}.modal-backdrop{position:absolute;inset:0;background:rgba(8,16,14,.72);backdrop-filter:blur(8px)}.modal-card{position:relative;background:var(--paper);max-width:950px;width:100%;max-height:92vh;overflow:auto;border-radius:30px;display:grid;grid-template-columns:.75fr 1.25fr;box-shadow:0 30px 90px #0008}.modal-close{position:absolute;right:18px;top:15px;width:40px;height:40px;border:0;background:var(--white);border-radius:50%;font-size:25px;z-index:2;cursor:pointer}.modal-visual{background:var(--green);color:#fff;min-height:600px;padding:38px;display:flex;flex-direction:column}.modal-visual span{font-size:10px;letter-spacing:.16em;font-weight:800}.modal-visual b{font-family:Georgia,serif;font-size:95px;margin:auto 0}.modal-visual i{font-style:normal;font-size:9px;letter-spacing:.18em}.modal-content{padding:60px}.modal-content h2{font-size:52px;line-height:1;margin:0 0 22px}.modal-summary{color:var(--muted);font-size:17px;line-height:1.7}.modal-facts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:27px 0}.modal-facts span{background:var(--cream);border-radius:12px;padding:13px;font-size:12px}.modal-content details{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0}.modal-content summary{font-weight:800;cursor:pointer}.modal-content details p{font-size:12px;line-height:1.6;color:var(--muted)}.modal-actions{display:flex;gap:11px;margin-top:27px}.modal-actions a,.modal-actions button{border:1px solid var(--green);border-radius:100px;padding:14px 18px;text-decoration:none;font-weight:800;cursor:pointer}.modal-actions .book-offer{background:var(--green);color:#fff}.modal-actions .copy-code{background:transparent;color:var(--green)}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,120px);background:#101b18;color:#fff;padding:13px 20px;border-radius:100px;z-index:120;transition:.3s}.toast.show{transform:translate(-50%,0)}
@media(max-width:1050px){.site-header nav{display:none}.hero{grid-template-columns:1fr}.hero-art{min-height:520px}.offer-card{grid-column:span 6}.offer-card.featured{grid-column:span 12}.club-band{grid-template-columns:.5fr 1.5fr}.club-band .light-button{grid-column:2}.steps{grid-template-columns:1fr 1fr}.steps article:nth-child(2){border-right:0}.faq{gap:50px}.modal-card{grid-template-columns:1fr}.modal-visual{min-height:240px}.modal-visual b{margin:auto 0 0}.modal-visual i{display:none}}
@media(max-width:700px){.site-header{height:70px;padding:0 16px}.header-book{padding:11px 14px;font-size:12px}.brand b{font-size:18px}.brand small{display:none}.hero-copy{padding:68px 22px}.hero h1{font-size:52px}.hero-lede{font-size:16px}.hero-actions{align-items:flex-start;flex-direction:column}.hero-proof{overflow:auto;margin-top:45px}.hero-proof span{min-width:140px}.hero-art{min-height:430px}.offer-ticket{right:10%;bottom:10%;width:75%;padding:22px}.offer-ticket>b{font-size:72px}.offer-shell,.how-it-works,.faq{padding:75px 20px}.section-heading{display:block}.section-heading h2{font-size:45px}.section-heading>p{width:auto;margin-top:24px}.filter-row{overflow:auto;flex-wrap:nowrap;padding-bottom:6px}.filter-row button{white-space:nowrap}.offer-grid{display:block}.offer-card,.offer-card.featured{display:flex;margin-bottom:18px;min-height:500px}.featured .card-art{min-height:260px}.featured .card-value{font-size:75px}.club-band{display:block;padding:70px 24px}.club-orbit{width:160px;height:160px;margin-bottom:45px}.club-orbit>span{width:76px;height:76px;font-size:50px}.club-band h2{font-size:45px}.club-band .light-button{margin:30px 0 0}.steps{display:block}.steps article{border-right:0;border-bottom:1px solid var(--line);min-height:auto;padding:26px 0}.steps article+article{padding-left:0}.steps h3{margin:25px 0 10px}.faq{display:block}.faq>div:first-child{margin-bottom:55px}.faq h2{font-size:44px}footer{grid-template-columns:1fr 1fr;gap:38px}footer .footer-brand{grid-column:1/-1}.modal-card{display:block}.modal-visual{min-height:210px}.modal-content{padding:35px 24px}.modal-content h2{font-size:40px}.modal-facts{grid-template-columns:1fr}.modal-actions{flex-direction:column}}

/* One promotional line for the partner catalogue, in place of the per-card discount
   badges those services never had a number for. Built from the same tokens as the rest of
   the page, so it follows the theme instead of freezing at one mode's colours. */
.club-banner{grid-column:1/-1;display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 22px;padding:20px 24px;border:1px solid var(--line);border-left:4px solid var(--orange);border-radius:18px;background:var(--cream);color:var(--ink)}
.club-banner b{font-family:Georgia,serif;font-weight:400;font-size:21px;line-height:1.2}
.club-banner span{color:var(--muted);font-size:14px;line-height:1.55;flex:1 1 320px;min-width:0}
.club-banner a{margin-left:auto;white-space:nowrap;color:var(--green);font-weight:800;text-decoration:none;border-bottom:1px solid var(--green);padding-bottom:2px}
@media(max-width:700px){.club-banner{padding:16px 18px}.club-banner a{margin-left:0}}

/* The partner-service label that occupies the art panel where a discount headline would
   otherwise sit. Deliberately NOT the .card-value treatment (Georgia, 72px, brand green):
   a service is not a price cut, and giving it the same typography is what made "AED 0 OFF"
   look like an offer in the first place. Small spaced caps on a soft chip reads as a label. */
.card-service{position:absolute;left:24px;bottom:24px;z-index:1;max-width:calc(100% - 48px);
  font-family:Arial,Helvetica,sans-serif;font-size:11px;font-weight:800;letter-spacing:.16em;
  text-transform:uppercase;color:var(--green);background:rgba(255,255,255,.72);
  border:1px solid rgba(23,32,30,.10);border-radius:100px;padding:9px 14px;line-height:1}
.featured .card-service{color:#fff;background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.34)}
@media(max-width:700px){.card-service{left:20px;bottom:20px;font-size:10px;padding:8px 12px}}

/* ════════════════════════════════════════════════════════════════════════════
 * 2026-08-05 — Item A. offers.html measured 45 contrast failures in dark mode,
 * worst 1.04:1.
 *
 * Root cause, and it is one cause not forty-five: this file declares its own
 * :root palette (--ink, --cream, --white, --muted, --green, --paper, --line) and
 * platform.css — which loads after it — redefines every one of those names with
 * values that flip between themes. So the page's TEXT follows the theme while
 * its panels do not: the hero ticket, the pastel card-art panels and the lock
 * chip are hard-coded light, and in dark mode they get cream text on cream.
 *
 * The fix is to settle ownership per surface rather than per element. A panel
 * that is light in both themes gets an ink that is dark in both themes; a panel
 * that follows the theme keeps a token that follows it too.
 * ════════════════════════════════════════════════════════════════════════════ */

/* — Surfaces that are light in BOTH themes: pin a dark ink. — */
.offer-ticket,                    /* rgba(251,250,246,.95) literal → 1.04:1 in dark */
.card-art,                        /* pastel art panels, literal            */
.card-lock,                       /* rgba(255,255,255,.8) literal          */
.art-caption {                    /* over the #bed0c7→#7ba291 art gradient */
  color: #17201e;                 /* 10.3–15.9:1 on those surfaces          */
}
.card-art > span { color: #17201e; }          /* "CITiHOME PARTNER" — was 1.22:1 */
.featured .card-art,
.featured .card-art > span,
.featured .card-value,
.featured .card-service { color: #fff; }      /* featured art stays brand green */

/* The mint default flipped dark while its three sibling pastels stayed light,
   so one card in four inverted. Pin it to the pastel it was drawn as. */
.card-art { background: #dce9df; }
.offer-card:nth-child(2n) .card-art { background: #efd7c2; }
.offer-card:nth-child(3n) .card-art { background: #c9d7e7; }
.offer-card:nth-child(4n) .card-art { background: #d9cfeb; }
.featured .card-art { background: #3f6459; }

/* Sage green as an ink is 2.9–4.4:1 depending on the theme and the panel.
   On the always-light art panels it is pinned; elsewhere it follows the theme. */
.card-value,
.card-service { color: #2f4c43; }             /* on pastel art: ≥5:1 */
.card-actions a,
.faq > div > a,
.modal-actions .copy-code,
.club-banner a { color: var(--cp-green-ink); }
.club-band,
.modal-visual,
.modal-actions .book-offer { background: #3f6459; }
.modal-actions a, .modal-actions button { border-color: #3f6459; }

/* Copper as an ink is 2.9:1 on white. --cp-accent is the theme's ink-grade
   accent and exists for exactly this. */
.eyebrow,
.card-meta,
.steps span,
.offer-ticket span { color: var(--cp-accent); }

/* Inks that were hard-coded against a surface that now flips. */
.skip { color: var(--cp-ink); }               /* was #111 on a dark chip: 1.28:1 */
.hero-lede { color: var(--cp-muted); }        /* was #4f5b58 on dark cream: 2.22:1 */
.header-book span { color: #cdeadd; }

/* The active filter chip inverted with the theme and took its label with it —
   white on cream in dark mode, 1.13:1. Both halves flip together now. */
.filter-row button.active,
.filter-row button:hover { background: var(--cp-ink); color: var(--cp-sand-50); }

/* Second pass, from the re-measurement: the surfaces above are fixed, these are
   the inks that sit ON them and were still tuned to the old sage. */
.header-book, .primary, .light-button { background: #3f6459; }
.light-button { background: #fff; color: #3f6459; }
.header-book span { color: #cdeadd; }                     /* 5.5:1 on #3f6459 */
.club-band .eyebrow { color: #ffd3b8; }                   /* was 3.18:1 */
.club-band p:not(.eyebrow) { color: #dce7e3; }            /* was 4.39:1 */
/* The hero ticket is pinned light, so its accent and its green must be pinned
   light too — following the theme is exactly what broke them. */
.offer-ticket span { color: #b45309; }                    /* was 2.65:1 */
.offer-ticket > b, .offer-ticket > b small { color: #2f4c43; }  /* was 4.35:1 */

/* Three explicit actions can now live on one card: quick view, the full offer
   page and the booking/member action. Wrapping keeps the controls usable on a
   narrow card without making any of them disappear. */
.card-actions { justify-content: flex-start; gap: 14px; flex-wrap: wrap; }
.card-actions button { color: var(--ink); }
