/* Earning Green Bean Points (Deb's simplified mockup, 2026-11-06). Loaded only on that page,
   after design.css and home.css; every rule is scoped to the page. */

/* WordPress wraps each group's blocks in an inner container; as on the homepage, it steps aside so the grids and rows below see the cards. */
.gbms-pcards > .wp-block-group__inner-container, .gbms-pget > .wp-block-group__inner-container, .gbms-prules > .wp-block-group__inner-container { display: contents; }

/* Hero: the title on cream at the left, the photo fading in at the right. */
.gbms-hero-points { min-height: 0; padding: clamp(2rem, 4vw, 3.25rem) 1.25rem clamp(4rem, 7vw, 5.5rem); background: var(--gbms-cream); }
.gbms-hero-points .gbms-hp-photo { position: absolute; top: 0; right: 0; width: 58%; height: 100%; object-fit: cover; object-position: center 35%; }
.gbms-hero-points::after { background: linear-gradient(90deg, var(--gbms-cream) 40%, rgba(245, 242, 232, .82) 52%, rgba(245, 242, 232, 0) 70%); }
.gbms-hero-points .gbms-hero-inner { max-width: 1200px; }
.gbms-hp-text { max-width: 34rem; }
.gbms-hero-points h1 { margin: 0; color: var(--gbms-forest); font-size: clamp(2.1rem, 4.2vw, 3.2rem); font-style: normal; font-weight: 900; line-height: 1.08; text-shadow: none; }
.gbms-hero-points h1::after { content: ""; display: block; width: 7.5rem; height: 5px; margin-top: .55rem; border-radius: 3px; background: var(--gbms-forest); }
.gbms-hero-points p.gbms-hp-sub { margin: .9rem 0 .7rem; color: var(--gbms-forest); font-family: "Kaushan Script", var(--gbms-font-heading); font-size: clamp(1.35rem, 2.4vw, 1.8rem); line-height: 1.25; text-shadow: none; }
.gbms-hero-points p.gbms-hp-lead { color: var(--gbms-slate); font-size: clamp(1rem, 1.5vw, 1.12rem); line-height: 1.55; text-shadow: none; }
.gbms-hero-points .gbms-wave-back { fill: var(--gbms-bean-pale); }

/* Sections: interior-page spacing, not the homepage's. */
.gbms-points .gbms-sec { padding: clamp(1.75rem, 3vw, 2.5rem) 1.25rem clamp(3rem, 6vw, 4.5rem); }
.gbms-points .gbms-sec h2 { margin-bottom: 1.25rem; font-size: clamp(1.6rem, 2.8vw, 2.2rem); }

/* Icons: one consistent style, the bean-green mask the other pages use. */
.gbms-pcard::before, .gbms-pget-col::before, .gbms-prules-text::before, .gbms-points h2.gbms-pi-trophy::before { content: ""; display: block; flex: none; background: var(--gbms-bean); -webkit-mask: no-repeat center / contain var(--gbms-icon); mask: no-repeat center / contain var(--gbms-icon); }
.gbms-pi-ride { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Cpath d='M0 46 24 8l9 14 6-8 25 32H42L33 32l-9 14z'/%3E%3C/svg%3E"); }
.gbms-pi-learn { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M3 10c7-2 14-1 20 3v31c-6-4-13-5-20-3zM45 10c-7-2-14-1-20 3v31c6-4 13-5 20-3z'/%3E%3C/svg%3E"); }
.gbms-pi-give { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M24 43C11 33 3 26 3 16c0-6 5-11 11-11 4 0 8 2 10 6 2-4 6-6 10-6 6 0 11 5 11 11 0 10-8 17-21 27z'/%3E%3C/svg%3E"); }
.gbms-pi-new { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M8 4h4v42H8zM12 6c8-3 14 3 22 0 6-2 8-2 10-2v20c-2 0-4 0-10 2-8 3-14-3-22 0z'/%3E%3C/svg%3E"); }
.gbms-pi-share { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill-rule='evenodd' d='M4 14h10l4-6h12l4 6h10v26H4zM16 27a8 8 0 1 0 16 0a8 8 0 1 0-16 0z'/%3E%3C/svg%3E"); }
.gbms-pi-team { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 48'%3E%3Ccircle cx='32' cy='11' r='10'/%3E%3Ccircle cx='11' cy='16' r='7'/%3E%3Ccircle cx='53' cy='16' r='7'/%3E%3Cpath d='M14 46c0-14 8-22 18-22s18 8 18 22zM0 44c0-10 4-17 11-17 2 0 4 1 6 2-4 4-7 9-7 15zM64 44c0-10-4-17-11-17-2 0-4 1-6 2 4 4 7 9 7 15z'/%3E%3C/svg%3E"); }
.gbms-pi-auto { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath d='M24 4a20 20 0 0 1 17.3 10L46 11v14H32l5.2-5.2A13 13 0 0 0 11.3 21L4.5 19.4A20 20 0 0 1 24 4zM24 44A20 20 0 0 1 6.7 34L2 37V23h14l-5.2 5.2A13 13 0 0 0 36.7 27l6.8 1.6A20 20 0 0 1 24 44z'/%3E%3C/svg%3E"); }
.gbms-pi-submit { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cpath fill-rule='evenodd' d='M7 8h34v24H7zM11 12v16h26V12zM1 35h46l-3 6H4z'/%3E%3C/svg%3E"); }
.gbms-pi-trophy { --gbms-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 56'%3E%3Cpath fill-rule='evenodd' d='M16 0h32v5h13v8c0 10-7 17-16 18-2 4-5 7-9 8v7h9v9H19v-9h9v-7c-4-1-7-4-9-8C10 30 3 23 3 13V5h13zM9 11v2c0 6 4 11 9 12-1-4-2-9-2-14zm46 0h-7c0 5-1 10-2 14 5-1 9-6 9-12z'/%3E%3C/svg%3E"); }

/* Ways to Earn Points: six compact cards, three across. */
.gbms-points h2.gbms-points-lined { display: flex; align-items: center; justify-content: center; gap: 1.25rem; }
.gbms-points h2.gbms-points-lined::before, .gbms-points h2.gbms-points-lined::after { content: ""; width: clamp(2rem, 6vw, 4.5rem); height: 4px; border-radius: 2px; background: var(--gbms-bean); }
.gbms-pcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-width: 1200px; margin: 0 auto; }
.gbms-pcards .gbms-pcard { margin: 0; }
.gbms-pcard { display: flex; gap: 1rem; align-items: flex-start; padding: 1.25rem 1.25rem 1.3rem; border-radius: var(--gbms-radius); background: var(--gbms-white); box-shadow: var(--gbms-shadow); }
.gbms-pcard::before { width: 3.25rem; height: 3rem; margin-top: .1rem; }
.gbms-pcard h3 { margin: 0 0 .35rem; color: var(--gbms-forest); font-size: 1.25rem; font-weight: 900; line-height: 1.2; }
.gbms-pcard p { margin: 0; color: var(--gbms-slate); line-height: 1.45; }

/* How Do I Get My Points? */
.gbms-pget { display: grid; grid-template-columns: 1fr 1fr; max-width: 980px; margin: 0 auto 1.5rem; }
.gbms-pget-col { display: flex; gap: 1.1rem; align-items: flex-start; padding: .25rem 1.75rem; }
.gbms-pget-col + .gbms-pget-col { border-left: 2px solid rgba(36, 76, 58, .15); }
.gbms-pget-col::before { width: 3.5rem; height: 3.25rem; }
.gbms-pget-col h3 { margin: 0 0 .3rem; color: var(--gbms-forest); font-size: 1.35rem; font-weight: 900; }
.gbms-pget-col p { margin: 0; color: var(--gbms-slate); line-height: 1.5; }
.gbms-points-get .wp-block-buttons { justify-content: center; }

/* What Can I Earn? */
.gbms-points h2.gbms-pi-trophy { display: flex; align-items: center; justify-content: center; gap: .6rem; margin-bottom: .6rem; }
.gbms-points h2.gbms-pi-trophy::before { width: 1.3em; height: 1.15em; background: var(--gbms-forest); }
.gbms-points p.gbms-points-lead { max-width: 40rem; margin: 0 auto 1.25rem; color: var(--gbms-slate); font-size: 1.1rem; line-height: 1.5; text-align: center; }
.gbms-points-earn .wp-block-buttons { justify-content: center; }

/* Outline buttons, in the forest green the page's other buttons use. */
.gbms-points .gbms-btn-outline .wp-block-button__link.wp-block-button__link { display: inline-flex; align-items: center; min-height: 44px; padding: .65em 1.6em; border: 2px solid var(--gbms-forest); border-radius: 999px; background: transparent; color: var(--gbms-forest); font-family: var(--gbms-font-heading); font-size: 1.05rem; font-weight: 800; text-decoration: none; }
.gbms-points .gbms-btn-outline .wp-block-button__link.wp-block-button__link:hover { background: var(--gbms-forest); color: var(--gbms-white); }

/* The Official Rules: one compact band. */
.gbms-points .gbms-points-rules { padding-bottom: clamp(2rem, 4vw, 3rem); }
.gbms-prules { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 2rem; max-width: 1100px; margin: 0 auto; }
.gbms-prules-text { display: flex; flex: 1 1 28rem; gap: 1.1rem; align-items: center; }
.gbms-prules-text::before { width: 3.5rem; height: 3.25rem; }
.gbms-points .gbms-prules h2 { margin: 0 0 .2rem; font-size: clamp(1.4rem, 2.4vw, 1.8rem); text-align: left; }
.gbms-prules p { margin: 0; color: var(--gbms-slate); }

@media (max-width: 960px) {
	.gbms-pcards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
	.gbms-hero-points { display: block; padding: 0 0 3.5rem; }
	.gbms-hero-points .gbms-hp-photo { position: static; display: block; width: 100%; height: 210px; }
	.gbms-hero-points::after { display: none; }
	.gbms-hero-points .gbms-hero-inner { padding: 1.25rem 1.25rem 0; }
	.gbms-pcards, .gbms-pget { grid-template-columns: 1fr; }
	.gbms-pget-col { padding: .75rem 0; }
	.gbms-pget-col + .gbms-pget-col { border-left: 0; border-top: 2px solid rgba(36, 76, 58, .15); }
	.gbms-points h2.gbms-points-lined::before, .gbms-points h2.gbms-points-lined::after { width: 1.25rem; }
	.gbms-prules { justify-content: center; }
}
