@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-air.woff2) format('woff2');font-weight: 300;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-thin.woff2) format('woff2');font-weight: 300;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-light.woff2) format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-regular.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-bold.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Aeonik';src:url(../fonts/aeonik/aeonik-black.woff2) format('woff2');font-weight:900;font-style:normal;font-display:swap}
:root {
  --gold-50: #FAF6EE;
  --gold-100: #F3E9D4;
  --gold-200: #E6D2A6;
  --gold-300: #D5B87C;
  --gold-400: #C29D5A;
  --gold-500: #AA8442;
  --gold-600: #8F6C33;
  --gold-700: #755728;
  --gold-800: #5A4220;
  --gold-900: #3D2D17;
  --white: #FFFFFF;
  --grey-25: #FAFAFA;
  --grey-50: #F4F4F4;
  --grey-100: #EAEAEA;
  --grey-200: #DEDEDE;
  --grey-300: #C4C4C4;
  --grey-400: #A3A3A3;
  --grey-500: #7D7D7D;
  --grey-600: #4F4F4F;
  --grey-700: #3F3F3F;
  --char-950: #111418;
  --char-900: #1A1F25;
  --char-800: #23292F;
  --char-700: #2D3236;
  --char-600: #444A50;
  --ink: #121212;
  --black: #000000;
  --t-xxxl: clamp(44px, 10.57px + 8.571vw, 176px);
  --t-xxl: clamp(36px, 16.69px + 4.952vw, 116px);
  --t-xl: clamp(30px, 21.09px + 2.286vw, 70px);
  --t-l: clamp(26px, 22.29px + 0.952vw, 46px);
  --t-m: clamp(22px, 20.14px + 0.476vw, 32px);
  --t-s: clamp(19px, 18.26px + 0.190vw, 24px);
  --t-xs: clamp(18px, 17.63px + 0.095vw, 21px);
  --t-xxs: clamp(16px, 15.63px + 0.095vw, 19px);
  --t-eyebrow: clamp(15px, 15.37px + -0.095vw, 16px);
  --t-subtitle: clamp(22px, 19.77px + 0.571vw, 34px);
  --t-big: clamp(20px, 18.51px + 0.381vw, 29px);
  --t-base: clamp(17px, 16.63px + 0.095vw, 20px);
  --t-small: clamp(15px, 14.63px + 0.095vw, 17px);
  --t-xsmall: clamp(15px, 15.00px + 0.000vw, 16px);
  --t-button: clamp(15px, 15.00px + 0.000vw, 17px);
  --t-accent: clamp(30px, 20.34px + 2.476vw, 78px);
  --s-3xs: clamp(4px, 3.28px + 0.184vw, 8px);
  --s-2xs: clamp(8px, 6.92px + 0.276vw, 14px);
  --s-xs: clamp(12px, 9.12px + 0.737vw, 28px);
  --s-s: clamp(16px, 11.69px + 1.106vw, 40px);
  --s-m: clamp(24px, 16.81px + 1.843vw, 64px);
  --s-l: clamp(40px, 28.50px + 2.949vw, 104px);
  --s-xl: clamp(64px, 45.31px + 4.793vw, 168px);
  --s-2xl: clamp(96px, 70.12px + 6.636vw, 240px);
  --s-3xl: clamp(128px, 93.49px + 8.848vw, 320px);
  --brand-gold: var(--gold-500);
  --brand-ink: var(--ink);
  --accent-gold: var(--gold-400);
  --text: var(--ink);
  --text-muted: var(--grey-600);
  --text-gold: var(--gold-700);
  --surface: var(--white);
  --surface-soft: var(--grey-50);
  --border: rgba(18, 18, 18, .14);
  --deep: var(--char-900);
  --deep-text: var(--white);
  --deep-muted: var(--grey-400);
  --deep-border: rgba(255, 255, 255, .14);
  --font: 'Aeonik', 'Helvetica Neue', Arial, sans-serif;
  --shell: min(90%, 1760px);
  --gap: clamp(16px, 11.69px + 1.106vw, 40px);
  --inset: clamp(8px, 4.41px + 0.922vw, 28px);
  --r-panel: 8px;
  --r-card: 6px;
  --r-control: 4px;
  --ease: cubic-bezier(.23, 1, .32, 1);
  --ease-in-out: cubic-bezier(.65, 0, .35, 1);
  --d-press: 160ms;
  --d-move: 280ms;
  --d-enter: 900ms;
  --d-mask: 1200ms;
  --foil-gold: linear-gradient(118deg, #86672F 0%, #7E5F2C 40%, #735629 72%, #836430 100%);
  --foil-brand: linear-gradient(118deg, #C7A465 0%, #B89356 40%, #AA8442 72%, #B08B48 100%);
  --foil-deep: linear-gradient(118deg, #6F5226 0%, #5A4220 45%, #4A3519 75%, #634A23 100%);
  --foil-text: linear-gradient(100deg, #755728 0%, #9A7840 34%, #8F6C33 62%, #755728 100%);
  --foil-text-dark: linear-gradient(100deg, #AA8442 0%, #E6D2A6 40%, #C29D5A 62%, #AA8442 100%);
  --tex-gold: url(/wp-content/themes/ocean-church/assets/tex/sand-gold-soft.png);
  --tex-dark: url(/wp-content/themes/ocean-church/assets/tex/grain-dark-soft.png);
  --tex-light: url(/wp-content/themes/ocean-church/assets/tex/grain-light.png);
  --pat-arcs-gold: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2240%22 viewBox=%220 0 80 40%22%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2240%22 fill=%22%231A1F25%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2232%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2224%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2216%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%228%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2240%22 fill=%22%231A1F25%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2240%22 fill=%22%231A1F25%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2240%22 fill=%22%231A1F25%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2232%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2224%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2216%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%228%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.28%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-arcs-ink: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2240%22 viewBox=%220 0 80 40%22%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2240%22 fill=%22%23F4F4F4%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2240%22 fill=%22%23F4F4F4%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2240%22 fill=%22%23F4F4F4%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2240%22 fill=%22%23F4F4F4%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.09%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-arcs-white: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%2280%22 height=%2240%22 viewBox=%220 0 80 40%22%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2240%22 fill=%22%23FFFFFF%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2240%22 fill=%22%23FFFFFF%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2240%22 fill=%22%23FFFFFF%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2280%22 cy=%2220%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2240%22 fill=%22%23FFFFFF%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2232%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2224%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%2216%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3Ccircle cx=%2240%22 cy=%2240%22 r=%228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.07%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-mono-gold: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22120%22 height=%22120%22 viewBox=%220 0 120 120%22%3E%3Cg fill=%22%23C29D5A%22 fill-opacity=%220.16%22%3E%3Csvg x=%2216%22 y=%2216%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3Csvg x=%2276%22 y=%2276%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3C/g%3E%3C/svg%3E");
  --pat-mono-ink: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22120%22 height=%22120%22 viewBox=%220 0 120 120%22%3E%3Cg fill=%22%23121212%22 fill-opacity=%220.05%22%3E%3Csvg x=%2216%22 y=%2216%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3Csvg x=%2276%22 y=%2276%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3C/g%3E%3C/svg%3E");
  --pat-mono-white: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22120%22 height=%22120%22 viewBox=%220 0 120 120%22%3E%3Cg fill=%22%23FFFFFF%22 fill-opacity=%220.09%22%3E%3Csvg x=%2216%22 y=%2216%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3Csvg x=%2276%22 y=%2276%22 width=%2224%22 height=%2224%22 viewBox=%220 0 1000 1000%22%3E%3Cpath d=%22M839.78,129.34c-183.37-171.48-489.75-174.73-675.78-5.61C-16.52,287.86-51.71,550.45,71.87,760.32c118.56,201.34,371.24,286.41,591.88,213.39,245.79-81.34,391.46-365.99,316.68-614.08-26.63-88.36-73.27-167.27-140.65-230.29ZM644.11,863.04c-.37,1.19-4.62,4.12-5.9,4.68-9.67,4.2-32.56,10.33-43.33,12.74-55.26,12.39-120.5,11.81-173.28-9.95-82.49-34.01-140.39-96.89-163.45-183.53-32.81-123.27,35.83-271.71,160.21-311.33,46.73-14.88,111.84-12.37,153.84,15.14,3.11,2.04,17.49,13.04,15.61,16.92-2.87,5.89-14.23,1.45-19.55.84-56.9-6.52-106.98,21.86-144.54,62.66-80.38,87.3-84.01,226.62,4.88,309,48.05,44.53,114.73,72.7,180.26,75.22,9.08,1.32,23.11-1.72,31.55.21,3.24.74,4.62,4.4,3.69,7.39ZM862.87,603.2c-35.34,94.57-116.51,159.83-219.83,158.91-89.49-.8-147.68-58.3-149.12-147.55-.84-51.88,27.17-108.55,88.57-89.39,45.52,14.21,93.5,85.42,143.84,41.45,33.13-28.94,40-89.81,32.4-130.74-21.7-116.82-134.4-190.15-246.53-202.83-141.73-16.02-281.39,61.88-350.48,185-13.13,23.4-19.11,45.35-28.99,69.33-1.52,3.68-5.58,11.31-10.46,9.66-1.25-.42-2.16-6.85-2.17-8.48-.12-18.53,11.03-57.08,16.69-75.94,34.62-115.31,111.53-212.92,224.68-258.8,157.74-63.96,325.01-26.03,433.6,104.72,78.98,95.1,112.05,226.21,67.79,344.66Z%22/%3E%3C/svg%3E%3C/g%3E%3C/svg%3E");
  --pat-ripple-gold: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221400%22 height=%22900%22 viewBox=%220 0 1400 900%22 preserveAspectRatio=%22xMinYMax slice%22%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%2260%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22116%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22172%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22228%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22284%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22340%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22396%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22452%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22508%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22564%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22620%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22676%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22732%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22788%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22844%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22900%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22956%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221012%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221068%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221124%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221180%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221236%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221292%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221348%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221404%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221460%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.13%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-ripple-ink: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221400%22 height=%22900%22 viewBox=%220 0 1400 900%22 preserveAspectRatio=%22xMinYMax slice%22%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%2260%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22116%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22172%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22228%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22284%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22340%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22396%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22452%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22508%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22564%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22620%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22676%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22732%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22788%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22844%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22900%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22956%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221012%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221068%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221124%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221180%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221236%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221292%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221348%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221404%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221460%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.05%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-ripple-white: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221400%22 height=%22900%22 viewBox=%220 0 1400 900%22 preserveAspectRatio=%22xMinYMax slice%22%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%2260%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22116%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22172%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22228%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22284%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22340%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22396%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22452%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22508%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22564%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22620%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22676%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22732%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22788%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22844%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22900%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%22956%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221012%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221068%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221124%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221180%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221236%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221292%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221348%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221404%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3Ccircle cx=%220%22 cy=%22900%22 r=%221460%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.12%22 stroke-width=%221%22/%3E%3C/svg%3E");
  --pat-dots-gold: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221100%22 height=%221100%22 viewBox=%220 0 1100 1100%22%3E%3Ccircle cx=%220%22 cy=%220%22 r=%2264%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 6.72%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22110%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 11.55%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22156%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 16.38%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22202%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 21.21%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22248%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 26.04%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22294%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 30.87%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22340%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 35.7%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22386%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 40.53%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22432%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 45.36%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22478%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 50.19%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22524%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 55.02%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22570%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 59.85%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22616%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 64.68%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22662%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 69.51%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22708%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 74.34%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22754%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 79.17%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22800%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 84.0%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22846%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 88.83%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22892%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 93.66%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22938%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 98.49%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22984%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 103.32%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221030%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 108.15%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221076%22 fill=%22none%22 stroke=%22%23C29D5A%22 stroke-opacity=%220.5%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 112.98%22/%3E%3C/svg%3E");
  --pat-dots-ink: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221100%22 height=%221100%22 viewBox=%220 0 1100 1100%22%3E%3Ccircle cx=%220%22 cy=%220%22 r=%2264%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 6.72%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22110%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 11.55%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22156%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 16.38%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22202%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 21.21%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22248%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 26.04%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22294%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 30.87%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22340%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 35.7%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22386%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 40.53%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22432%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 45.36%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22478%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 50.19%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22524%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 55.02%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22570%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 59.85%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22616%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 64.68%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22662%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 69.51%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22708%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 74.34%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22754%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 79.17%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22800%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 84.0%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22846%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 88.83%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22892%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 93.66%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22938%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 98.49%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22984%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 103.32%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221030%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 108.15%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221076%22 fill=%22none%22 stroke=%22%23121212%22 stroke-opacity=%220.16%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 112.98%22/%3E%3C/svg%3E");
  --pat-dots-white: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%221100%22 height=%221100%22 viewBox=%220 0 1100 1100%22%3E%3Ccircle cx=%220%22 cy=%220%22 r=%2264%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 6.72%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22110%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 11.55%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22156%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 16.38%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22202%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 21.21%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22248%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 26.04%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22294%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 30.87%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22340%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 35.7%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22386%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 40.53%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22432%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 45.36%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22478%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 50.19%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22524%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 55.02%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22570%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 59.85%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22616%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 64.68%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22662%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 69.51%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22708%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 74.34%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22754%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 79.17%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22800%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 84.0%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22846%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 88.83%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22892%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 93.66%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22938%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 98.49%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%22984%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 103.32%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221030%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 108.15%22/%3E%3Ccircle cx=%220%22 cy=%220%22 r=%221076%22 fill=%22none%22 stroke=%22%23FFFFFF%22 stroke-opacity=%220.32%22 stroke-width=%222.2%22 stroke-linecap=%22round%22 stroke-dasharray=%220 112.98%22/%3E%3C/svg%3E");
}
@media (max-width: 767px) { :root { --t-eyebrow: 15px; } }
.t-xxxl { font-family: var(--font); font-weight: 900; font-size: var(--t-xxxl); line-height: 0.86; letter-spacing: -.045em; text-transform: uppercase; text-wrap: balance; }
.t-xxl { font-family: var(--font); font-weight: 900; font-size: var(--t-xxl); line-height: 0.92; letter-spacing: -.035em; text-transform: uppercase; text-wrap: balance; }
.t-xl { font-family: var(--font); font-weight: 500; font-size: var(--t-xl); line-height: 1.02; letter-spacing: -.03em; text-wrap: balance; }
.t-l { font-family: var(--font); font-weight: 500; font-size: var(--t-l); line-height: 1.1; letter-spacing: -.022em; text-wrap: balance; }
.t-m { font-family: var(--font); font-weight: 500; font-size: var(--t-m); line-height: 1.16; letter-spacing: -.015em; text-wrap: balance; }
.t-s { font-family: var(--font); font-weight: 500; font-size: var(--t-s); line-height: 1.25; letter-spacing: -.01em; text-wrap: balance; }
.t-xs { font-family: var(--font); font-weight: 500; font-size: var(--t-xs); line-height: 1.3; letter-spacing: -.005em; }
.t-xxs { font-family: var(--font); font-weight: 500; font-size: var(--t-xxs); line-height: 1.3; letter-spacing: 0; }
.t-eyebrow { font-family: var(--font); font-weight: 500; font-size: var(--t-eyebrow); line-height: 1.2; letter-spacing: .12em; text-transform: uppercase; }
.t-subtitle { font-family: var(--font); font-weight: 300; font-size: var(--t-subtitle); line-height: 1.36; letter-spacing: -.012em; text-wrap: balance; }
.t-big { font-family: var(--font); font-weight: 400; font-size: var(--t-big); line-height: 1.5; letter-spacing: -.008em; }
.t-base { font-family: var(--font); font-weight: 400; font-size: var(--t-base); line-height: 1.62; letter-spacing: 0; }
.t-small { font-family: var(--font); font-weight: 400; font-size: var(--t-small); line-height: 1.58; letter-spacing: 0; }
.t-xsmall { font-family: var(--font); font-weight: 500; font-size: var(--t-xsmall); line-height: 1.5; letter-spacing: .01em; }
.t-button { font-family: var(--font); font-weight: 500; font-size: var(--t-button); line-height: 1; letter-spacing: .08em; text-transform: uppercase; }
.t-accent { font-family: var(--font); font-weight: 300; font-size: var(--t-accent); line-height: 1.14; letter-spacing: -.018em; text-wrap: balance; }
/* weight and colour recipes for headings and statements */
/* 18 Oct: two voices that sit next to each other. Black pairs with Medium; Medium pairs with Light */
.w-air, .w-thin, .w-reg { font-weight: 400; } .w-light { font-weight: 500; }
:is(.t-xl, .t-l, .t-m, .t-s, .t-xs, .t-accent, .t-subtitle, .statement) .w-light { font-weight: 300; }
/* 18 Oct: in a Black heading the gold phrase is the second voice too: Medium in gold, never a second Black */
:is(h1, h2, h3, .t-xxxl, .t-xxl) :is(.gold-solid, .foil) { font-weight: 500; }
.t-accent :is(b, strong, .gold-solid, .ink-solid), .statement :is(b, strong, .gold-solid) { font-weight: 500; }
.w-med { font-weight: 500; } .w-bold { font-weight: 700; } .w-black { font-weight: 900; }
b, strong { font-weight: 500; }
.cap { text-transform: uppercase; }
.fade { color: var(--fade, #8C8C8C); }
/* 17 Oct: no widows. Headings balance their lines; paragraphs never end on a lone word */
h1, h2, h3, h4, .t-accent, .t-subtitle, blockquote { text-wrap: balance; }
p, li, dd { text-wrap: pretty; }
/* an outlined word: the letters drawn as a fine line, for one word in a big heading */
.stroke { font-weight: 500; }
.blk-char .stroke, .blk-ink .stroke, .blk-slate .stroke, .blk-black .stroke, .on-dark .stroke { --stroke-c: rgba(255, 255, 255, .82); }
/* small gold text needs a deeper gold to read: dates, scripture references, live labels */
.gold-small { color: var(--gold-small, var(--gold-800)); }
.blk-char .gold-small, .blk-ink .gold-small, .blk-slate .gold-small, .blk-black .gold-small, .on-dark .gold-small { --gold-small: var(--gold-300); }
.blk-gold .gold-small, .blk-deep .gold-small { --gold-small: var(--white); }
.ink { color: var(--ink); }
.gold-solid { color: var(--gold-solid, var(--gold-600)); }
.foil { background-image: var(--tex-gold), var(--foil-text); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; -webkit-background-clip: text; background-clip: text; color: transparent; }
.blk-char .foil, .blk-photo .foil, .on-dark .foil { background-image: var(--tex-gold), var(--foil-text-dark); }
.blk-gold .foil, .blk-deep .foil { background-image: none; color: var(--gold-100); }
/* a split heading wraps each word in its own box, so the foil has to sit on the words themselves */
.wsplit .foil { background: none; color: inherit; }
.wsplit .foil .w > span { background-image: var(--tex-gold), var(--foil-text); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; -webkit-background-clip: text; background-clip: text; color: transparent; }
.blk-char .wsplit .foil .w > span, .on-dark .wsplit .foil .w > span { background-image: var(--tex-gold), var(--foil-text-dark); }
.num { font-weight: 900; letter-spacing: -.05em; line-height: .88; font-variant-numeric: lining-nums tabular-nums; }

/* grounds: each sets its text, muted, fade, rule, watermark and numeral colours, and its material */
.blk-white { background: var(--white); color: var(--ink); --muted: #444444; --fade: #8C8C8C; --subline: #4A4A4A; --rule: var(--border); --wm: #F3F3F3; --num: var(--gold-600); --gold-solid: var(--gold-600); }
.blk-soft { background-color: var(--grey-50); background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; color: var(--ink); --muted: #474747; --fade: #868686; --subline: #525252; --rule: var(--border); --wm: var(--grey-100); --num: var(--gold-600); --gold-solid: var(--gold-700); }
.blk-char { background-color: var(--char-900); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; color: var(--white); --muted: #BCC1C6; --fade: #858C93; --subline: #B9BEC3; --rule: rgba(255, 255, 255, .14); --rule-gold: rgba(194, 157, 90, .5); --wm: var(--char-700); --num: var(--gold-400); --gold-solid: var(--gold-400); }
.blk-ink { background: var(--ink); color: var(--white); --muted: #B4B4B4; --fade: #828282; --subline: #A0A0A0; --rule: rgba(255, 255, 255, .14); --wm: #1E1E1E; --num: var(--gold-400); --gold-solid: var(--gold-400); }
.blk-gold { background-color: #7E5F2C; background-image: var(--tex-gold), var(--foil-gold); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; color: var(--white); --muted: rgba(255, 255, 255, .94); --fade: var(--gold-100); --subline: rgba(255, 255, 255, .94); --rule: rgba(255, 255, 255, .3); --wm: rgba(40, 28, 10, .2); --num: var(--white); --gold-solid: var(--gold-50); }
.blk-brand { background-color: var(--gold-500); background-image: var(--tex-gold), var(--foil-brand); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; color: var(--ink); --muted: var(--ink); --fade: rgba(18, 18, 18, .66); --subline: rgba(18, 18, 18, .78); --rule: rgba(18, 18, 18, .24); --wm: rgba(60, 40, 0, .18); --num: var(--ink); --gold-solid: var(--ink); }
.blk-deep { background-color: var(--gold-800); background-image: var(--tex-gold), var(--foil-deep); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; color: var(--white); --muted: rgba(255, 255, 255, .88); --fade: var(--gold-300); --subline: rgba(255, 255, 255, .92); --rule: rgba(235, 217, 160, .3); --wm: rgba(255, 236, 170, .06); --num: var(--gold-200); --gold-solid: var(--gold-200); }
.watermark { position: absolute; pointer-events: none; color: var(--wm); z-index: 0; }
.watermark svg { width: 100%; height: auto; display: block; }
.drawn { position: absolute; pointer-events: none; z-index: 0; color: var(--gold-400); opacity: .5; }
.drawn svg { width: 100%; height: auto; display: block; }
.blk-white, .blk-soft, .blk-mist { --gold-small: var(--gold-800); }
.blk-char, .blk-ink, .blk-slate, .blk-black { --gold-small: var(--gold-300); }
.blk-gold, .blk-deep { --gold-small: var(--white); }
.blk-brand { --gold-small: var(--ink); }
.blk-gold :is(p, li, dt, dd, small, span) { text-shadow: 0 1px 2px rgba(40, 28, 10, .34); }
/* 18 Oct: small text on the foil is pure white; pale gold is for display words only */
.blk-gold :is(small, blockquote, .t-small, .t-xsmall, .lab, .role, .muted) { color: #FFFFFF; }
.blk-gold .sub-line { font-weight: 400; color: var(--white); }
.blk-gold dt, .blk-gold .t-eyebrow, .blk-gold .t-xsmall { font-weight: 500; color: var(--white); }
.blk-gold .drawn, .blk-deep .drawn { color: var(--gold-200); opacity: .45; }
.blk-white .drawn, .blk-soft .drawn { color: var(--gold-500); opacity: .35; }
/* pattern layers: put .pat on a positioned block and pick one of the patterns */
.pat { isolation: isolate; } .pat:not(.overlay):not([class*="fixed"]) { position: relative; }
.pat::before { content: ""; position: absolute; inset: 0; pointer-events: none; z-index: -1; background-image: var(--pat); background-size: var(--pat-size, 80px 40px); opacity: var(--pat-o, 1); -webkit-mask-image: var(--pat-mask, none); mask-image: var(--pat-mask, none); }
.pat-arcs { --pat: var(--pat-arcs-ink); }
.blk-white.pat-arcs { --pat: var(--pat-arcs-white); }
.blk-char.pat-arcs, .blk-ink.pat-arcs { --pat: var(--pat-arcs-gold); }
.pat-mono { --pat: var(--pat-mono-ink); --pat-size: 120px 120px; }
.blk-char.pat-mono, .blk-ink.pat-mono, .blk-slate.pat-mono { --pat: var(--pat-mono-gold); }
.blk-gold.pat-mono, .blk-deep.pat-mono { --pat: var(--pat-mono-white); }
.pat-ripple { --pat: var(--pat-ripple-ink); --pat-size: cover; }
.blk-char.pat-ripple, .blk-ink.pat-ripple { --pat: var(--pat-ripple-gold); }
.blk-gold.pat-ripple, .blk-deep.pat-ripple { --pat: var(--pat-ripple-white); }
.pat-grid::before { background-image: repeating-linear-gradient(90deg, var(--rule) 0 1px, transparent 1px calc((100% - 1px) / 6)); background-size: auto; }
.fade-down { --pat-mask: linear-gradient(180deg, #000, transparent 70%); }
.fade-up { --pat-mask: linear-gradient(0deg, #000, transparent 70%); }
.fade-side { --pat-mask: linear-gradient(90deg, transparent, #000 60%); }

/* buttons: the control corner, an icon for the action, a fill that sweeps in */
.btn { position: relative; isolation: isolate; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; gap: .75em; min-height: 3.6em; padding: .95em 1.8em; border-radius: var(--r-control); border: 1px solid transparent; font-family: var(--font); font-size: var(--t-button); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; text-decoration: none; line-height: 1; cursor: pointer; white-space: nowrap; color: var(--btn-fg); background: var(--btn-bg); border-color: var(--btn-line, transparent); transition: color var(--d-move) var(--ease), border-color var(--d-move), transform var(--d-press) var(--ease); }
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--btn-hover); transform: scaleX(0); transform-origin: right; transition: transform 560ms var(--ease); }
.btn:hover::before, .btn:focus-visible::before, .btn.is-hover::before, .btn.is-focus::before { transform: scaleX(1); transform-origin: left; }
.btn:hover, .btn:focus-visible, .btn.is-hover, .btn.is-focus { color: var(--btn-fg-hover, var(--btn-fg)); border-color: var(--btn-line-hover, var(--btn-line, transparent)); }
.btn svg { width: 1.3em; height: 1.3em; flex: none; color: var(--btn-icon, currentColor); transition: transform 420ms var(--ease), color var(--d-move); }
.btn:hover svg, .btn:focus-visible svg { transform: translateX(3px); color: var(--btn-icon-hover, var(--btn-icon, currentColor)); }
.btn:focus-visible, .btn.is-focus { outline: none; }
.btn:active, .btn.is-active { transform: scale(.97); }
.btn-gold { --btn-bg: #B89356; --btn-fg: var(--ink); --btn-hover: var(--ink); --btn-fg-hover: var(--white); --btn-icon-hover: var(--gold-400); }
.btn-black { --btn-bg: var(--ink); --btn-fg: var(--white); --btn-icon: var(--gold-400); --btn-hover: var(--gold-500); --btn-fg-hover: var(--ink); --btn-icon-hover: var(--ink); }
.btn-white { --btn-bg: var(--white); --btn-fg: var(--ink); --btn-icon: var(--gold-600); --btn-hover: var(--ink); --btn-fg-hover: var(--white); --btn-icon-hover: var(--gold-400); }
.btn-outline { --btn-bg: transparent; --btn-fg: var(--ink); --btn-line: rgba(18, 18, 18, .35); --btn-hover: var(--ink); --btn-fg-hover: var(--white); --btn-line-hover: var(--ink); --btn-icon: var(--gold-600); --btn-icon-hover: var(--gold-400); }
.btn-outline-light { --btn-bg: rgba(18, 18, 18, .24); --btn-fg: var(--white); --btn-line: rgba(255, 255, 255, .5); --btn-hover: var(--white); --btn-fg-hover: var(--ink); --btn-line-hover: var(--white); --btn-icon: var(--gold-300); --btn-icon-hover: var(--gold-600); }
/* 18 Oct: gold never touches gold. A gold or white button that lands on a gold ground becomes the white outline */
:is(.blk-gold, .blk-deep, .blk-brand) :is(.btn-gold, .btn-white) { --btn-bg: rgba(40, 28, 10, .16); --btn-fg: var(--white); --btn-line: rgba(255, 255, 255, .78); --btn-hover: var(--white); --btn-fg-hover: var(--ink); --btn-line-hover: var(--white); --btn-icon: var(--white); --btn-icon-hover: var(--gold-700); border-color: var(--btn-line); }
.btn:disabled, .btn.is-disabled { --btn-bg: var(--grey-100); --btn-fg: var(--grey-500); --btn-line: transparent; --btn-icon: var(--grey-400); cursor: not-allowed; transform: none; }
.btn:disabled::before, .btn.is-disabled::before { display: none; }
.icon-btn { width: 46px; height: 46px; border-radius: var(--r-control); border: 1px solid currentColor; background: transparent; color: inherit; cursor: pointer; display: inline-grid; place-items: center; padding: 0; transition: background var(--d-move), color var(--d-move), border-color var(--d-move); }
.icon-btn svg { width: 20px; height: 20px; }
.icon-btn:focus-visible { outline: none; }

/* motion: content is visible unless the engine has started (html.mo) */
.mo .rv { opacity: 0; transform: translateY(28px); transition: opacity var(--d-enter) var(--ease), transform var(--d-enter) var(--ease); transition-delay: calc(var(--i, 0) * 90ms); }
.mo .rv.in { opacity: 1; transform: none; }
.mo .mask { clip-path: inset(100% 0 0 0); transition: clip-path var(--d-mask) var(--ease-in-out); }
.mo .mask.in { clip-path: inset(0 0 0 0); }
.mo .mask img { transform: scale(1.14); transition: transform 1800ms var(--ease); }
.mo .mask.in img { transform: scale(1); }
.mo .rule { transform: scaleX(0); transform-origin: left; transition: transform 1100ms var(--ease-in-out); }
.mo .rule.in { transform: scaleX(1); }
.wsplit .w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .1em; margin-bottom: -.1em; }
.wsplit .w > span { display: inline-block; }
.mo .wsplit .w > span { transform: translateY(108%); transition: transform 1000ms var(--ease); transition-delay: calc(var(--wi, 0) * 60ms); }
.mo .wsplit.in .w > span { transform: none; }
.fill .fw { transition: opacity 300ms linear, color 300ms linear; }
.mo .fill .fw { opacity: .18; }
.mo .fill .fw.on { opacity: 1; }
.marquee { overflow: hidden; display: flex; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee .track { display: flex; flex: none; animation: marq var(--marq, 48s) linear infinite; }
.marquee.rev .track { animation-direction: reverse; }
.marquee:hover .track { animation-play-state: paused; }
@keyframes marq { to { transform: translateX(-50%); } }
.draw-path { stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--d, 0)); }
@media (prefers-reduced-motion: reduce) {
  .mo .rv, .mo .mask, .mo .rule, .mo .wsplit .w > span, .mo .fill .fw { opacity: 1 !important; transform: none !important; clip-path: none !important; transition: none !important; }
  .marquee .track { animation: none; }
  .draw-path { stroke-dashoffset: 0; }
}

/* more of the palette as grounds: dark grey, black and light grey, each with gold */
.blk-slate { background-color: var(--char-700); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; color: var(--white); --muted: #C8CCD0; --fade: #949AA0; --subline: #C2C7CB; --rule: rgba(255, 255, 255, .16); --rule-gold: rgba(194, 157, 90, .5); --wm: #353B40; --num: var(--gold-300); --gold-solid: var(--gold-300); }
.blk-black { background: #000; color: var(--white); --muted: #B8B8B8; --fade: #7E7E7E; --subline: #B2B2B2; --rule: rgba(255, 255, 255, .14); --rule-gold: rgba(194, 157, 90, .5); --wm: #141414; --num: var(--gold-400); --gold-solid: var(--gold-400); }
.blk-mist { background-color: var(--grey-100); background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; color: var(--ink); --muted: #333333; --fade: #6E6E6E; --subline: #3F3F3F; --rule: rgba(18, 18, 18, .16); --wm: #E0E0E0; --num: var(--gold-700); --gold-solid: var(--gold-700); }
.blk-slate .foil, .blk-black .foil { background-image: var(--tex-gold), var(--foil-text-dark); }
.blk-slate .wsplit .foil .w > span, .blk-black .wsplit .foil .w > span { background-image: var(--tex-gold), var(--foil-text-dark); }
.blk-slate.pat-arcs, .blk-black.pat-arcs { --pat: var(--pat-arcs-gold); }

/* dotted arcs from a corner; add .dots-br to start from the bottom right */
.pat-dots { --pat: var(--pat-dots-ink); --pat-size: 1100px 1100px; }
.pat-dots::before { background-repeat: no-repeat; }
.blk-char.pat-dots, .blk-ink.pat-dots, .blk-slate.pat-dots, .blk-black.pat-dots { --pat: var(--pat-dots-gold); }
.blk-gold.pat-dots, .blk-deep.pat-dots { --pat: var(--pat-dots-white); }
.dots-br::before { transform: scale(-1, -1); }

/* breathing room: photo and colour blocks sit as rounded panels with space around them */
.inset { margin-inline: var(--inset); border-radius: var(--r-panel); overflow: hidden; }
.inset-y { margin-block: var(--inset); }

/* small buttons (rows, cards) and icon buttons: real controls, never a line under a word */
.btn-sm { min-height: 3em; padding: .75em 1.25em; gap: .6em; }
.btn-icon-only { padding: 0; width: 3.2em; min-height: 3.2em; }
.blk-char .icon-btn, .blk-ink .icon-btn, .blk-slate .icon-btn, .blk-black .icon-btn { color: var(--white); border-color: rgba(255, 255, 255, .35); }
.icon-btn:hover, .icon-btn:focus-visible { background: var(--gold-500); border-color: var(--gold-500); color: var(--ink); }

/* fields: focus is a gold edge and a faint gold wash, no underline, no ring */
.field { display: grid; gap: .55em; min-width: 0; }
.field label { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted, var(--grey-600)); }
.field input, .field textarea, .field select { width: 100%; font: inherit; font-size: var(--t-base); color: inherit; background: var(--field-bg, transparent); border: 1px solid var(--field-line, rgba(18, 18, 18, .28)); border-radius: var(--r-control); padding: .85em 1em; min-height: 3.4em; transition: border-color var(--d-move), background-color var(--d-move); }
.field textarea { min-height: 8em; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: var(--fade, var(--grey-400)); }
.field input:focus, .field textarea:focus, .field select:focus, .field .is-focus { outline: none; border-color: var(--gold-500); background-color: rgba(194, 157, 90, .1); }
.blk-char .field, .blk-ink .field, .blk-slate .field, .blk-black .field, .blk-gold .field, .blk-deep .field { --field-line: rgba(255, 255, 255, .32); }
/* 19 Oct round 3: an elegant form is a gold card. Fields are soft glass on the foil, labels in spaced capitals,
   and focus turns the field white (a colour swap, never an underline or a ring) */
.gform { display: grid; gap: var(--s-s); padding: clamp(24px, 3vw, 56px); border-radius: var(--r-panel); box-shadow: 0 40px 80px -46px rgba(40, 28, 10, .7); color: var(--white); }
.gform .field label { color: var(--white); }
.gform .field input, .gform .field textarea, .gform .field select { background: rgba(255, 255, 255, .12); border: 1px solid rgba(255, 255, 255, .3); border-radius: var(--r-control); color: var(--white); padding: .9em 1em; transition: background-color var(--d-move), color var(--d-move), border-color var(--d-move); }
.gform .field select option { color: var(--ink); }
.gform .field input::placeholder, .gform .field textarea::placeholder { color: rgba(255, 255, 255, .72); }
.gform .field input:focus, .gform .field textarea:focus, .gform .field select:focus { background: var(--white); color: var(--ink); border-color: var(--white); }
.gform .check, .gform .check span { color: var(--white) !important; text-shadow: 0 1px 2px rgba(40, 28, 10, .4); } .gform .check input { accent-color: var(--ink); }
.gform .note { color: var(--white) !important; }

/* icons, level 2: a gold body under the line, a touch off register */
.i.duo { width: 1.6em; height: 1.6em; overflow: visible; flex: none; }
.i.duo .l2 { fill: var(--ico-acc, var(--gold-300)); opacity: var(--ico-acc-o, .95); transform: translate(1.3px, 1.3px); transition: transform 600ms var(--ease), opacity 600ms var(--ease); }
.blk-char .i.duo, .blk-ink .i.duo, .blk-slate .i.duo, .blk-black .i.duo, .on-dark .i.duo { --ico-acc: var(--gold-500); }
.blk-gold .i.duo, .blk-deep .i.duo, .blk-brand .i.duo { --ico-acc: rgba(255, 255, 255, .34); }
/* icons, level 3: the tile, foil or charcoal with depth and a ripple in the corner, like a small mark */
.ico-tile { --ts: 76px; position: relative; isolation: isolate; overflow: hidden; display: inline-grid; place-items: center; flex: none; width: var(--ts); height: var(--ts); border-radius: calc(var(--r-control) * 2.2); color: var(--tile-line, var(--ink)); background-color: var(--tile-bg, var(--white)); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(0, 0, 0, .16), 0 16px 30px -16px rgba(10, 8, 4, .6), 0 3px 8px -3px rgba(10, 8, 4, .28); transition: transform 520ms var(--ease), box-shadow 520ms var(--ease); }
.ico-tile .i.duo { width: 50%; height: 50%; position: relative; z-index: 2; }
.ico-tile .ring { position: absolute; inset: 0; z-index: 1; background: repeating-radial-gradient(circle at 100% 100%, transparent 0 9px, var(--tile-ring, rgba(255, 255, 255, .22)) 9px 10px); -webkit-mask-image: radial-gradient(circle at 100% 100%, #000 20%, transparent 72%); mask-image: radial-gradient(circle at 100% 100%, #000 20%, transparent 72%); transition: transform 900ms var(--ease), opacity 900ms; transform-origin: 100% 100%; }
.tile-gold { --tile-bg: #A9844A; background-image: var(--tex-gold), var(--foil-brand); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; --tile-line: var(--ink); --ico-acc: #F3E9D4; --ico-acc-o: .78; --tile-ring: rgba(255, 255, 255, .3); }
.tile-char { --tile-bg: var(--char-900); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; --tile-line: var(--white); --ico-acc: var(--gold-500); --tile-ring: rgba(194, 157, 90, .28); }
.tile-slate { --tile-bg: var(--char-700); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; --tile-line: var(--white); --ico-acc: var(--gold-400); --tile-ring: rgba(255, 255, 255, .14); }
.tile-black { --tile-bg: #000; --tile-line: var(--gold-300); --ico-acc: var(--gold-700); --tile-ring: rgba(194, 157, 90, .24); }
.tile-white { --tile-bg: var(--white); --tile-line: var(--ink); --ico-acc: var(--gold-300); --tile-ring: rgba(170, 132, 66, .2); box-shadow: inset 0 0 0 1px rgba(18, 18, 18, .1), 0 16px 30px -18px rgba(10, 8, 4, .35); }
.tile-sm { --ts: 52px; }
.tile-lg { --ts: 104px; }
a:hover .ico-tile, a:focus-visible .ico-tile, .ico-tile.is-hover { transform: translateY(-4px) rotate(-3deg); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .28), inset 0 -1px 0 rgba(0, 0, 0, .16), 0 24px 36px -16px rgba(10, 8, 4, .6), 0 3px 8px -3px rgba(10, 8, 4, .28); }
a:hover .ico-tile .l2, a:focus-visible .ico-tile .l2, .ico-tile.is-hover .l2 { transform: translate(2.6px, 2.6px); }
a:hover .ico-tile .ring, .ico-tile.is-hover .ring { transform: scale(1.25); }
.mo .ico-anim .l1 > * { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1500ms var(--ease) 200ms; }
.mo .ico-anim.in .l1 > * { stroke-dashoffset: 0; }
.mo .ico-anim .l2 { opacity: 0; transform: translate(-2px, -2px) scale(.8); transform-origin: 12px 12px; transition: transform 900ms var(--ease) 650ms, opacity 900ms var(--ease) 650ms; }
.mo .ico-anim.in .l2 { opacity: var(--ico-acc-o, .95); transform: translate(1.3px, 1.3px); }
.mo .ico-anim .ring { opacity: 0; transform: scale(.4); }
.mo .ico-anim.in .ring { opacity: 1; transform: none; }

/* small motion graphics built from Ocean's own shapes; all stop for reduced motion */
.mg { display: inline-block; position: relative; flex: none; color: var(--mg-c, var(--gold-500)); }
.mg-ripple { width: var(--mg, 64px); height: var(--mg, 64px); }
.mg-ripple i { position: absolute; inset: 0; border-radius: 50%; border: 1px solid currentColor; opacity: 0; animation: mgRip 3.6s cubic-bezier(.2, .7, .2, 1) infinite; }
.mg-ripple i:nth-child(2) { animation-delay: 1.2s; } .mg-ripple i:nth-child(3) { animation-delay: 2.4s; }
.mg-ripple b { position: absolute; inset: 41%; border-radius: 50%; background: currentColor; }
@keyframes mgRip { 0% { transform: scale(.18); opacity: .95; } 100% { transform: scale(1); opacity: 0; } }
.mg-orb { width: var(--mg, 120px); aspect-ratio: 1; border-radius: 50%; overflow: hidden; background-color: var(--gold-700); background-image: var(--tex-gold), var(--foil-deep); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; }
.mg-orb i { position: absolute; inset: -40%; background: repeating-linear-gradient(135deg, rgba(230, 210, 166, .9) 0 5px, transparent 5px 14px); animation: mgOrb 7s linear infinite; }
.mg-orb::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 32% 28%, rgba(255, 255, 255, .5), transparent 42%), radial-gradient(circle at 72% 82%, rgba(20, 12, 0, .55), transparent 58%); }
@keyframes mgOrb { to { transform: translateX(19.8px); } }
.mg-swirl { width: var(--mg, 120px); }
.mg-swirl svg { width: 100%; height: auto; display: block; overflow: visible; }
.mg-swirl path { fill: none; stroke: currentColor; stroke-width: 1.4; vector-effect: non-scaling-stroke; stroke-dasharray: 1; animation: mgDraw 7s cubic-bezier(.65, 0, .35, 1) infinite; }
@keyframes mgDraw { 0% { stroke-dashoffset: 1; } 45%, 60% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1; } }
.mg-scales { width: var(--mg, 320px); }
.mg-scales svg { width: 100%; height: auto; display: block; }
.mg-scales g { animation: mgScale 4.2s ease-in-out infinite; animation-delay: calc(var(--k) * 180ms); opacity: .18; }
@keyframes mgScale { 0%, 100% { opacity: .18; } 40% { opacity: .95; } }
.mg-dots { width: var(--mg, 200px); aspect-ratio: 1; }
.mg-dots svg { width: 100%; height: 100%; overflow: visible; }
.mg-dots circle { fill: none; stroke: currentColor; stroke-linecap: round; transform-origin: 0 0; animation: mgSpin var(--t, 60s) linear infinite; }
.mg-dots circle:nth-child(even) { animation-direction: reverse; }
@keyframes mgSpin { to { transform: rotate(360deg); } }
.mg-wave { width: 100%; height: var(--mg, 14px); overflow: hidden; }
.mg-wave svg { width: 200%; height: 100%; display: block; animation: mgWave 12s linear infinite; }
.mg-wave path { fill: none; stroke: currentColor; stroke-width: 1; vector-effect: non-scaling-stroke; }
@keyframes mgWave { to { transform: translateX(-50%); } }
.mg-sheen { display: inline-block; background-image: linear-gradient(100deg, transparent 38%, rgba(255, 248, 230, .75) 50%, transparent 62%), var(--tex-gold), var(--foil-text-dark); background-size: 260% 100%, 256px, 100% 100%; background-repeat: no-repeat, repeat, no-repeat; background-blend-mode: normal, overlay, normal; -webkit-background-clip: text; background-clip: text; color: transparent; animation: mgSheen 6.5s cubic-bezier(.65, 0, .35, 1) infinite; }
@keyframes mgSheen { 0%, 35% { background-position: 130% 0, 0 0, 0 0; } 100% { background-position: -30% 0, 0 0, 0 0; } }
.mg-breathe { overflow: hidden; }
.mg-breathe img, .mg-breathe video { animation: mgBreathe 18s ease-in-out infinite alternate; }
@keyframes mgBreathe { from { transform: scale(1); } to { transform: scale(1.09) translate(-1%, -1%); } }
.mg-live { width: 14px; height: 14px; }
/* 18 Oct: no ripple ring (rings are banned); the dot itself breathes */
.mg-live i { display: none; }
.mg-live b { animation: mgLive 2.4s ease-in-out infinite; }
@keyframes mgLive { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
.mg-live b { position: absolute; inset: 3px; border-radius: 50%; background: currentColor; }

/* scroll devices */
/* colour shift: without the script (or with reduced motion) each section keeps its own colours */
.bgshift [data-bg] { background-color: var(--sec-bg); color: var(--sec-fg); }
.bgshift.live { background-color: var(--bgs, var(--white)); color: var(--fgs, var(--ink)); transition: background-color 900ms var(--ease), color 900ms var(--ease); }
.bgshift.live { background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; }
.bgshift:not(.live) [data-bg] { background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; }
.bgshift.live [data-bg] { background-image: none; }
.bgshift.live[data-tone="dark"] { background-image: var(--tex-dark); background-blend-mode: overlay; }
.bgshift.live [data-bg] { background-color: transparent; color: inherit; }
.bgshift.live[data-tone="dark"] { --subline: #B9BEC3; --muted: #BCC1C6; --fade: #6E747A; --rule: rgba(255, 255, 255, .16); --gold-solid: var(--gold-400); --num: var(--gold-400); }
.bgshift.live[data-tone="light"] { --subline: #4F4F4F; --muted: var(--grey-600); --fade: var(--grey-400); --rule: var(--border); --gold-solid: var(--gold-600); --num: var(--gold-600); }
/* each row on its own ground, with the text colours of that ground and its material */
.bgshift [data-bg][data-tone="dark"] { background-image: var(--tex-dark); background-blend-mode: overlay; --subline: #C9CDD1; --muted: #C9CDD1; --fade: #8C939A; --rule: rgba(255, 255, 255, .16); --gold-solid: var(--key, var(--gold-300)); --num: var(--key, var(--gold-300)); }
.bgshift [data-bg][data-tone="light"] { --subline: #4A4A4A; --muted: #3F3F3F; --fade: #7A7A7A; --rule: var(--border); --gold-solid: var(--key, var(--gold-800)); --num: var(--key, var(--gold-800)); }
[data-zoom] img, [data-zoom] video { transform: scale(var(--z, 1)); will-change: transform; }
[data-parallax] { transform: translateY(var(--py, 0)); }
.swap { position: relative; }
.swap > .row { min-height: 100svh; display: grid; grid-template-columns: 1fr 1fr; }
.swap > .r1 { position: sticky; top: 0; z-index: 1; }
.swap > .r2 { position: sticky; top: 0; z-index: 2; pointer-events: none; }
.swap > .r2 > * { pointer-events: auto; }
.swap > .r3 { position: relative; z-index: 3; pointer-events: none; }
.swap > .r3 > * { pointer-events: auto; }
.swap .spacer { visibility: hidden; }
.hslider { display: grid; grid-auto-flow: column; grid-auto-columns: var(--hs-col, minmax(280px, calc((100% - 2 * var(--gap)) / 3))); gap: var(--gap); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior-x: contain; }
.hslider::-webkit-scrollbar { display: none; }
.hslider > * { scroll-snap-align: start; min-width: 0; }
video.loop { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 1024px) {
  .swap > .row { position: relative; grid-template-columns: 1fr; min-height: 0; }
  .swap > .row > .spacer { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .mg *, .mg-swirl path, .mg-scales g, .mg-dots circle, .mg-wave svg, .mg-sheen, .mg-breathe img, .mg-breathe video { animation: none !important; }
  .mg-swirl path { stroke-dashoffset: 0; } .mg-scales g { opacity: .5; }
  .mo .ico-anim .l1 > *, .mo .ico-anim .l2, .mo .ico-anim .ring { transition: none !important; stroke-dashoffset: 0 !important; opacity: 1 !important; transform: none !important; }
  [data-zoom] img, [data-zoom] video { transform: none; }
}

:root { --nav-h: clamp(68px, 60px + 1.4vw, 100px); }
*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; scroll-padding-top: var(--nav-h); }
body { margin: 0; background: var(--white); color: var(--ink); font-family: var(--font); font-size: var(--t-base); line-height: 1.62; -webkit-font-smoothing: antialiased; overflow-x: clip; }
img, video { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
p { text-wrap: pretty; }
button { font: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.muted { color: var(--muted, #444444); }
.sub-line { font-weight: 300; color: var(--subline, #555555); }
/* 18 Oct: on a phone the Light line reads thin; subtitles step to Regular below 768px */
@media (max-width: 767px) { .t-subtitle, .sub-line { font-weight: 400; } }
.btns { display: flex; flex-wrap: wrap; gap: var(--s-xs); }
.inner { width: var(--shell); margin-inline: auto; position: relative; z-index: 1; }
.narrow { width: min(var(--shell), 860px); margin-inline: auto; }
.band { position: relative; padding-block: var(--s-xl); isolation: isolate; }
.band-sm { position: relative; padding-block: var(--s-l); isolation: isolate; }
.panel { position: relative; overflow: clip; isolation: isolate; }
/* 18 Oct round 2: a block narrower than full width only where it OVERLAPS the full-width block above it (.lap).
   On its own between two full-width blocks it reads as an orphan, so w80/w90 without .lap is full width and square. */
.panel.w90, .panel.w80 { margin: 0; border-radius: 0; }
.panel.lap { --lap: clamp(80px, 9vw, 150px); position: relative; z-index: 2; border-radius: var(--r-panel); margin-top: calc(var(--lap) * -1); margin-bottom: var(--s-xl); box-shadow: 0 40px 80px -40px rgba(18, 18, 18, .45); }
.panel.lap.w90 { margin-inline: 5%; } .panel.lap.w80 { margin-inline: 10%; }
:is(section, div):has(+ .panel.lap) { padding-bottom: calc(var(--s-xl) + clamp(80px, 9vw, 150px)) !important; }
.phead:has(+ .panel.lap) { min-height: calc(100svh + clamp(80px, 9vw, 150px)); }
.panel.lap + section.band { padding-top: calc(var(--s-xl) + clamp(80px, 9vw, 150px)); }
.panel.lift { margin-top: calc(var(--s-xl) * -1); z-index: 2; }
@media (max-width: 1024px) { .panel.lap.w90, .panel.lap.w80 { margin-inline: var(--inset); } }
.panel > .watermark, .band > .watermark { z-index: 0; }
.grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); }
.photo { overflow: hidden; border-radius: var(--r-card); position: relative; }
.photo img, .photo video { width: 100%; height: 100%; object-fit: cover; }
.zoom img, .zoom video { transition: transform 1200ms var(--ease); }
.zoom:hover img, a:hover .zoom img, .zoom:hover video { transform: scale(1.05); }
.sec-head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: end; margin-bottom: var(--s-l); }
.sec-head > div:first-child { grid-column: 1 / 9; }
.sec-head > .aside { grid-column: 9 / 13; justify-self: end; }
.sec-head > .aside:not(.btn) { color: var(--muted); }
.sec-head.center { justify-items: center; text-align: center; }
.sec-head.center > div:first-child { grid-column: 2 / 12; display: grid; justify-items: center; }
.sec-head .sub-line { margin-top: var(--s-xs); max-width: 34em; }
.prose { display: grid; gap: 1.1em; max-width: 40em; }
.prose p, .prose li { color: var(--muted, var(--grey-600)); }
.prose h3 { margin-top: .6em; }
.prose strong, .prose b { color: var(--ink); font-weight: 500; }
.on-dark .prose strong, .blk-char .prose strong { color: var(--white); }
.chip { display: inline-block; width: 2.1em; height: 1.04em; border-radius: var(--r-card); overflow: hidden; vertical-align: -.08em; margin-inline: .08em; }
.chip img { width: 100%; height: 100%; object-fit: cover; }

/* header: clear over the first panel, charcoal once you scroll, away while you read down */
/* 18 Oct round 2: a floating glass menu. Inset from the edges, blurred glass over the page, Medium capitals with air between
   the letters, a gold roll on hover, and dropdowns for the pages that have children */
.site-head { position: fixed; top: 14px; left: 50%; translate: -50% 0; width: min(95%, 1760px); z-index: 50; height: var(--nav-h); color: var(--white); border-radius: var(--r-panel);
  background: rgba(26, 31, 37, .34); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .14), 0 18px 40px -24px rgba(0, 0, 0, .5);
  transition: transform 600ms var(--ease), background-color 400ms var(--ease), color 400ms var(--ease); }
.site-head.solid { background: rgba(26, 31, 37, .82); color: var(--white); }
.site-head.away { transform: translateY(calc(-100% - 20px)); }
.lighthead .site-head { background: rgba(255, 255, 255, .62); color: var(--ink); box-shadow: inset 0 0 0 1px rgba(18, 18, 18, .1), 0 18px 40px -24px rgba(18, 18, 18, .35); }
.lighthead .site-head.solid { background: rgba(255, 255, 255, .86); color: var(--ink); }
.lighthead .site-head .icon-btn { border-color: rgba(18, 18, 18, .35); }
.site-head .inner { width: 100%; height: 100%; padding-inline: clamp(16px, 1.6vw, 28px); display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: var(--s-s); }
.logo { display: inline-flex; width: clamp(118px, 90px + 4vw, 176px); color: inherit; }
.logo svg { width: 100%; height: auto; }
.menu-main { display: flex; justify-content: center; white-space: nowrap; gap: clamp(14px, 1.35vw, 40px); font-size: clamp(13px, .85vw, 15px); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; }
.menu-main .mi { position: relative; }
.menu-main .mi > a { display: inline-flex; align-items: center; padding-block: .9em; }
.menu-main .roll { display: inline-block; white-space: nowrap; overflow: hidden; height: 1.3em; line-height: 1.3; }
.menu-main .mi > a .roll span { display: inline-block; line-height: 1.3; transition: transform 520ms var(--ease); text-shadow: 0 1.6em 0 var(--gold-300); }
.menu-main .mi > a:hover .roll span, .menu-main .mi > a:focus-visible .roll span { transform: translateY(-1.6em); }
.menu-main .mi > a:focus-visible { outline: none; }
.menu-main .mi > a[aria-current="page"] .roll span { color: var(--gold-300); text-shadow: 0 1.6em 0 var(--white); }
.lighthead .menu-main .mi > a .roll span { text-shadow: 0 1.6em 0 var(--gold-700); }
.lighthead .menu-main .mi > a[aria-current="page"] .roll span { color: var(--gold-700); text-shadow: 0 1.6em 0 var(--ink); }
.menu-main .chev { width: 9px; height: 6px; margin-left: .55em; color: var(--gold-300); opacity: .85; transition: rotate 360ms var(--ease), opacity 260ms var(--ease); }
.lighthead .menu-main .chev { color: var(--gold-700); }
.menu-main .has-drop:hover .chev, .menu-main .has-drop:focus-within .chev { rotate: 180deg; opacity: 1; }
.menu-main .drop::before { content: ""; position: absolute; left: 22px; right: 22px; top: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--gold-300), transparent); opacity: .7; }
.menu-main .drop a { position: relative; }
.menu-main .drop a::after { content: ""; position: absolute; left: .9em; bottom: .45em; width: 0; height: 1px; background: var(--gold-300); transition: width 360ms var(--ease); }
.menu-main .drop a:hover::after, .menu-main .drop a:focus-visible::after { width: 1.4em; }
.menu-main .has-drop .drop a { opacity: 0; translate: 0 6px; transition: opacity 300ms var(--ease), translate 400ms var(--ease), background-color var(--d-move), color var(--d-move); }
.menu-main .has-drop:hover .drop a, .menu-main .has-drop:focus-within .drop a { opacity: 1; translate: 0 0; }
.menu-main .has-drop .drop a:nth-child(2) { transition-delay: 40ms; } .menu-main .has-drop .drop a:nth-child(3) { transition-delay: 80ms; }
.menu-main .has-drop .drop a:nth-child(4) { transition-delay: 120ms; } .menu-main .has-drop .drop a:nth-child(5) { transition-delay: 160ms; }
.menu-main .drop { position: absolute; top: calc(100% + 8px); left: 50%; translate: -50% 6px; min-width: 240px; display: grid; padding: 10px; border-radius: var(--r-panel);
  background: rgba(26, 31, 37, .9); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 24px 48px -20px rgba(0, 0, 0, .55);
  opacity: 0; visibility: hidden; transition: opacity 260ms var(--ease), translate 360ms var(--ease), visibility 0s 260ms; text-transform: none; letter-spacing: 0; font-size: 16px; color: var(--white); }
.menu-main .drop a { padding: .7em .9em; border-radius: var(--r-control); transition: background-color var(--d-move), color var(--d-move); }
.menu-main .drop a:hover, .menu-main .drop a:focus-visible { background: rgba(255, 255, 255, .08); color: var(--gold-300); outline: none; }
.menu-main .has-drop:hover .drop, .menu-main .has-drop:focus-within .drop { opacity: 1; visibility: visible; translate: -50% 0; transition-delay: 0s; }
figure.stage, figure.studio { transition: opacity 700ms var(--ease); }
figure.stage.wait, figure.studio.wait { opacity: 0 !important; }
.head-actions { display: flex; justify-content: flex-end; align-items: center; gap: var(--s-xs); }
.head-actions .btn { min-height: 2.9em; padding: .7em 1.2em; }
.site-head .icon-btn { border-color: rgba(255, 255, 255, .45); }

/* the full-screen menu */
.overlay { position: fixed; inset: 0; z-index: 80; overflow-y: auto; }
.overlay[hidden] { display: none !important; }
.overlay .inner { min-height: 100%; display: grid; grid-template-rows: var(--nav-h) 1fr auto; padding-bottom: var(--s-m); }
.overlay .top { display: flex; justify-content: space-between; align-items: center; }
.overlay .icon-btn { color: var(--white); border-color: rgba(255, 255, 255, .45); }
.overlay nav { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-content: center; padding-block: var(--s-l); }
.overlay .main-links { grid-column: 1 / 7; display: grid; align-content: center; }
.overlay .main-links a { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 .5em; font-size: min(var(--t-xl), 4.6vw); white-space: nowrap; font-weight: 500; text-transform: uppercase; letter-spacing: -.035em; line-height: 1.1; padding-block: .08em; border-bottom: 1px solid var(--rule); transition: color var(--d-move), padding var(--d-move) var(--ease); }
.overlay .main-links a small { font-size: clamp(15px, .2em, 20px); font-weight: 400; letter-spacing: .04em; color: var(--gold-400); }
.overlay .main-links a:hover, .overlay .main-links a:focus-visible, .overlay .main-links a[aria-current="page"] { color: var(--gold-400); padding-left: .18em; outline: none; }
.overlay .more-links { grid-column: 8 / 13; display: grid; align-content: start; padding-top: .4em; }
.overlay .foot { border-top: 1px solid var(--rule); padding-top: var(--s-s); display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-m); color: var(--grey-400); }
.overlay .foot span { display: inline-flex; align-items: center; gap: .6em; }
.overlay .foot svg { width: 18px; height: 18px; color: var(--gold-400); }
.overlay .watermark { width: 60vw; right: -16vw; bottom: -22vw; }
.overlay .sunday { display: grid; gap: .6em; padding: var(--s-s); border-radius: var(--r-card); background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); margin-bottom: var(--s-s); }
.overlay .sunday .t-eyebrow { display: flex; align-items: center; gap: .9em; color: var(--gold-300); }
.overlay .sunday .tt { display: flex; flex-wrap: wrap; gap: .2em 1.1em; }
.overlay .sunday .tt b { font-size: var(--t-l); font-weight: 900; letter-spacing: -.03em; color: var(--white); font-variant-numeric: tabular-nums; }
.overlay .sunday .tt small { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .1em; color: var(--grey-400); margin-left: .25em; }
.overlay .sunday .t-small { color: var(--grey-300); }
.overlay .sunday .btns { margin-top: .3em; gap: .5em; }
.overlay .grps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-s); }
.overlay .grp { display: grid; gap: .45em; align-content: start; }
.overlay .grp .t-eyebrow { color: var(--gold-400); margin-bottom: .2em; }
.overlay .grp a { color: var(--grey-300); font-size: var(--t-small); transition: color var(--d-move); }
.overlay .grp a:hover, .overlay .grp a:focus-visible { color: var(--gold-300); outline: none; }
.overlay .foot .soc { display: flex; gap: .5em; margin-left: auto; }
.overlay .foot .soc .icon-btn { width: 40px; height: 40px; }
.overlay .menu-fig { aspect-ratio: 4 / 3; border-radius: var(--r-card); overflow: hidden; margin-bottom: var(--s-s); position: relative; }
.overlay .menu-fig img { width: 100%; height: 100%; object-fit: cover; transition: opacity 400ms var(--ease), transform 1200ms var(--ease); }
.overlay .menu-fig img.swap { opacity: 0; transform: scale(1.04); }

/* inner page head: a rounded panel, the photograph breathing behind a centred title */
/* 18 Oct round 2: ONE hero rule. Every hero is 100svh, the photograph full-bleed, a plain deep gradient in its lower part,
   the words inside that gradient, the faces framed into the upper part. No textured block after a gradient. */
.phead { position: relative; margin: 0; border-radius: 0; overflow: hidden; isolation: isolate; min-height: 100svh; display: grid; align-items: end; color: var(--white); background: #1A1F25; }
.phead .media { position: absolute; inset: 0; z-index: -2; }
.phead .media img, .phead .media video { width: 100%; height: 100%; object-fit: cover; }
.phead::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(10, 12, 15, .5) 0%, rgba(10, 12, 15, 0) 18%, rgba(10, 12, 15, 0) 40%, rgba(22, 26, 31, .7) 62%, rgba(26, 31, 37, .94) 82%, #1A1F25 100%); }
.phead .inner { display: grid; justify-items: center; text-align: center; gap: var(--s-s); padding-block: calc(var(--nav-h) + var(--s-xl)) var(--s-xl); }
.phead .media img, .phead .media video { transform-origin: 50% 25%; }
.phead .t-subtitle { max-width: 30em; color: var(--white); font-weight: 400; text-shadow: 0 1px 2px rgba(0, 0, 0, .35), 0 2px 22px rgba(0, 0, 0, .5); }
.phead h1 { text-shadow: 0 2px 40px rgba(0, 0, 0, .28); }
/* inside heroes: one step below the Home title, so the words stay in the lower part of the photograph */
.phead h1.t-xxxl { font-size: clamp(42px, 6.2vw, 132px); }
.phead .stroke, .closing .stroke { --stroke-c: rgba(255, 255, 255, .92); }
.phead .w-light, .closing .w-light { color: rgba(255, 255, 255, .96); }
.phead .btns { justify-content: center; margin-top: var(--s-s); }

.phead.plain { background-color: var(--grey-50); background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; color: var(--ink); min-height: 0; }
.phead.plain::after { display: none; }
.phead.plain .t-subtitle { color: var(--grey-600); }
.phead .facts { display: flex; flex-wrap: wrap; justify-content: center; gap: .4em 1.6em; margin-top: var(--s-xs); color: var(--white); text-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 1px 14px rgba(0, 0, 0, .45); }
.phead .facts span { display: inline-flex; align-items: center; gap: .5em; }
.phead .facts svg { width: 1.2em; height: 1.2em; color: var(--gold-300); }

/* ruled rows and accordions used across pages */
.rows > * { border-top: 1px solid var(--rule, var(--border)); }
.rows > *:last-child { border-bottom: 1px solid var(--rule, var(--border)); }
details.qa { border-top: 1px solid var(--rule, var(--border)); }
details.qa:last-of-type { border-bottom: 1px solid var(--rule, var(--border)); }
details.qa summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--s-s); align-items: center; padding-block: var(--s-s); font-size: var(--t-m); font-weight: 500; letter-spacing: -.015em; }
details.qa summary::-webkit-details-marker { display: none; }
details.qa summary .icon-btn { width: 42px; height: 42px; pointer-events: none; transition: transform 400ms var(--ease), background var(--d-move), color var(--d-move), border-color var(--d-move); border-color: var(--rule, rgba(18, 18, 18, .2)); }
details.qa[open] summary .icon-btn { transform: rotate(45deg); background: var(--gold-500); border-color: var(--gold-500); color: var(--ink); }
details.qa summary:hover .icon-btn, details.qa summary:focus-visible .icon-btn { background: var(--gold-500); border-color: var(--gold-500); color: var(--ink); }
details.qa summary:focus-visible { outline: none; color: var(--gold-700); }
details.qa .a { padding: 0 0 var(--s-m); max-width: 46em; color: var(--muted, var(--grey-600)); display: grid; gap: .8em; }
.copy-line { display: flex; flex-wrap: wrap; align-items: center; gap: .6em 1em; }
.copy-line code { font-family: var(--font); font-weight: 500; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.copy-btn { min-height: 2.6em; padding: .5em .9em; }

/* the closing invitation: a rounded panel with room around it */
/* 19 Oct round 3: the closing is one full-width photograph, 85% of the screen tall, a soft overlay, the words over it and one button.
   No half photo, half text. Pages that do not need an ask have no closing at all. */
.closing { position: relative; margin: 0; border-radius: 0; overflow: hidden; isolation: isolate; min-height: max(85svh, 560px); display: grid; align-items: end; color: var(--white); background: #1A1F25; }
.closing .media { position: absolute; inset: 0; z-index: -2; }
.closing .media img, .closing .media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.closing .media .tiles { position: absolute; inset: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; }
.closing .media .tile { position: relative; overflow: hidden; }
@media (max-width: 767px) { .closing .media .tiles { grid-template-columns: 1fr 1fr; } }
.closing .media .tiles.one { grid-template-columns: 1fr !important; }
.closing.tall { min-height: 110svh; }
.closing::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14, 16, 19, .84) 0%, rgba(14, 16, 19, .6) 34%, rgba(14, 16, 19, 0) 66%), linear-gradient(0deg, rgba(14, 16, 19, .7) 0%, rgba(14, 16, 19, 0) 42%); }
.closing .inner { width: var(--shell); margin-inline: auto; display: grid; justify-items: start; gap: var(--s-m); padding-block: var(--s-2xl) var(--s-xl); }
.closing .inner > * { max-width: min(36rem, 40vw); }
.closing h2.t-xxl { font-size: clamp(36px, 4.4vw, 100px); text-shadow: 0 2px 30px rgba(0, 0, 0, .3); }
@media (max-width: 1024px) { .closing .inner > * { max-width: 100%; } }
.closing .t-subtitle { color: rgba(255, 255, 255, .94); max-width: 26em; text-shadow: 0 1px 14px rgba(0, 0, 0, .45); }
/* centred low: the people above, the words in the lower third */
.closing.al-c .inner { justify-items: center; text-align: center; padding-bottom: var(--s-l); gap: var(--s-s); }
.closing.al-c h2.t-xxl { font-size: clamp(36px, 4vw, 92px); }
.closing.al-c .inner > * { max-width: min(46rem, 80vw); }
.closing.al-c::after { background: linear-gradient(0deg, rgba(14, 16, 19, .92) 0%, rgba(14, 16, 19, .66) 34%, rgba(14, 16, 19, 0) 64%); }
.closing:has(.tiles)::after { background: linear-gradient(0deg, rgba(14, 16, 19, .95) 0%, rgba(14, 16, 19, .82) 40%, rgba(14, 16, 19, .25) 72%) !important; }
.closing .t-subtitle { font-weight: 400; }
/* right: the people on the left, the words on the right (left-aligned inside their block for reading) */
.closing.al-r .inner { justify-items: end; }
.closing.al-r .inner > * { justify-self: end; width: min(36rem, 40vw); }
.closing.al-r::after { background: linear-gradient(270deg, rgba(14, 16, 19, .84) 0%, rgba(14, 16, 19, .6) 34%, rgba(14, 16, 19, 0) 66%), linear-gradient(0deg, rgba(14, 16, 19, .7) 0%, rgba(14, 16, 19, 0) 42%); }
.closing.al-r .btns { justify-content: flex-start; }
@media (max-width: 1024px) { .closing.al-r .inner > * { width: auto; justify-self: center; } }
@media (max-width: 1024px) { .closing::after { background: linear-gradient(0deg, rgba(14, 16, 19, .94) 0%, rgba(14, 16, 19, .78) 45%, rgba(14, 16, 19, .1) 80%) !important; } .closing .inner { justify-items: center; text-align: center; } }

/* 19 Oct round 3: ways to give as cards with character. Four grounds from the library, each with its own pattern at low opacity
   (gold with the swirl monogram, soft grey with the ocean scales, slate with the monogram in gold, charcoal with the faded logo) */
.wlist .way { position: relative; overflow: hidden; isolation: isolate; display: grid !important; grid-template-columns: 1fr !important; align-content: start; gap: var(--s-s) !important;
  padding: clamp(24px, 2.6vw, 48px) !important; border: 0 !important; border-radius: var(--r-panel); box-shadow: 0 40px 80px -50px rgba(18, 18, 18, .5); transition: transform 500ms var(--ease); }
.wlist .way:hover { transform: translateY(-4px); }
.wlist .way > :not(.watermark) { position: relative; z-index: 1; }
.wlist .way.pat { --pat-o: .7; }
.wlist .way.g2.pat { --pat-o: .8; }
.wlist .way .watermark { width: 80%; right: -24%; bottom: -34%; color: rgba(255, 255, 255, .07); z-index: 0; }
.wlist .way h3 { padding-bottom: var(--s-xs); border-bottom: 1px solid var(--rule); }
.wlist .way:is(.g1, .g3, .g4) { --muted: #DCDFE2; --rule: rgba(255, 255, 255, .2); }
.wlist .way:is(.g1, .g3, .g4) :is(.detail > p, ol, .copy-line .lab) { color: #DCDFE2 !important; }
.wlist .way:is(.g3, .g4) :is(dd, dt) { color: #DCDFE2 !important; }
.wlist .way.g1 :is(.detail > p, ol, li, .copy-line .lab, dd, dt, .t-small, b) { color: var(--white) !important; text-shadow: 0 1px 2px rgba(40, 28, 10, .5); }
.wlist .way.g1.pat { --pat-o: .35; }
.wlist .way:is(.g1, .g3, .g4) h3 svg { color: var(--gold-200) !important; }
.wlist .way.g1 h3 svg { color: var(--white) !important; }
.wlist .way:is(.g1, .g3, .g4) .btn-outline { --btn-fg: var(--white); --btn-line: rgba(255, 255, 255, .55); --btn-hover: var(--white); --btn-fg-hover: var(--ink); --btn-icon: var(--gold-200); }
.wlist .way:is(.g1, .g3, .g4) .t-small[style] { color: var(--gold-100) !important; }
.wlist .way.g2 :is(.detail > p, ol, .copy-line .lab) { color: #333333 !important; }
.wlist .way.g2 h3 svg { color: var(--gold-800) !important; }
.wlist .way .copy-line code { font-weight: 500 !important; }
/* a card with little to say keeps the same left alignment as its siblings and sits in the middle of its height, so the row balances */
.wlist .way:not(:has(.copy-line)) { align-content: center; }

/* social band: their latest posts in our own frame */
.social { padding-block: var(--s-xl); }
.social .sb-top { display: grid; justify-items: center; text-align: center; gap: var(--s-xs); margin-bottom: var(--s-l); }
/* 19 Oct round 3: each platform its own card with an on-brand ground (soft grey, gold foil, charcoal), the three cards ending on one line */
.sb-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); align-items: stretch; }
.sb-col { display: flex; flex-direction: column; gap: var(--s-s); padding: var(--s-m); border-radius: var(--r-panel); overflow: hidden; }
.sb-col.ig { background-color: var(--grey-50); background-image: var(--tex-light); background-size: 256px; background-blend-mode: multiply; color: var(--ink); }
.sb-col.fb.pat-mono { --pat: var(--pat-mono-white); }
.sb-col > :not(.watermark) { position: relative; z-index: 1; }
.sb-col.fb { background-color: #7E5F2C; background-image: var(--tex-gold), var(--foil-gold); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; color: var(--white); }
.sb-col.tt { background-color: var(--char-900); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; color: var(--white); }
.sb-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s-s); padding-bottom: var(--s-xs); border-bottom: 1px solid currentColor; border-color: color-mix(in srgb, currentColor 22%, transparent); }
.sb-head { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; align-items: center; row-gap: .5em; }
.sb-head .btn { white-space: nowrap; }
.sb-l { grid-column: 1 / -1; font-size: 16px; font-weight: 400; line-height: 1.45; }
.sb-col.ig .sb-l { color: #3F3F3F; }
.sb-col.tt .sb-l { color: #D5D8DB; }
.sb-head h3 { display: inline-flex; align-items: center; gap: .5em; font-weight: 500; }
.sb-head h3 svg { width: 1em; height: 1em; }
.sb-col.ig .sb-head h3 svg { color: var(--gold-700); }
.sb-col:is(.fb, .tt) .btn-outline { --btn-fg: var(--white); --btn-line: rgba(255, 255, 255, .55); --btn-hover: var(--white); --btn-fg-hover: var(--ink); --btn-icon: var(--white); }
.ig9 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.ig9 a { aspect-ratio: 1; display: block; overflow: hidden; border-radius: var(--r-card); }
.tt2 { flex: 1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; min-height: 0; }
.tt2 a { display: block; overflow: hidden; border-radius: var(--r-card); min-height: 0; position: relative; }
.tt2 video { position: absolute; inset: 0; }
.fbpost { flex: 1; display: flex; flex-direction: column; gap: var(--s-s); color: inherit; }
.fbpost .ph { flex: 1; min-height: 180px; display: block; overflow: hidden; border-radius: var(--r-card); position: relative; }
.fbpost .ph img { position: absolute; inset: 0; }
.fbpost p { color: var(--white); text-shadow: 0 1px 2px rgba(40, 28, 10, .4); }
.fbpost .meta { font-size: var(--t-xsmall); color: var(--white); font-weight: 500; text-shadow: 0 1px 2px rgba(40, 28, 10, .4); }
.ig9 img, .tt2 video, .fbpost .ph img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease); }
.ig9 a:hover img, .tt2 a:hover video, .fbpost:hover .ph img { transform: scale(1.04); }
@media (max-width: 1024px) { .sb-grid { grid-template-columns: 1fr 1fr; } .sb-col.tt { grid-column: 1 / -1; } .tt2 { aspect-ratio: 16 / 9; flex: none; grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .sb-grid { grid-template-columns: 1fr; } .tt2 { aspect-ratio: 4 / 3; } .sb-head { flex-wrap: wrap; } }

/* footer */
.site-foot { position: relative; padding-top: var(--s-xl); overflow: hidden; isolation: isolate; }
.news { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); align-items: end; padding-bottom: var(--s-l); border-bottom: 1px solid var(--rule); }
.news > div { grid-column: 1 / 7; display: grid; gap: var(--s-s); }
.news > form { grid-column: 8 / 13; }
.news-row { display: flex; gap: var(--s-xs); }
.news-row input { flex: 1; min-width: 0; background: var(--char-800); border: 1px solid var(--char-600); border-radius: var(--r-control); color: var(--white); font: inherit; font-size: var(--t-base); padding: .85em 1.1em; transition: border-color var(--d-move), background-color var(--d-move); }
.news-row input:focus { border-color: var(--gold-400); background-color: rgba(194, 157, 90, .12); outline: none; }
.news-note { min-height: 1.5em; margin-top: .6em; color: var(--grey-400); }
.cols { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: var(--s-l); padding-block: var(--s-l); }
.cols > * { min-width: 0; }
.cols .c1 { grid-column: 1 / 4; display: grid; gap: var(--s-s); align-content: start; }
.cols .c2 { grid-column: 4 / 6; } .cols .c3 { grid-column: 6 / 8; } .cols .c4 { grid-column: 8 / 10; } .cols .c5 { grid-column: 10 / 13; }
.cols h3 { color: var(--gold-400); margin-bottom: var(--s-xs); }
.cols li, .cols p { line-height: 1.85; color: #CDD0D3; }
.cols a:hover, .cols a:focus-visible { color: var(--gold-300); outline: none; }
.cols .times li { display: flex; align-items: baseline; gap: .35em; line-height: 1.5; }
.cols .times b { font-size: var(--t-m); font-weight: 900; color: var(--white); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.cols .times small { font-size: var(--t-xsmall); font-weight: 500; letter-spacing: .08em; color: #C4C8CC; }
.cols .hours b { font-weight: 500; color: var(--white); }
.cols .hours span { font-weight: 400; color: #D2D5D8; }
.contact-line { display: flex; align-items: center; gap: .6em; }
.contact-line svg { width: 18px; height: 18px; color: var(--gold-400); flex: none; }
.socials { display: flex; gap: var(--s-xs); }
.socials .icon-btn { color: var(--white); border-color: rgba(255, 255, 255, .3); }
.fine { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s-s); padding-block: var(--s-s); border-top: 1px solid var(--rule); color: var(--grey-400); }
.fine b { font-weight: 500; color: var(--white); }
.fine a { color: var(--white); font-weight: 500; transition: color var(--d-move); }
.fine a:hover, .fine a:focus-visible { color: var(--gold-300); outline: none; }
.foot-wave { color: var(--gold-500); opacity: .5; margin-top: var(--s-s); }
/* the giant wordmark sits behind; the swirl stands in front on a disc of the footer's own ground, so no letter shows through */
.wmark-wrap { position: relative; margin-top: var(--s-m); padding-bottom: calc(min(24vw, 600px) * .14); }
.wordmark { position: relative; z-index: 1; font-size: min(24vw, 600px); font-weight: 900; text-transform: uppercase; letter-spacing: -.005em; line-height: .74; white-space: nowrap; text-align: center; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .2); margin: 0; padding-bottom: .08em; user-select: none; }
.wordmark .e { position: relative; display: inline-block; margin-inline: .07em; }
.wmark-wrap .gswirl { position: absolute; left: 50%; top: .42em; width: .96em; aspect-ratio: 1; translate: -50% -50%; -webkit-text-stroke: 0; z-index: 2; border-radius: 50%; padding: 3.2%; background-color: var(--char-900); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; }
.wmark-wrap .gswirl svg { width: 100%; height: auto; display: block; }
.wmark-wrap .gswirl path { fill: url(#oc-foil); }

/* It's Time band (17 Oct night) */
.its2 { position: relative; padding-bottom: var(--s-xl); }
.its2-photo { position: relative; min-height: min(96svh, 1040px); display: grid; align-items: start; color: var(--white); overflow: hidden; isolation: isolate; }
.its2-photo .media { position: absolute; inset: 0; z-index: -2; }
.its2-photo .media img { width: 100%; height: 100%; object-fit: cover; transform: scale(var(--z, 1.1)); }
.its2-photo::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(105deg, rgba(14, 16, 19, .88) 0%, rgba(14, 16, 19, .66) 34%, rgba(14, 16, 19, .1) 64%), linear-gradient(0deg, rgba(14, 16, 19, .55), transparent 40%); }
.its2-photo .txt { display: grid; gap: var(--s-s); justify-items: start; max-width: 36em; padding-block: calc(var(--nav-h) + var(--s-l)) calc(var(--s-2xl) + 120px); }
.its2-photo .logo-its { width: clamp(140px, 12vw, 220px); margin-bottom: var(--s-xs); }
.its2-photo .t-big { color: var(--white); text-shadow: 0 1px 14px rgba(0, 0, 0, .4); }
.its2-goals { position: relative; z-index: 2; width: 80%; margin: -140px auto 0; border-radius: var(--r-panel); overflow: hidden; isolation: isolate; display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s-l); align-items: center; padding: var(--s-l); }
.its2-goals .watermark { position: absolute; width: 60%; left: -14%; bottom: -40%; color: rgba(255, 244, 222, .09); z-index: -1; }
.its2-goals .watermark svg { width: 100%; height: auto; }
.its2-goals .figs { display: grid; grid-template-columns: 1fr 1fr; }
.its2-goals .figs > div { display: grid; gap: .3em; padding-right: var(--s-m); }
.its2-goals .figs > div + div { padding-left: var(--s-m); border-left: 1px solid rgba(255, 244, 222, .35); }
.its2-goals .lab { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--white); }
.its2-goals .num { font-size: clamp(38px, 4.1vw, 78px); font-weight: 900; letter-spacing: -.045em; line-height: .95; color: var(--white); white-space: nowrap; font-variant-numeric: tabular-nums; }
.its2-goals .when { font-weight: 500; color: #FFFFFF; }
.its2-goals .lobby { display: grid; gap: var(--s-xs); }
.its2-goals .lobby img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; border-radius: var(--r-card); }
.its2-goals figcaption { font-size: var(--t-small); font-weight: 500; color: var(--white); text-shadow: 0 1px 2px rgba(40, 28, 10, .4); }
.its2-goals figcaption b { font-weight: 500; }
@media (max-width: 1024px) { .its2-goals { width: auto; margin-inline: 20px; grid-template-columns: 1fr; } .its2-photo .txt { padding-bottom: calc(var(--s-xl) + 140px); } }
@media (max-width: 640px) { .its2-goals .figs { grid-template-columns: 1fr; row-gap: var(--s-m); } .its2-goals .figs > div + div { padding-left: 0; border-left: 0; padding-top: var(--s-m); border-top: 1px solid rgba(255, 244, 222, .35); } }

.hsec .lead-card { width: clamp(300px, 30vw, 580px) !important; }
.hsec .lead-card h2 { font-size: clamp(36px, 4.4vw, 84px); }

h1 .fade, h2 .fade, h3 .fade { font-weight: 500; }
.nw { white-space: nowrap; }

/* ===== shared page components (board 4) ===== */
.split { display: grid; grid-template-columns: 1fr 1fr; position: relative; }
.split > figure { position: relative; }
.split .hold { position: sticky; top: 0; height: 100svh; overflow: hidden; }
.split .hold > img, .split .hold > video { width: 100%; height: 100%; object-fit: cover; }
.split .side { position: relative; padding: calc(var(--s-2xl) * .9) clamp(24px, 6vw, 120px) var(--s-2xl); display: grid; gap: var(--s-l); align-content: start; isolation: isolate; overflow: clip; }
.split .side > :not(.watermark) { position: relative; z-index: 1; }
.split.panel { border-radius: 0; }
/* 19 Oct round 3: no more half photo, half text. A split band is now one full-width photograph with the words over a soft overlay */
.split { display: grid !important; grid-template-columns: 1fr !important; align-items: center; min-height: 100svh; isolation: isolate; overflow: hidden; color: var(--white); background: #1A1F25; }
.split > figure { position: absolute !important; inset: 0; z-index: -2; margin: 0; }
.split .hold { position: absolute !important; inset: 0; height: auto !important; }
.split::after { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(14, 16, 19, .9) 0%, rgba(14, 16, 19, .72) 36%, rgba(14, 16, 19, .1) 68%); }
.split .side { background: none !important; width: min(40%, 660px); margin-left: max(5%, calc((100% - 1760px) / 2)); padding-inline: 0 !important; color: var(--white);
  --muted: #D7DADD; --subline: #D7DADD; --rule: rgba(255, 255, 255, .22); --border: rgba(255, 255, 255, .22); --gold-solid: var(--gold-300); --num: var(--white); }
.split .side .watermark { display: none; }
.split.right .side { margin-left: auto; margin-right: max(5%, calc((100% - 1760px) / 2)); }
.split.right::after { background: linear-gradient(270deg, rgba(14, 16, 19, .9) 0%, rgba(14, 16, 19, .72) 36%, rgba(14, 16, 19, .1) 68%); }
.split .side :is(p, dd, dt, li, small, span) { color: inherit; }
.split .side .sub-line, .split .side .muted { color: #D7DADD !important; }
.split .side .btn-outline { --btn-fg: var(--white); --btn-line: rgba(255, 255, 255, .55); --btn-hover: var(--white); --btn-fg-hover: var(--ink); --btn-icon: var(--gold-300); }
@media (max-width: 1024px) { .split { align-items: end; } .split::after { background: linear-gradient(0deg, rgba(14, 16, 19, .94) 0%, rgba(14, 16, 19, .72) 50%, rgba(14, 16, 19, .1) 85%); } .split .side { width: auto; margin: 0; padding: 40svh var(--inset) var(--s-xl) !important; } }
.stack-card { --c: 0; position: sticky; transform-origin: 50% 0; transform: scale(calc(1 - var(--c) * .06));  }
.hsec { position: relative; }
.hsec .h-sticky { position: sticky; top: 0; height: 100svh; overflow: hidden; display: grid; align-content: center; gap: var(--s-l); padding-block: var(--nav-h) var(--s-m); }
.h-track { display: flex; gap: var(--gap); padding-inline: 5vw; will-change: transform; }
.lead-card { flex: none; width: clamp(280px, 24vw, 460px); display: grid; align-content: end; gap: var(--s-s); padding-bottom: var(--s-xs); }

/* intro statement under a page head */
.intro { padding-block: var(--s-xl); text-align: center; }
.intro .inner { display: grid; justify-items: center; gap: var(--s-m); }
.intro .t-accent { max-width: 22em; font-weight: 300; letter-spacing: -.018em; line-height: 1.16; }
.intro .t-big { max-width: 34em; color: var(--grey-600); }

/* giant service times on a dark band (after Steeple) */
.bigtimes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gap); }
.bigtimes li { display: grid; gap: .3em; padding-top: var(--s-s); border-top: 1px solid var(--rule-gold, var(--rule)); }
.bigtimes .num { font-size: clamp(56px, 7.4vw, 180px); font-weight: 900; letter-spacing: -.06em; line-height: .85; color: var(--white); }
.bigtimes small { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; color: var(--gold-300); }

/* numbered steps that stack as you scroll, each with a photograph */
.steps { display: grid; gap: var(--s-m); }
.step { top: calc(var(--nav-h) + var(--s-s) + var(--i, 0) * 14px); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); border-radius: var(--r-panel); overflow: hidden; min-height: clamp(300px, 52svh, 560px); box-shadow: 0 28px 56px -32px rgba(0, 0, 0, .45); }
.step .txt { padding: var(--s-l) var(--s-m); display: grid; align-content: space-between; gap: var(--s-m); }
.step .n { font-size: clamp(60px, 7vw, 150px); font-weight: 500; letter-spacing: -.06em; line-height: .8; color: var(--num); }
.step h3 { font-size: var(--t-xl); font-weight: 500; text-transform: uppercase; letter-spacing: -.03em; line-height: 1; }
.step p { color: var(--muted); max-width: 30em; margin-top: var(--s-xs); }
.step figure { position: relative; overflow: hidden; }
.step figure img, .step figure video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* tile cards: an icon tile, a title, a line, a button */
.tcards { display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: var(--gap); }
.tcard { border-radius: var(--r-card); padding: var(--s-m); display: grid; gap: var(--s-s); align-content: start; justify-items: start; position: relative; isolation: isolate; overflow: hidden; }
.tcard h3 { text-transform: uppercase; font-weight: 500; letter-spacing: -.01em; }
.tcard p { color: var(--muted); }
.tcard .btn { margin-top: auto; }
.tcard.blk-white { box-shadow: inset 0 0 0 1px var(--border); }

/* ruled table for schedules, classes and people */
.ruled { width: 100%; border-collapse: collapse; }
.ruled th { text-align: left; font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); padding: 0 var(--s-s) var(--s-xs) 0; }
.ruled td { padding: var(--s-s) var(--s-s) var(--s-s) 0; border-top: 1px solid var(--rule, var(--border)); vertical-align: middle; }
.ruled tr:last-child td { border-bottom: 1px solid var(--rule, var(--border)); }
.ruled .big { font-size: var(--t-m); font-weight: 500; letter-spacing: -.015em; }
.ruled .gold { color: var(--gold-solid, var(--gold-700)); font-weight: 500; }
.ruled tr[hidden] { display: none; }

/* chips that filter a list */
.chips { display: flex; flex-wrap: wrap; gap: .5em; align-items: center; }
@media (max-width: 640px) { .chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: .4em; scrollbar-width: none; } .chips > * { flex: none; } }
.vrow .n { font-weight: 500 !important; }
.leader2 .role, .crew .role, .people .role { text-wrap: balance; }
.chip-btn { font: inherit; font-size: var(--t-button); font-weight: 500; letter-spacing: .08em; text-transform: uppercase; min-height: 2.8em; padding: .55em 1.1em; border-radius: var(--r-control); border: 1px solid var(--rule, rgba(18, 18, 18, .25)); background: transparent; color: inherit; cursor: pointer; transition: background var(--d-move), color var(--d-move), border-color var(--d-move); }
.chip-btn:hover, .chip-btn:focus-visible { border-color: var(--gold-500); outline: none; }
.chip-btn[aria-pressed="true"] { background: var(--gold-500); color: var(--ink); border-color: var(--gold-500); }
.blk-char .chip-btn[aria-pressed="true"] { background: var(--gold-500); color: var(--ink); border-color: var(--gold-500); }
.search { position: relative; flex: 1 1 260px; max-width: 380px; }
.search input { width: 100%; font: inherit; font-size: var(--t-base); padding: .75em 1em .75em 2.8em; min-height: 3em; border-radius: var(--r-control); border: 1px solid rgba(18, 18, 18, .25); background: var(--white); color: var(--ink); }
.search input:focus { outline: none; border-color: var(--gold-500); background-color: rgba(194, 157, 90, .08); }
.search svg { position: absolute; left: .9em; top: 50%; translate: 0 -50%; width: 1.2em; height: 1.2em; color: var(--gold-600); }

/* sermon cards */
.scard2 { display: grid; gap: var(--s-xs); align-content: start; }
.scard2 .photo { aspect-ratio: 16 / 9; }
.scard2 .meta { display: flex; flex-wrap: wrap; gap: .3em 1em; color: var(--gold-small, var(--gold-800)); }
.scard2 h3 { font-size: var(--t-m); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; }
.scard2:hover h3, .scard2:focus-visible h3 { color: var(--gold-700); }
.scard2:focus-visible { outline: none; }
.scard2[hidden] { display: none; }
.sgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-l) var(--gap); }

/* giving and detail panels */
.panels { display: grid; grid-template-columns: repeat(var(--cols, 2), minmax(0, 1fr)); gap: var(--gap); }
.gpanel { border-radius: var(--r-card); padding: var(--s-m); display: grid; gap: var(--s-s); align-content: start; position: relative; isolation: isolate; overflow: hidden; }
.gpanel .top { display: flex; align-items: center; gap: var(--s-s); }
.gpanel h3 { text-transform: uppercase; font-weight: 500; }
.gpanel dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .5em var(--s-s); }
.gpanel dt { color: var(--muted); font-size: var(--t-small); }
.gpanel dd { font-weight: 500; overflow-wrap: anywhere; }
.gpanel ol { display: grid; gap: .5em; counter-reset: st; }
.gpanel ol li { display: grid; grid-template-columns: 2em minmax(0, 1fr); counter-increment: st; }
.gpanel ol li::before { content: counter(st); font-weight: 500; font-size: 1.4em; line-height: 1; color: var(--num, var(--gold-600)); }
.gpanel .key { font-size: var(--t-xl); font-weight: 900; letter-spacing: -.03em; line-height: 1; font-variant-numeric: tabular-nums; }
.gpanel.blk-white { box-shadow: inset 0 0 0 1px var(--border); }

/* people */
.people { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 var(--gap); }
.person { display: grid; gap: .2em; padding-block: var(--s-s); border-top: 1px solid var(--rule, var(--border)); }
.person .name { font-size: var(--t-m); font-weight: 500; text-transform: uppercase; letter-spacing: -.02em; line-height: 1.05; }
.person .role { color: var(--gold-solid, var(--gold-700)); font-weight: 400; }

/* timeline of dates */
.timeline { display: grid; }
.tl-item { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 5fr) minmax(0, 4fr); gap: var(--gap); padding-block: var(--s-l); border-top: 1px solid var(--rule, var(--border)); align-items: start; }
.tl-item:last-child { border-bottom: 1px solid var(--rule, var(--border)); }
.tl-item .when { display: grid; gap: .3em; }
.tl-item .when .d { font-size: clamp(64px, 7vw, 160px); font-weight: 900; letter-spacing: -.06em; line-height: .8; color: var(--gold-700); }
.tl-item .when .m { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.tl-item .what { display: grid; gap: var(--s-xs); justify-items: start; }
.tl-item .what h3 { text-transform: uppercase; font-weight: 500; letter-spacing: -.02em; }
.tl-item .art { border-radius: var(--r-card); overflow: hidden; }
.tl-item .art img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }

/* rows whose background follows the scroll */
/* 18 Oct round 2: the values as one compact, shifting section. The photograph and the count stay pinned on the left and change
   with each value; the six values scroll on the right; the whole ground takes the colour of the value you are reading */
.vwrap { width: var(--shell); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); column-gap: clamp(32px, 5vw, 120px); }
.vstick { position: sticky; top: calc(var(--nav-h) + 40px); height: calc(100svh - var(--nav-h) - 80px); align-self: start; margin-block: 10svh; }
.vstick figure { position: absolute; inset: 0; margin: 0; border-radius: var(--r-panel); overflow: hidden; opacity: 0; transform: scale(1.04); transition: opacity 700ms var(--ease), transform 1200ms var(--ease); }
.vstick figure.on { opacity: 1; transform: none; }
.vstick figure img, .vstick figure video { width: 100%; height: 100%; object-fit: cover; }
.vstick .vcount { position: absolute; left: var(--s-s); bottom: var(--s-s); z-index: 2; display: flex; align-items: baseline; gap: .3em; color: var(--white); text-shadow: 0 2px 20px rgba(0, 0, 0, .45); }
.vstick .vcount b { font-size: clamp(56px, 6vw, 120px); font-weight: 900; letter-spacing: -.05em; line-height: .85; }
.vstick .vcount small { font-size: var(--t-m); font-weight: 500; }
.vrow { min-height: 72svh; display: grid; align-items: center; padding-block: var(--s-l); }
.vrow .txt { display: grid; gap: var(--s-s); justify-items: start; max-width: 40em; }
.vrow .n { font-size: var(--t-m); font-weight: 500; letter-spacing: .14em; color: var(--key); }
.vrow h3 { font-size: clamp(34px, 4vw, 92px); font-weight: 900; text-transform: uppercase; letter-spacing: -.035em; line-height: .95; }
.vrow h3 .key { color: var(--key); font-weight: 500; }
.vrow .d { font-size: var(--t-big); font-weight: 400; max-width: 30em; }
.vrow .vq { margin-top: var(--s-xs); padding-left: var(--s-s); border-left: 2px solid var(--key); display: grid; gap: .55em; max-width: 32em; }
.vrow .vq blockquote { font-size: var(--t-small); font-weight: 400; line-height: 1.55; }
.vrow .ref { font-size: var(--t-eyebrow); font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: var(--key); }
.vrow figure { display: none; }
/* while the colours move, every row reads the key colour of the value in view, so words never sit gold on gold */
.bgshift.live [data-bg] { --key: var(--wkey, currentColor) !important; background: transparent !important; }
.bgshift.live { transition: background-color 600ms var(--ease), color 600ms var(--ease); }

/* a photo mosaic of two, one overlapping the other's corner, used once */
.duo-photo { position: relative; padding: 0 12% 14% 0; }
.duo-photo .a { aspect-ratio: 4 / 5; border-radius: var(--r-panel); overflow: hidden; }
.duo-photo .b { position: absolute; right: 0; bottom: 0; width: 46%; aspect-ratio: 1; border-radius: var(--r-card); overflow: hidden; box-shadow: 0 0 0 8px var(--white), 0 30px 50px -24px rgba(0, 0, 0, .4); }
.duo-photo img { width: 100%; height: 100%; object-fit: cover; }

@media (max-width: 1024px) {
  .split { grid-template-columns: 1fr; }
  .split .hold { position: relative; height: auto; aspect-ratio: 4 / 3; }
  .hsec .h-sticky { position: relative; height: auto; padding-block: var(--s-xl); }
  .h-track { flex-direction: column; padding-inline: 0; width: var(--shell); margin-inline: auto; }
  .lead-card { width: 100%; }
  .bigtimes { grid-template-columns: 1fr 1fr; }
  .step { grid-template-columns: 1fr; grid-template-rows: auto minmax(220px, 30svh); min-height: 0; }
  .tcards { grid-template-columns: 1fr 1fr; }
  .sgrid { grid-template-columns: 1fr 1fr; }
  .panels { grid-template-columns: 1fr; }
  .people { grid-template-columns: 1fr 1fr; }
  .tl-item { grid-template-columns: 1fr; }
  .vwrap { display: block; } .vstick { display: none; }
  .vrow { min-height: 0; padding-inline: 0; }
  .vrow figure { display: block; margin: var(--s-m) 0 0; aspect-ratio: 4 / 3; border-radius: var(--r-panel); overflow: hidden; } .vrow figure img, .vrow figure video { width: 100%; height: 100%; object-fit: cover; }
}
@media (max-width: 640px) {
  .sub-line { font-weight: 400; }
  .tcards, .sgrid, .people { grid-template-columns: 1fr; }
  .ruled.stack thead { display: none; }
  .ruled.stack tr { display: grid; grid-template-columns: 1fr auto; padding-block: var(--s-xs); border-top: 1px solid var(--rule, var(--border)); }
  .ruled.stack td { border: 0; padding: .15em 0; }
  .ruled.stack tr:last-child { border-bottom: 1px solid var(--rule, var(--border)); }
}

/* Blueprint's own wordmark, drawn in our type, so no poster with an old date is shown */
.bp-art { position: relative; isolation: isolate; overflow: hidden; display: grid; place-items: center; text-align: center; gap: .6em; padding: var(--s-l) var(--s-m); border-radius: var(--r-control); background-color: var(--char-900); background-image: var(--tex-dark); background-size: 256px; background-blend-mode: overlay; color: var(--white); width: 100%; aspect-ratio: 16 / 10; }
.bp-art { container-type: inline-size; }
.bp-art .wm { font-size: clamp(28px, 14cqi, 120px); font-weight: 900; line-height: .9; letter-spacing: -.02em; line-height: 1; text-transform: uppercase; }
.bp-art .wm b { font-weight: 900; color: var(--gold-400); }
.cg-art .wm b { display: block; }
.bp-art .bp-line { width: 3.2em; height: 2px; background: var(--gold-400); }
.bp-art .bp-line i { display: none; }
.bp-art .d { font-size: clamp(15px, 3.2cqi, 20px); font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: var(--grey-300); }
.bp-art .swirl { display: none; }

/* the pastors' stage: a studio backdrop in deep antique gold, light behind their heads, darker at the edges, with sand, the faded swirl, a soft floor shadow and a fine gold hairline */
.stage-gold { position: relative; overflow: hidden; isolation: isolate; background-color: #6A4E24; background-image: var(--tex-gold), radial-gradient(ellipse 72% 62% at 50% 36%, #B38D50 0%, #8E6B33 36%, #5A4220 76%, #3D2D17 100%); background-size: 256px, 100% 100%; background-blend-mode: overlay, normal; }
.stage-gold::after { content: ""; position: absolute; inset: clamp(10px, 1.2vw, 18px); border: 1px solid rgba(255, 232, 186, .22); border-radius: calc(var(--r-panel) * .7); pointer-events: none; z-index: 3; }
.stage-gold .watermark { color: rgba(255, 236, 190, .09); z-index: 0; }
.stage-gold .floor { position: absolute; z-index: 1; left: 8%; right: 8%; bottom: -7%; height: 24%; background: radial-gradient(ellipse at 50% 50%, rgba(18, 12, 4, .55), transparent 70%); pointer-events: none; }
.stage-gold img { position: relative; z-index: 2; }

/* tablet and phone: every row stacks */
@media (max-width: 1280px) {
  .menu-main { display: none; }
  .site-head .inner { grid-template-columns: 1fr auto; }
}
@media (max-width: 1024px) {
  .sec-head > div:first-child, .sec-head > .aside, .news > div, .news > form { grid-column: 1 / -1; }
  .sec-head > .aside { justify-self: start; margin-top: var(--s-s); }
  .sec-head.center > div:first-child { grid-column: 1 / -1; }
  .news > form { margin-top: var(--s-m); }
  .cols .c1 { grid-column: 1 / -1; } .cols .c2, .cols .c3 { grid-column: span 6; } .cols .c4, .cols .c5 { grid-column: span 6; }
    .btns { flex-direction: column; align-items: stretch; width: min(100%, 26rem); }
  .phead .btns, .closing .btns { margin-inline: auto; }
  .overlay .main-links a { font-size: var(--t-xl); }
  .overlay .grps { grid-template-columns: 1fr 1fr; }
  .overlay .foot .soc { margin-left: 0; }
  .overlay .main-links, .overlay .more-links { grid-column: 1 / -1; } .overlay .more-links { margin-top: var(--s-m); } .overlay .menu-fig { display: none; }
}
@media (max-width: 640px) {
  .sub-line { font-weight: 400; }
  .head-actions .btn { display: none; }
  .btns { width: 100%; }
  .cols .c2, .cols .c3, .cols .c4, .cols .c5 { grid-column: 1 / -1; }
  .news-row { flex-direction: column; }
}

/* TikTok covers fetched from pasted links */
.tt2 a { position: relative; display: block; overflow: hidden; }
.tt2 img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease); }
.tt2 a:hover img { transform: scale(1.04); }
.tt-play { position: absolute; left: 50%; top: 50%; translate: -50% -50%; width: 52px; aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; background: rgba(184, 147, 86, .92); color: var(--ink); }
.tt-play svg { width: 40%; height: 40%; margin-left: 8%; }
/* WordPress: keep the floating menu below the admin bar for signed-in staff */
.admin-bar .site-head { top: calc(14px + 32px); }
.admin-bar .overlay { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-head { top: calc(14px + 46px); } .admin-bar .overlay { top: 46px; } }
/* plain pages (privacy notice and the like) */
.oc-prose { display: grid; gap: var(--s-s); font-size: var(--t-big); line-height: 1.6; color: #2E2E2E; }
.oc-prose h2 { font-size: var(--t-l); font-weight: 500; margin-top: var(--s-m); }
.oc-prose a { color: var(--gold-700); text-decoration: underline; }
/* a sermon with no artwork: charcoal tile, gold swirl, its title */
.oc-tile { position: absolute; inset: 0; display: grid; align-content: end; padding: clamp(14px, 2vw, 32px); background: radial-gradient(ellipse at 80% 10%, #2B3138, #1A1F25 70%); color: var(--white); overflow: hidden; }
.oc-tile-sw { position: absolute; width: 70%; right: -14%; top: -20%; color: rgba(213, 184, 124, .22); }
.oc-tile-sw svg { width: 100%; height: auto; display: block; }
.oc-tile-t { position: relative; font-size: clamp(18px, 1.6vw, 30px); font-weight: 500; letter-spacing: -.015em; line-height: 1.1; max-width: 14em; }
figure.photo:has(.oc-tile), .oc-player:has(.oc-tile) { position: relative; }
/* sermon body written in the editor */
.s-body article > ul, .s-body article > ol { padding-left: 1.2em; display: grid; gap: .4em; }
