/* Shared, opt-in content-page canvas. Page-specific components stay scoped. */
html:has(.hg-page-canvas), body:has(.hg-page-canvas) { background: #eaf6ff !important; background-image: none !important; }
body.higuppy-site-shell:has(.hg-page-canvas) .page-wrapper, body.higuppy-site-shell:has(.hg-page-canvas) .template-container, body.higuppy-site-shell:has(.hg-page-canvas) .template-content, body.higuppy-site-shell:has(.hg-page-canvas) .content-page, body.higuppy-site-shell:has(.hg-page-canvas) .main-content, body.higuppy-site-shell:has(.hg-page-canvas) .site-main, body.higuppy-site-shell:has(.hg-page-canvas) .wp-site-blocks, body.higuppy-site-shell:has(.hg-page-canvas) .entry-content { background: transparent !important; background-image: none !important; }
.hg-page-canvas { --hg-canvas-ink: #12264c; --hg-canvas-muted: #526985; --hg-canvas-sky: #eef8ff; --hg-canvas-line: #d9e6f3; --hg-canvas-accent: #ff7043; color: var(--hg-canvas-ink); font-family: inherit; overflow: clip; }
.hg-page-canvas *, .hg-page-canvas *::before, .hg-page-canvas *::after { box-sizing: border-box; }
.hg-page-canvas .hg-reviews-shell { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.hg-page-canvas .hg-reviews-shell--narrow { width: min(920px, calc(100% - 48px)); }
.hg-page-canvas .hg-reviews-hero { background: #eaf6ff; padding: clamp(28px, 3.5vw, 58px) 0 clamp(52px, 7vw, 104px); }
.hg-page-canvas .hg-reviews-hero__grid { display: grid; grid-template-columns: minmax(0, 1.04fr) minmax(380px, .96fr); align-items: center; gap: clamp(36px, 6vw, 88px); }
.hg-page-canvas .hg-reviews-breadcrumbs { display: inline-flex; gap: 9px; align-items: center; padding: 5px 10px 5px 5px; border: 1px solid rgba(174,207,234,.72); border-radius: 999px; background: rgba(255,255,255,.5); box-shadow: 0 8px 20px rgba(36,91,142,.06); font-size: var(--hg-font-size-body); color: #46698c; margin-bottom: 20px; }
.hg-page-canvas .hg-reviews-breadcrumbs a { display: inline-flex; align-items: center; min-height: 28px; padding: 0 11px; border-radius: 999px; background: #1d5c9f; color: #fff !important; font-weight: var(--hg-font-weight-ui); text-decoration: none; box-shadow: 0 5px 12px rgba(29,92,159,.2); transition: transform .18s ease, background .18s ease, box-shadow .18s ease; }.hg-page-canvas .hg-reviews-breadcrumbs a:hover, .hg-page-canvas .hg-reviews-breadcrumbs a:focus-visible { transform: translateY(-1px); background: #164a82; color: #fff !important; box-shadow: 0 8px 16px rgba(29,92,159,.28); outline: 3px solid rgba(255,112,67,.4); outline-offset: 2px; }.hg-page-canvas .hg-reviews-faq a { color: #1d5c9f; text-decoration: underline; text-underline-offset: 3px; }
body .hg-page-canvas .hg-reviews-hero .hg-reviews-breadcrumbs a, body .hg-page-canvas .hg-reviews-hero .hg-reviews-breadcrumbs a:hover, body .hg-page-canvas .hg-reviews-hero .hg-reviews-breadcrumbs a:focus-visible { color: #fff !important; }
.hg-page-canvas .hg-reviews-eyebrow { margin: 0 0 12px; color: var(--hg-canvas-accent); font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); letter-spacing: .14em; text-transform: uppercase; }
.hg-page-canvas h1, .hg-page-canvas h2, .hg-page-canvas h3 { color: var(--hg-canvas-ink); }
.hg-page-canvas .hg-reviews-hero h1 { max-width: 620px; margin: 0; font-size: clamp(42px, 5vw, 70px); line-height: .98; letter-spacing: -.055em; }
.hg-page-canvas .hg-reviews-lead { max-width: 605px; margin: 24px 0; color: var(--hg-canvas-muted); font-size: clamp(17px, 1.5vw, 20px); line-height: 1.65; }
.hg-page-canvas .hg-reviews-callout { display: grid; grid-template-columns: 28px 1fr; gap: 12px; max-width: 600px; padding: 15px 17px; border: 1px solid #d7e7f4; border-radius: 14px; background: rgba(255,255,255,.78); box-shadow: 0 12px 30px rgba(26, 77, 132, .06); }
.hg-page-canvas .hg-reviews-callout > span { color: #2d9965; font-weight: var(--hg-font-weight-ui); } .hg-page-canvas .hg-reviews-callout p { margin: 0; color: #405b79; font-size: var(--hg-font-size-body); line-height: 1.5; }
.hg-page-canvas .hg-reviews-hero__art { --hg-aquarium-x: 50%; --hg-aquarium-y: 50%; --hg-hero-fish: url('/wp-content/plugins/custom-site-plugin/assets/images/hg-reviews-gold-tuxedo-v1.png'); position: relative; isolation: isolate; min-height: 370px; margin: 0; border: 10px solid rgba(255,255,255,.8); border-radius: 30px; overflow: hidden; box-shadow: inset 0 3px 16px rgba(255,255,255,.62), inset 0 -12px 30px rgba(12,94,90,.18), 0 28px 60px rgba(23,78,138,.18); background: linear-gradient(115deg,rgba(255,255,255,.34) 0 13%,transparent 40%), linear-gradient(200deg,rgba(253,187,45,.15) 0 22%,transparent 46%), var(--hg-hero-fish) 18% 28% / 76px auto no-repeat, var(--hg-hero-fish) 73% 25% / 92px auto no-repeat, var(--hg-hero-fish) 58% 69% / 68px auto no-repeat, linear-gradient(180deg,#eaf9f1 0%,#cdeee2 32%,#a6e0d2 64%,#83d1c3 100%); animation: hg-reviews-school-drift 22s ease-in-out infinite alternate; }
.hg-page--wholesale-bulk-orders .hg-wholesale-hero__art { --hg-hero-fish: url('/wp-content/plugins/custom-site-plugin/assets/images/hg-wholesale-cobalt-mosaic-v1.png'); }
.hg-page-canvas .hg-reviews-hero__art::before { content: ''; position: absolute; z-index: 2; inset: 0; pointer-events: none; opacity: .7; background: radial-gradient(circle at 17% 102%, rgba(255,255,255,.96) 0 2px, transparent 2.8px), radial-gradient(circle at 30% 108%, rgba(255,255,255,.85) 0 3px, transparent 3.8px), radial-gradient(circle at 63% 105%, rgba(255,255,255,.9) 0 2.5px, transparent 3.3px), radial-gradient(circle at 79% 109%, rgba(255,255,255,.8) 0 4px, transparent 5px); background-repeat: no-repeat; animation: hg-reviews-bubbles 11s linear infinite; }
.hg-page-canvas .hg-reviews-hero__art::after { content: ''; position: absolute; z-index: 2; inset: 0; pointer-events: none; opacity: .65; background: radial-gradient(circle at var(--hg-aquarium-x) var(--hg-aquarium-y), rgba(255,255,255,.22), transparent 20%), linear-gradient(115deg, transparent 32%, rgba(255,255,255,.14) 49%, transparent 63%); transform: translateX(-115%); transition: opacity .25s ease; animation: hg-reviews-water-glint 12s ease-in-out infinite; }.hg-page-canvas .hg-reviews-hero__tank-bed { position: absolute; z-index: 1; right: 0; bottom: 0; left: 0; height: 43%; pointer-events: none; background: radial-gradient(70px 132px at 82% 106%,#2a9d8f 0 45%,transparent 48%), radial-gradient(52px 108px at 90% 106%,#3fb98a 0 45%,transparent 48%), radial-gradient(60px 122px at 50% 108%,#2fa36a 0 45%,transparent 48%), radial-gradient(40px 80px at 60% 106%,#38be7c 0 45%,transparent 48%), radial-gradient(54px 44px at 15% 103%,#9aa6ad 0 52%,transparent 55%), radial-gradient(40px 82px at 26% 105%,#34b58f 0 45%,transparent 48%), linear-gradient(180deg,transparent 48%,#efe0bf 72%,#e4cf95 100%); }.hg-page-canvas .hg-reviews-hero__feature-fish { position: relative; z-index: 3; display: block; width: min(72%,330px); height: auto; min-height: 0; margin: 8% auto 0; object-fit: contain; filter: drop-shadow(0 20px 26px rgba(8,40,74,.3)); transform-origin: 50% 50%; transition: filter .25s ease; animation: hg-reviews-fish-drift 15s ease-in-out infinite; }.hg-page-canvas .hg-reviews-hero__art.is-interacting::after { opacity: 1; }.hg-page-canvas .hg-reviews-hero__art.is-interacting .hg-reviews-hero__feature-fish { filter: drop-shadow(0 20px 26px rgba(8,40,74,.3)) saturate(1.12) brightness(1.04); }
.hg-page-canvas .hg-reviews-hero__ripple-trigger { position: absolute; z-index: 5; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; background: transparent; cursor: crosshair; }.hg-page-canvas .hg-reviews-hero__ripple-trigger:focus-visible { outline: 3px solid #fff; outline-offset: -8px; }.hg-page-canvas .hg-reviews-ripple { position: absolute; z-index: 6; width: 20px; height: 20px; margin: -10px; border: 2px solid rgba(255,255,255,.9); border-radius: 50%; pointer-events: none; transform: scale(.2); opacity: .9; animation: hg-reviews-ripple 1s ease-out forwards; }
.hg-page-canvas .hg-reviews-fish-trigger { position: absolute; z-index: 7; width: clamp(84px,12vw,138px); padding: 0; border: 0; background: transparent; cursor: pointer; filter: drop-shadow(0 7px 8px rgba(4,51,88,.2)); transform: translate3d(0,0,0); }.hg-page-canvas .hg-reviews-fish-trigger img { width: 100%; height: auto; min-height: 0; object-fit: contain; display: block; animation: none; }.hg-page-canvas .hg-reviews-fish-trigger--one { top: 18%; left: 34%; }.hg-page-canvas .hg-reviews-fish-trigger--two { top: 49%; left: 56%; width: clamp(72px,10vw,116px); transform: scaleX(-1); }.hg-page-canvas .hg-reviews-fish-trigger--three { top: 28%; right: 8%; width: clamp(70px,9vw,106px); }.hg-page-canvas .hg-reviews-fish-trigger:hover, .hg-page-canvas .hg-reviews-fish-trigger:focus-visible { filter: drop-shadow(0 9px 12px rgba(4,51,88,.33)) saturate(1.12); outline: none; }.hg-page-canvas .hg-reviews-fish-trigger:focus-visible { outline: 3px solid rgba(255,255,255,.96); outline-offset: 4px; border-radius: 50%; }.hg-page-canvas .hg-reviews-fish-trigger.is-swimming { animation: hg-reviews-fish-swim .85s cubic-bezier(.2,.78,.3,1) both; }.hg-page-canvas .hg-reviews-fish-trigger--two.is-swimming { animation-name: hg-reviews-fish-swim-reverse; }
@keyframes hg-reviews-fish-drift { 0% { transform: translate(-7%,2px) rotate(-2deg); } 25% { transform: translate(0,-9px) rotate(1.2deg); } 50% { transform: translate(7%,1px) rotate(2deg); } 75% { transform: translate(0,-6px) rotate(-1deg); } 100% { transform: translate(-7%,2px) rotate(-2deg); } }
@keyframes hg-reviews-school-drift { 0% { background-position: 0 0,0 0,18% 28%,73% 25%,58% 69%,50% 100%; } 100% { background-position: 0 0,0 0,34% 22%,61% 33%,72% 61%,50% 100%; } }
@keyframes hg-reviews-bubbles { from { background-position: 17% 105%, 30% 112%, 63% 108%, 79% 113%; } to { background-position: 17% -12%, 30% -18%, 63% -10%, 79% -16%; } }
@keyframes hg-reviews-water-glint { 0%, 56% { transform: translateX(-115%); } 82%, 100% { transform: translateX(115%); } }
@keyframes hg-reviews-ripple { to { transform: scale(13); opacity: 0; } }
@keyframes hg-reviews-fish-swim { 0% { transform: translate3d(0,0,0) rotate(0); } 45% { transform: translate3d(28px,-15px,0) rotate(-4deg); } 100% { transform: translate3d(0,0,0) rotate(0); } }
@keyframes hg-reviews-fish-swim-reverse { 0% { transform: scaleX(-1) translate3d(0,0,0) rotate(0); } 45% { transform: scaleX(-1) translate3d(26px,-14px,0) rotate(-4deg); } 100% { transform: scaleX(-1) translate3d(0,0,0) rotate(0); } }
@media (prefers-reduced-motion: reduce) { .hg-page-canvas .hg-reviews-hero__art, .hg-page-canvas .hg-reviews-hero__art::before, .hg-page-canvas .hg-reviews-hero__art::after, .hg-page-canvas .hg-reviews-hero__art img { animation: none; } .hg-page-canvas .hg-reviews-hero__ripple-trigger, .hg-page-canvas .hg-reviews-fish-trigger { display: none; } }
.hg-page-canvas .hg-reviews-section { padding: clamp(48px, 5.5vw, 80px) 0; background: #fff; }
.hg-page-canvas .hg-reviews-section--tint { background: var(--hg-canvas-sky); }
.hg-page-canvas .hg-reviews-section + .hg-reviews-section { position: relative; isolation: isolate; }.hg-page-canvas .hg-reviews-section + .hg-reviews-section::before { content: ''; position: absolute; z-index: 0; top: -1px; right: 0; left: 0; height: 62px; pointer-events: none; border-top: 1px solid rgba(102,183,214,.35); background: radial-gradient(circle at 12% 28px, rgba(106,207,230,.55) 0 3px, transparent 3.8px), radial-gradient(circle at 21% 44px, rgba(160,222,241,.7) 0 2px, transparent 2.9px), radial-gradient(circle at 68% 26px, rgba(106,207,230,.45) 0 2.5px, transparent 3.2px), radial-gradient(circle at 82% 42px, rgba(160,222,241,.75) 0 3.5px, transparent 4.2px), linear-gradient(180deg, rgba(185,233,246,.3), transparent 70%); }.hg-page-canvas .hg-reviews-section + .hg-reviews-section::after { content: ''; position: absolute; z-index: 0; top: -1px; right: 0; left: 0; height: 22px; pointer-events: none; background: radial-gradient(36px 11px at 50% -1px, transparent 66%, rgba(74,165,200,.28) 69% 73%, transparent 76%) 0 0 / 74px 22px repeat-x; opacity: .9; }.hg-page-canvas .hg-reviews-section + .hg-reviews-section > * { position: relative; z-index: 1; }
.hg-page-canvas .hg-reviews-heading { max-width: 720px; margin-bottom: 38px; }
.hg-page-canvas .hg-reviews-heading h2 { margin: 0; font-size: clamp(30px, 3.6vw, 48px); line-height: 1.08; letter-spacing: -.04em; }
.hg-page-canvas .hg-reviews-heading > p:last-child { margin: 16px 0 0; color: var(--hg-canvas-muted); font-size: 17px; line-height: 1.65; }
.hg-page-canvas .hg-reviews-card-grid { display: grid; gap: 22px; } .hg-page-canvas .hg-reviews-card-grid--three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hg-page-canvas .hg-reviews-card { min-width: 0; display: grid; grid-template-columns: 42px minmax(0,1fr); column-gap: 15px; align-content: start; padding: 30px; border: 1px solid var(--hg-canvas-line); border-radius: 20px; background: #fff; box-shadow: 0 16px 34px rgba(17, 59, 105, .07); }.hg-page-canvas .hg-reviews-card .hg-reviews-icon { grid-column: 1; grid-row: 1; align-self: center; }.hg-page-canvas .hg-reviews-card h3 { grid-column: 2; grid-row: 1; margin: 0; align-self: center; }.hg-page-canvas .hg-reviews-card p { grid-column: 1 / -1; margin-top: 16px; }
.hg-page-canvas .hg-reviews-card--interactive { --hg-card-x: 50%; --hg-card-y: 50%; position: relative; isolation: isolate; overflow: hidden; opacity: 0; transform: translateY(18px); transition: transform .36s cubic-bezier(.2,.75,.25,1), opacity .36s ease, border-color .24s ease, box-shadow .24s ease; transition-delay: var(--hg-card-delay, 0ms); }
.hg-page-canvas .hg-reviews-card--interactive::after { content: ''; position: absolute; z-index: -1; inset: 0; pointer-events: none; opacity: 0; background: radial-gradient(circle at var(--hg-card-x) var(--hg-card-y), rgba(110,186,255,.2), transparent 38%); transition: opacity .24s ease; }
.hg-page-canvas .hg-reviews-card--interactive.is-revealed { opacity: 1; transform: translateY(0); }
.hg-page-canvas .hg-reviews-card--interactive.is-hovered { border-color: #8bc7ef; box-shadow: 0 24px 44px rgba(23, 94, 153, .15); transform: translateY(-6px); }
.hg-page-canvas .hg-reviews-card--interactive.is-hovered::after { opacity: 1; }
.hg-page-canvas .hg-reviews-card--interactive .hg-reviews-icon { transition: transform .24s ease, background .24s ease, color .24s ease; }
.hg-page-canvas .hg-reviews-card--interactive.is-hovered .hg-reviews-icon { transform: translateY(-3px) rotate(-5deg); background: #ff7043; color: #fff; }
.hg-page-canvas .hg-reviews-icon { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: #fff0e9; color: var(--hg-canvas-accent); font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); }
.hg-page-canvas .hg-reviews-card h3 { margin: 0; font-size: 20px; line-height: 1.25; } .hg-page-canvas .hg-reviews-card p { margin: 16px 0 0; color: var(--hg-canvas-muted); line-height: 1.62; }
.hg-page-canvas .hg-reviews-resource-card { min-width: 0; min-height: 255px; display: flex; flex-direction: column; padding: 30px; border: 1px solid var(--hg-canvas-line); border-radius: 20px; background: linear-gradient(145deg, #fff 0%, #f8fcff 100%); box-shadow: 0 16px 34px rgba(17, 59, 105, .07); color: var(--hg-canvas-ink); text-decoration: none; transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease; }
.hg-page-canvas .hg-reviews-resource-card:hover, .hg-page-canvas .hg-reviews-resource-card:focus-visible { transform: translateY(-5px); border-color: #ff7043; background: #fff5f0; box-shadow: 0 22px 42px rgba(224, 91, 46, .16); outline: none; }
.hg-page-canvas .hg-reviews-resource-card__label { align-self: flex-start; padding: 6px 10px; border-radius: 999px; background: #e8f4ff; color: #386a9c; font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); letter-spacing: .08em; text-transform: uppercase; }
.hg-page-canvas .hg-reviews-resource-card h3 { margin: 20px 0 10px; font-size: 22px; line-height: 1.18; letter-spacing: -.025em; }.hg-page-canvas .hg-reviews-resource-card p { margin: 0; color: var(--hg-canvas-muted); line-height: 1.62; }.hg-page-canvas .hg-reviews-resource-card__action { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: auto; padding-top: 26px; color: #d95630; font-weight: var(--hg-font-weight-ui); }.hg-page-canvas .hg-reviews-resource-card__action > span { width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; background: #ffe4d9; transition: transform .22s ease, background .22s ease; }.hg-page-canvas .hg-reviews-resource-card:hover .hg-reviews-resource-card__action > span, .hg-page-canvas .hg-reviews-resource-card:focus-visible .hg-reviews-resource-card__action > span { transform: translateX(4px); background: #ff7043; color: #fff; }
.hg-page-canvas .hg-reviews-steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.hg-page-canvas .hg-reviews-steps article { display: grid; grid-template-columns: 38px 1fr; gap: 15px; padding: 22px; border-radius: 16px; background: #fff; border: 1px solid #dceaf5; }
.hg-page-canvas .hg-reviews-steps article > span { width: 31px; height: 31px; display: grid; place-items: center; border-radius: 50%; background: var(--hg-canvas-accent); color: #fff; font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); }
.hg-page-canvas .hg-reviews-steps h3 { display: inline-block; position: relative; margin: 2px 0 9px; padding-bottom: 7px; font-size: 20px; font-weight: 850; line-height: 1.2; letter-spacing: -.02em; }.hg-page-canvas .hg-reviews-steps h3::after { content: ''; position: absolute; left: 0; bottom: 0; width: 34px; height: 3px; border-radius: 999px; background: var(--hg-canvas-accent); }.hg-page-canvas .hg-reviews-steps p { margin: 0; color: var(--hg-canvas-muted); line-height: 1.55; }
.hg-page-canvas .hg-reviews-note { margin-top: 22px; padding: 18px 20px; border-left: 4px solid #f4b942; border-radius: 10px; background: #fff9e9; color: #526278; line-height: 1.55; }
.hg-page-canvas .hg-reviews-feedback-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 56px; align-items: stretch; }
.hg-page-canvas .hg-reviews-feedback-grid > .hg-reviews-heading { display: flex; flex-direction: column; justify-content: center; margin-bottom: 0; }
.hg-page-canvas .hg-reviews-checklist { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: hg-check; }
.hg-page-canvas .hg-reviews-checklist li { position: relative; counter-increment: hg-check; display: grid; grid-template-columns: 31px 1fr; gap: 12px; padding: 15px 17px; border: 1px solid #dce9f3; border-radius: 13px; background: #fff; color: #405b79; line-height: 1.5; transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease; }
.hg-page-canvas .hg-reviews-checklist li:hover { transform: translateX(5px); border-color: #a9d8f3; box-shadow: 0 10px 24px rgba(26, 91, 144, .08); }
.hg-page-canvas .hg-reviews-checklist li::before { content: counter(hg-check); position: relative; z-index: 1; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: #ffebe4; color: #dd5930; font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); box-shadow: 0 0 0 5px #fff; }
.hg-page-canvas .hg-reviews-checklist li:not(:last-child)::after { content: ''; position: absolute; z-index: 1; top: 42px; bottom: -13px; left: 28px; width: 2px; background: repeating-linear-gradient(to bottom, #9ed3f2 0 5px, transparent 5px 10px); }
.hg-page-canvas .hg-reviews-cta { display: flex; align-items: center; justify-content: space-between; gap: 26px; margin-top: 46px; padding: clamp(26px, 4vw, 44px); border-radius: 22px; color: #fff; background: linear-gradient(105deg, #ff7250, #fb8f44); box-shadow: 0 18px 35px rgba(224, 91, 46, .24); }
.hg-page-canvas .hg-reviews-cta h2 { margin: 0; color: #fff !important; font-size: clamp(25px, 3vw, 34px); } .hg-page-canvas .hg-reviews-cta p { max-width: 610px; margin: 9px 0 0; color: #fff !important; line-height: 1.55; }
.hg-page-canvas .hg-reviews-cta a { flex: none; padding: 14px 19px; border-radius: 999px; background: #fff; color: #bd4b2d; font-weight: var(--hg-font-weight-ui); text-decoration: none; white-space: nowrap; }
.hg-page-canvas .hg-reviews-faq { display: grid; gap: 15px; counter-reset: hg-faq; }.hg-page-canvas .hg-reviews-faq details { overflow: hidden; border: 1px solid #d7e7f4; border-radius: 18px; background: linear-gradient(110deg,#fff,#f8fcff); box-shadow: 0 12px 27px rgba(17,59,105,.06); transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease; }.hg-page-canvas .hg-reviews-faq details:hover { transform: translateY(-2px); border-color: #9fcfee; box-shadow: 0 18px 34px rgba(17,59,105,.1); }.hg-page-canvas .hg-reviews-faq details[open] { border-color: #7fbee9; background: linear-gradient(118deg,#f2faff,#fff); box-shadow: 0 20px 38px rgba(26,106,168,.13); }.hg-page-canvas .hg-reviews-faq summary { display: grid; grid-template-columns: 40px 1fr 32px; gap: 14px; align-items: center; min-height: 78px; padding: 18px 22px; color: var(--hg-canvas-ink); cursor: pointer; font-family: inherit; font-weight: var(--hg-font-weight-ui); line-height: 1.42; list-style: none; }.hg-page-canvas .hg-reviews-faq summary::-webkit-details-marker { display: none; }.hg-page-canvas .hg-reviews-faq summary::before { content: counter(hg-faq, decimal-leading-zero); counter-increment: hg-faq; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: #e8f4ff; color: #1d5c9f; font-size: var(--hg-font-size-body); font-weight: var(--hg-font-weight-ui); letter-spacing: .04em; }.hg-page-canvas .hg-reviews-faq summary::after { content: '+'; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #fff0e9; color: #e15c36; font-size: 23px; font-weight: var(--hg-font-weight-body); line-height: 1; transition: transform .22s ease, background .22s ease, color .22s ease; }.hg-page-canvas .hg-reviews-faq details[open] summary::before { background: #1d5c9f; color: #fff; }.hg-page-canvas .hg-reviews-faq details[open] summary::after { transform: rotate(45deg); background: #ff7043; color: #fff; }.hg-page-canvas .hg-reviews-faq summary:focus-visible { outline: 3px solid rgba(255,112,67,.55); outline-offset: -4px; }.hg-page-canvas .hg-reviews-faq p { margin: 0 22px 22px 76px; padding: 17px 19px; border-left: 3px solid #ff7043; border-radius: 0 12px 12px 0; background: rgba(255,255,255,.76); color: var(--hg-canvas-muted); line-height: 1.65; }.hg-page-canvas .hg-reviews-faq p a { font-weight: var(--hg-font-weight-ui); }
@media (max-width: 900px) { .hg-page-canvas .hg-reviews-hero__grid, .hg-page-canvas .hg-reviews-feedback-grid { grid-template-columns: 1fr; } .hg-page-canvas .hg-reviews-hero__art { order: -1; min-height: 300px; } .hg-page-canvas .hg-reviews-hero__feature-fish, .hg-page-canvas .hg-reviews-fish-trigger img { min-height: 0; } .hg-page-canvas .hg-reviews-card-grid--three { grid-template-columns: 1fr; } }
@media (max-width: 640px) { .hg-page-canvas .hg-reviews-shell, .hg-page-canvas .hg-reviews-shell--narrow { width: min(100% - 32px, 1180px); } .hg-page-canvas .hg-reviews-hero { padding-block: 22px 48px; } .hg-page-canvas .hg-reviews-hero__art { min-height: 225px; } .hg-page-canvas .hg-reviews-hero__feature-fish, .hg-page-canvas .hg-reviews-fish-trigger img { min-height: 0; } .hg-page-canvas .hg-reviews-steps { grid-template-columns: 1fr; } .hg-page-canvas .hg-reviews-card { padding: 24px; } .hg-page-canvas .hg-reviews-cta { align-items: flex-start; flex-direction: column; } .hg-page-canvas .hg-reviews-faq summary { grid-template-columns: 36px 1fr 28px; gap: 11px; min-height: 72px; padding: 16px; font-size: var(--hg-font-size-body); } .hg-page-canvas .hg-reviews-faq summary::before { width: 36px; height: 36px; } .hg-page-canvas .hg-reviews-faq p { margin: 0 16px 16px; padding: 15px; } }