:root{ /* Blue — brand primary ramp */ --blue-950:#0D1B45;--blue-900:#172B85;--blue-800:#1E3FAE;--blue-700:#1D4ED8;--blue-600:#2563EB;--blue-500:#3B82F6;--blue-100:#DBEAFE;--blue-50:#EFF5FF; /* Aqua — water ramp */ --aqua-700:#0A7A93;--aqua-600:#0E8DA8;--aqua-500:#17A2BF;--aqua-400:#3FC1DB;--aqua-300:#7FD8E8;--aqua-200:#B8EAF2;--aqua-100:#E3F7FA; /* Orange — CTA accent */ --orange-700:#C2410C;--orange-600:#EA580C;--orange-500:#F97316;--orange-100:#FEEEDD; /* Neutrals — blue-cast grays */ --gray-950:#101823;--gray-800:#25313F;--gray-700:#374558;--gray-500:#5E7086;--gray-400:#94A3B5;--gray-300:#C7D2DE;--gray-200:#E4EAF1;--gray-100:#F2F5F9;--gray-50:#FBFCFE; /* Semantic status */ --success-600:#15803D;--success-100:#DCF3E4;--warning-600:#B45309;--warning-100:#FCEEDC;--error-600:#B91C1C;--error-100:#FBE2E2;--info-600:var(--aqua-600);--info-100:var(--aqua-100); /* Aliases — components use ONLY these; themes override them */ --brand-primary:var(--blue-700);--brand-primary-strong:var(--blue-900);--brand-primary-soft:var(--blue-50);--brand-water:var(--aqua-500);--brand-water-soft:var(--aqua-100); --text-heading:var(--gray-950);--text-body:var(--gray-700);--text-muted:var(--gray-500);--text-inverse:#FFFFFF; --surface-page:#FFFFFF;--surface-tint:var(--gray-100);--surface-card:#FFFFFF;--surface-dark:var(--blue-950); --border-default:var(--gray-200);--border-strong:var(--gray-300);--border-focus:var(--brand-primary); --link:var(--blue-700);--link-hover:var(--blue-900); --cta-bg:var(--orange-500);--cta-bg-hover:var(--orange-600);--cta-text:#FFFFFF; --grad-hero:linear-gradient(160deg,var(--blue-950) 0%,var(--blue-800) 55%,var(--aqua-600) 130%);/* @kind other */ --grad-surface:linear-gradient(180deg,var(--blue-50) 0%,#FFFFFF 100%);/* @kind other */ } /* Swappable client themes — set data-theme on or . Default (no attr) = Bluewater. */ [data-theme="harbor"]{--brand-primary:#0B3954;--brand-primary-strong:#07293D;--brand-primary-soft:#E7F0F6;--brand-water:#17A2BF;--cta-bg:#F5A623;--cta-bg-hover:#DB8E12;--cta-text:#0B1E2B;--link:#0A7A93;--link-hover:#0B3954;--surface-dark:#051D2E;--grad-hero:linear-gradient(160deg,#051D2E 0%,#0B3954 55%,#0E8DA8 130%)/* @kind other */} [data-theme="resort"]{--brand-primary:#0F766E;--brand-primary-strong:#134E4A;--brand-primary-soft:#E6F4F2;--brand-water:#2DD4BF;--cta-bg:#D9A441;--cta-bg-hover:#B9862B;--cta-text:#132A27;--link:#0F766E;--link-hover:#134E4A;--surface-dark:#0B2E2B;--grad-hero:linear-gradient(160deg,#0B2E2B 0%,#0F766E 60%,#2DD4BF 135%)/* @kind other */} :root{ --font-display:'Barlow Condensed',system-ui,sans-serif; --font-body:'Barlow',system-ui,sans-serif; --text-display-xl:clamp(48px,6.5vw,84px);--text-display:clamp(38px,5vw,64px);--text-h1:48px;--text-h2:38px;--text-h3:26px;--text-h4:20px;--text-lg:18px;--text-base:16px;--text-sm:14px;--text-xs:12.5px; --leading-display:0.98;--leading-heading:1.08;--leading-body:1.6; --tracking-display:0.005em;--tracking-caps:0.12em; --weight-regular:400;--weight-medium:500;--weight-semibold:600;--weight-bold:700; } body{font-family:var(--font-body);color:var(--text-body);font-size:var(--text-base);line-height:var(--leading-body);margin:0} h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-heading);line-height:var(--leading-heading);letter-spacing:var(--tracking-display);font-weight:var(--weight-bold);margin:0} h1,h2{text-transform:uppercase} a{color:var(--link);text-decoration:none}a:hover{color:var(--link-hover)} .eyebrow{font-family:var(--font-display);font-weight:var(--weight-semibold);text-transform:uppercase;letter-spacing:var(--tracking-caps);font-size:var(--text-sm);color:var(--brand-water)} :root{ --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px; --container-max:1200px;--container-pad:24px;--section-pad:96px; --radius-sm:6px;--radius-md:10px;--radius-lg:16px;--radius-xl:24px;--radius-pill:999px; } :root{ --shadow-sm:0 1px 2px rgba(7,41,61,.06),0 1px 3px rgba(7,41,61,.08); --shadow-md:0 4px 12px rgba(7,41,61,.10),0 1px 3px rgba(7,41,61,.06); --shadow-lg:0 12px 32px rgba(7,41,61,.14),0 2px 6px rgba(7,41,61,.06); --shadow-focus:0 0 0 3px rgba(23,162,191,.35); --ease-out:cubic-bezier(.16,1,.3,1);/* @kind other */--dur-fast:120ms;/* @kind other */--dur-base:200ms;/* @kind other */ } /* ---- Poolcraft components (ported from _ds_bundle.js) ---- */ .ds-btn{font-family:var(--font-display);font-weight:600;text-transform:uppercase;letter-spacing:.06em;border-radius:var(--radius-md);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;text-decoration:none;transition:all var(--dur-fast) var(--ease-out);line-height:1.2;box-sizing:border-box;border:1px solid transparent;-webkit-appearance:none;appearance:none} .ds-btn-sm{padding:8px 16px;font-size:14px}.ds-btn-md{padding:12px 24px;font-size:16px}.ds-btn-lg{padding:16px 32px;font-size:18px} .ds-btn-full{width:100%} .ds-btn-primary{background:var(--brand-primary);color:#fff}.ds-btn-primary:hover{background:var(--brand-primary-strong);color:#fff;box-shadow:var(--shadow-md);transform:translateY(-1px)} .ds-btn-cta{background:var(--cta-bg);color:var(--cta-text)}.ds-btn-cta:hover{background:var(--cta-bg-hover);color:var(--cta-text);box-shadow:var(--shadow-md);transform:translateY(-1px)} .ds-btn-secondary{background:#fff;color:var(--brand-primary);border-color:var(--border-strong)}.ds-btn-secondary:hover{background:var(--surface-tint);color:var(--brand-primary-strong)} .ds-btn-ghost{background:transparent;color:var(--brand-primary)}.ds-btn-ghost:hover{background:var(--brand-primary-soft);color:var(--brand-primary)} .ds-btn-dark{background:var(--surface-dark);color:#fff;border-color:rgba(255,255,255,.25)}.ds-btn-dark:hover{background:var(--brand-primary-strong);color:#fff;box-shadow:var(--shadow-md);transform:translateY(-1px)} .ds-btn:active{transform:translateY(1px)!important;box-shadow:none!important} .ds-btn:focus-visible{outline:none;box-shadow:var(--shadow-focus)} .ds-input{width:100%;box-sizing:border-box;font-family:var(--font-body);font-size:16px;color:var(--text-heading);background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:12px 14px;outline:none;transition:box-shadow var(--dur-fast) var(--ease-out),border-color var(--dur-fast) var(--ease-out)} .ds-input:focus{border-color:var(--border-focus);box-shadow:var(--shadow-focus)} .ds-input.is-invalid{border-color:var(--error-600)} .ds-badge{font-family:var(--font-display);font-weight:600;text-transform:uppercase;letter-spacing:.08em;font-size:12.5px;padding:4px 12px;border-radius:var(--radius-pill);display:inline-flex;align-items:center;gap:6px;line-height:1.4} .ds-badge-water{background:var(--brand-water-soft);color:var(--aqua-700)}.ds-badge-offer{background:var(--orange-100);color:var(--orange-700)}.ds-badge-success{background:var(--success-100);color:var(--success-600)}.ds-badge-warning{background:var(--warning-100);color:var(--warning-600)}.ds-badge-error{background:var(--error-100);color:var(--error-600)}.ds-badge-neutral{background:var(--surface-tint);color:var(--text-body)}.ds-badge-dark{background:var(--surface-dark);color:#fff} .ds-card{background:var(--surface-card);border:1px solid var(--border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);transition:all var(--dur-base) var(--ease-out);overflow:hidden} .ds-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)} svg.lucide{display:inline-block;vertical-align:middle;flex-shrink:0} [hidden]{display:none!important} /* ---- nav dropdowns (homepage state menus rendered as hover menus) ---- */ .nav-dd{position:relative} .nav-dd>.nav-menu-wrap{display:none} .nav-dd:hover>.nav-menu-wrap,.nav-dd:focus-within>.nav-menu-wrap{display:block} .nav-dd:hover>.nav-menu,.nav-dd:focus-within>.nav-menu{display:flex} .nav-dd:hover>.nav-grid,.nav-dd:focus-within>.nav-grid{display:grid;grid-template-columns:1fr 1fr} /* ---- mobile nav ---- */ .nav-burger{display:none;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--border-default);border-radius:var(--radius-md);background:#fff;color:var(--brand-primary);cursor:pointer;margin-left:auto;flex-shrink:0} .drawer{position:fixed;inset:0;z-index:200} .drawer-scrim{position:absolute;inset:0;background:rgba(13,27,69,.55)} .drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(360px,88vw);background:#fff;box-shadow:var(--shadow-lg);padding:18px 20px 28px;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column;gap:14px} .drawer-scrim{touch-action:none} .modal-wrap>div{overscroll-behavior:contain} .drawer-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--border-default)} .drawer-close{width:40px;height:40px;border:1px solid var(--border-default);border-radius:var(--radius-md);background:#fff;color:var(--text-body);cursor:pointer;display:inline-flex;align-items:center;justify-content:center} .drawer-nav{display:flex;flex-direction:column;gap:2px;flex:1} .drawer-nav>a,.drawer-nav .nav-dd>a,.drawer-nav .nav-dd>span{display:flex!important;padding:12px 6px!important;font-size:16px!important;color:var(--text-heading)!important} .drawer-nav .nav-dd>a svg,.drawer-nav .nav-dd>span svg{display:none} .drawer-nav .nav-menu-wrap,.drawer-nav .nav-menu{display:flex!important;flex-direction:column!important;position:static!important;box-shadow:none!important;border:0!important;padding:0 0 8px 14px!important;min-width:0!important;grid-template-columns:1fr!important} .drawer-nav .nav-menu-wrap>div{position:static!important;box-shadow:none!important;border:0!important;padding:0!important;min-width:0!important;display:flex!important;flex-direction:column!important;grid-template-columns:1fr!important} .drawer-nav .nav-menu a,.drawer-nav .nav-menu-wrap a{padding:9px 10px!important;font-size:15px!important;text-transform:none!important;letter-spacing:0!important} /* ---- modal ---- */ body.modal-open,body.drawer-open{overflow:hidden;position:fixed;left:0;right:0;width:100%} /* ---- demo form thanks ---- */ .form-thanks{text-align:center;padding:18px 6px} .form-thanks h4{font-size:22px;margin:10px 0 6px;text-transform:uppercase} .form-thanks p{margin:0;font-size:15px;color:var(--text-body)} .form-thanks svg{color:var(--brand-water)} /* ---- rotating word ---- */ .rot-word{display:inline-block;animation:wordIn .5s var(--ease-out)}