/*
Theme Name: Sygno Blocks
Theme URI: https://www.sygno.com
Author: Sygno
Description: Block theme for the Sygno homepage (wireframe V5). Everything is editable in the WordPress block editor: create a page, pick the "Sygno homepage" pattern and choose the "Landing page (no title)" template.
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 7.4
Version: 1.10.1
License: GPLv2 or later
Text Domain: sygno-blocks
*/
html { scroll-behavior: smooth; }
.wp-block-group[id] { scroll-margin-top: 80px; }
.sygno-header { position: sticky; top: 0; z-index: 20; }
.wp-block-button.is-style-outline > .wp-block-button__link { border-width: 1px; }
@media (max-width: 781px) {
	.has-huge-font-size { font-size: 44px !important; }
	.has-x-large-font-size { font-size: 32px !important; }
	.has-xx-large-font-size { font-size: 40px !important; }
}
/* Full-width sections sit flush against each other */
.wp-site-blocks > * { margin-block-start: 0; }
.wp-block-post-content > .alignfull { margin-block-start: 0; margin-block-end: 0; }
:where(.has-border-color) { border-style: solid; }

/* Animated radar (from www.sygno.com) */
.sygno-radar { width: 400px; height: 400px; max-width: 100%; margin: 0 auto; position: relative; border-radius: 50%; background: #65006B; overflow: hidden; box-shadow: 0 7px 29px 0 #440348; }
.sygno-radar .spinner { position: relative; width: 100%; height: 100%; border: 5px solid #fff; border-radius: 50%; box-sizing: border-box; overflow: hidden; }
.sygno-radar .arc { position: absolute; top: 50%; left: 50%; border-radius: 50%; transform: translate(-50%, -50%); }
.sygno-radar .arc:nth-child(1) { width: 40%; height: 40%; border: 2px solid #fff; }
.sygno-radar .arc:nth-child(2) { width: 60%; height: 60%; border: 3px solid #fff; }
.sygno-radar .arc:nth-child(3) { width: 80%; height: 80%; border: 4px solid #fff; }
.sygno-radar .triangle { position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: .4; background: linear-gradient(90deg, #fff 0%, #700077 100%) 0 0 / 200% 200%; clip-path: polygon(50% 50%, 25% 100%, 75% 100%); rotate: 190deg; animation: sygno-rotate 8s linear 1s infinite, sygno-gradient 4s linear infinite; }
.sygno-radar .start { position: absolute; top: 50%; left: 50%; width: 10%; height: 10%; border-radius: 50%; background: #fff; transform: translate(-50%, -50%); }
.sygno-radar .dot { position: absolute; width: 3.75%; height: 3.75%; border-radius: 50%; background: #1AEBB1; opacity: 0; animation: sygno-fadein 1s ease forwards; }
.sygno-radar .dot:nth-child(1) { top: 52%; right: 9%; animation-delay: 2.3s; }
.sygno-radar .dot:nth-child(2) { top: 69%; right: 8%; animation-delay: 2.6s; }
.sygno-radar .dot:nth-child(3) { top: 64%; right: 22%; animation-delay: 2.6s; }
.sygno-radar .dot:nth-child(4) { top: 34%; left: 11.5%; animation-delay: 6.6s; }
.sygno-radar .dot:nth-child(5) { top: 25%; left: 24%; animation-delay: 6.9s; }
.sygno-radar .dot:nth-child(6) { top: 40%; left: 34%; animation-delay: 6.8s; }
.sygno-radar .dot:nth-child(7) { top: 66%; left: 35%; animation-delay: 13s; }
.sygno-radar .dot:nth-child(8) { top: 65%; left: 21.5%; animation-delay: 13.2s; }
.sygno-radar .dot:nth-child(9) { top: 84%; left: 38%; animation-delay: 12.3s; }
@keyframes sygno-rotate { 100% { transform: rotate(360deg); } }
@keyframes sygno-gradient { 0%, 100% { background-position: 100% 50%; } 50% { background-position: 0% 50%; } }
@keyframes sygno-fadein { to { opacity: 1; } }
@media (max-width: 782px) { .sygno-radar { width: 300px; height: 300px; } }
@media (prefers-reduced-motion: reduce) { .sygno-radar .triangle { animation: none; } .sygno-radar .dot { animation: none; opacity: 1; } }

/* "How it works" steps joined by a dashed line, as on newsite */
.sygno-steps { position: relative; }
.sygno-steps::before { content: ""; position: absolute; top: 40px; left: 17%; right: 17%; border-top: 2px dashed #D9C6DC; z-index: 0; }
.sygno-steps .wp-block-image { position: relative; z-index: 1; }
@media (max-width: 781px) { .sygno-steps::before { display: none; } }

/* FAQ (Details blocks) */
.sygno-faq { border-bottom: 1px solid #EBDFEC; padding: 18px 0; }
.sygno-faq summary { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 20px; cursor: pointer; color: #1E1028; }
.sygno-faq summary::marker { color: #65006B; }
.sygno-faq p { color: #4E3D58; margin-top: 12px; }

/* Whitepaper covers */
.sygno-cover img { border-radius: 6px; box-shadow: 0 18px 40px rgba(58, 31, 64, 0.22); }

/* Placeholder where a form plugin or HubSpot embed goes */
.sygno-form-placeholder { border: 1px dashed #B79CBD; border-radius: 10px; padding: 28px; color: #7A6680; font-size: 15px; background: #fff; }

/* Checklist */
.sygno-checklist { list-style: none; padding-left: 0; }
.sygno-checklist li { position: relative; padding-left: 32px; margin-bottom: 16px; color: #4E3D58; }
.sygno-checklist li::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 50%; background: #1AEBB1; }

/* Radar: two dots turn red when the beam passes (detection) */
.sygno-radar .dot:nth-child(1) { animation: sygno-fadein 1s ease 2.3s forwards, sygno-flag-a 8s linear 1s infinite; }
.sygno-radar .dot:nth-child(4) { animation: sygno-fadein 1s ease 6.6s forwards, sygno-flag-b 8s linear 1s infinite; }
@keyframes sygno-flag-a {
	0%, 23% { background: #1AEBB1; box-shadow: 0 0 0 0 rgba(255, 92, 108, 0); transform: scale(1); }
	24% { background: #FF5C6C; box-shadow: 0 0 0 10px rgba(255, 92, 108, .35); transform: scale(1.5); }
	32% { background: #FF5C6C; box-shadow: 0 0 0 4px rgba(255, 92, 108, .25); transform: scale(1.15); }
	70% { background: #FF5C6C; box-shadow: 0 0 0 4px rgba(255, 92, 108, .25); transform: scale(1.15); }
	74%, 100% { background: #1AEBB1; box-shadow: 0 0 0 0 rgba(255, 92, 108, 0); transform: scale(1); }
}
@keyframes sygno-flag-b {
	0%, 28% { background: #FF5C6C; box-shadow: 0 0 0 4px rgba(255, 92, 108, .25); transform: scale(1.15); }
	32%, 77% { background: #1AEBB1; box-shadow: 0 0 0 0 rgba(255, 92, 108, 0); transform: scale(1); }
	78% { background: #FF5C6C; box-shadow: 0 0 0 10px rgba(255, 92, 108, .35); transform: scale(1.5); }
	86%, 100% { background: #FF5C6C; box-shadow: 0 0 0 4px rgba(255, 92, 108, .25); transform: scale(1.15); }
}
@media (prefers-reduced-motion: reduce) { .sygno-radar .dot:nth-child(1), .sygno-radar .dot:nth-child(4) { animation: none; opacity: 1; background: #FF5C6C; } }

/* "How it works": a dot travels along the dashed line, as on newsite */
.sygno-steps::after { content: ""; position: absolute; top: 35px; left: 17%; width: 12px; height: 12px; margin-left: -6px; border-radius: 50%; background: #1AEBB1; box-shadow: 0 0 0 6px rgba(26, 235, 177, .2); z-index: 0; animation: sygno-flow 5s ease-in-out infinite; }
@keyframes sygno-flow { 0% { left: 17%; opacity: 0; } 8% { opacity: 1; } 45%, 55% { left: 50%; } 92% { opacity: 1; } 100% { left: 83%; opacity: 0; } }
.sygno-steps .wp-block-image img { box-shadow: 0 12px 28px -14px rgba(101, 0, 107, .45); border-radius: 50%; }
@media (max-width: 781px) { .sygno-steps::after { display: none; } }
@media (prefers-reduced-motion: reduce) { .sygno-steps::after { display: none; } }

/* LinkedIn button with logo */
.sygno-btn-linkedin .wp-block-button__link { display: inline-flex; align-items: center; gap: 10px; }
.sygno-btn-linkedin .wp-block-button__link::before { content: ""; width: 18px; height: 18px; flex: none; background: currentColor; -webkit-mask: var(--sygno-li) no-repeat center / contain; mask: var(--sygno-li) no-repeat center / contain; }
:root { --sygno-li: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20.45 20.45h-3.56v-5.57c0-1.33-.02-3.04-1.85-3.04-1.85 0-2.14 1.45-2.14 2.94v5.67H9.35V9h3.41v1.56h.05c.48-.9 1.64-1.85 3.37-1.85 3.6 0 4.27 2.37 4.27 5.46v6.28zM5.34 7.43a2.06 2.06 0 1 1 0-4.13 2.06 2.06 0 0 1 0 4.13zM7.12 20.45H3.56V9h3.56v11.45zM22.23 0H1.77C.79 0 0 .77 0 1.73v20.54C0 23.23.79 24 1.77 24h20.45c.98 0 1.78-.77 1.78-1.73V1.73C24 .77 23.2 0 22.22 0z'/%3E%3C/svg%3E"); }

/* Office map with pulsing pin (as on newsite) */
.sygno-map { position: relative; width: 100%; aspect-ratio: 1372 / 771; border-radius: 14px; overflow: hidden; box-shadow: 0 22px 50px -24px rgba(101, 0, 107, .45); }
.sygno-map img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; margin: 0; }
.sygno-map .pin { position: absolute; left: 58.4%; top: 48.74%; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: #65006B; box-shadow: 0 0 0 3px #fff, 0 4px 10px rgba(101, 0, 107, .4); }
/* Thick ring close around the pin (as in the logo), plus a thin ring that travels across Europe */
.sygno-map .pin i { position: absolute; inset: 0; border-radius: 50%; }
.sygno-map .pin i:first-child { border: 2px solid #65006B; animation: sygno-pin-near 2.8s ease-out infinite; }
.sygno-map .pin i + i { border: 2px solid #65006B; background: rgba(101, 0, 107, .07); animation: sygno-pin-far 4.5s cubic-bezier(.2, .6, .4, 1) .6s infinite; }
@keyframes sygno-pin-near { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(5); opacity: 0; } }
@keyframes sygno-pin-far { 0% { inset: 0; opacity: 0; } 10% { opacity: 1; } 65% { opacity: .55; } 100% { inset: -170px; opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .sygno-map .pin i { animation: none; display: none; } }

/* Issues row: from today's problem to the Sygno solution */
.sygno-issue { overflow: hidden; box-shadow: 0 16px 36px -24px rgba(58, 31, 64, .4); display: flex; flex-direction: column; }
.sygno-issue > * { margin-block-start: 0 !important; }
.sygno-issue-today { min-height: 270px; display: flex; flex-direction: column; justify-content: center; }
.sygno-issue-fix { position: relative; flex: 1; }
.sygno-issue-fix::before { content: ""; position: absolute; top: -24px; left: 50%; margin-left: -24px; width: 48px; height: 48px; border-radius: 50%; box-shadow: 0 0 0 6px #fff; background: #65006B url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center / 22px no-repeat; }
.sygno-eyebrow { letter-spacing: .08em; text-transform: uppercase; font-weight: 700; font-size: 12px !important; }
.sygno-amlr-label { color: #65006B; margin-right: 10px; }

.sygno-issue-topic { margin-top: 4px !important; }

/* AMLR bar badge */
.sygno-badge { display: inline-block; background: #3A1F40; color: #fff; border-radius: 999px; padding: 6px 14px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; font-size: 12px !important; margin: 0; }

/* Heading kept on one line on desktop */
@media (min-width: 960px) {
	.wp-block-heading.sygno-oneline { white-space: nowrap; font-size: clamp(30px, 3.4vw, 42px) !important; }
}

/* Contact form (Fluent Forms) in Sygno style */
.sygno-form { margin-top: 8px; }
.sygno-form .ff-el-group { margin-bottom: 18px; }
.sygno-form .ff-el-input--label label { font-weight: 700; color: #1E1028; font-size: 15px; }
.sygno-form .ff-el-form-control { border: 1px solid #EBDFEC; border-radius: 8px; background: #fff; padding: 12px 14px; font-family: inherit; font-size: 16px; color: #1E1028; }
.sygno-form .ff-el-form-control:focus { border-color: #65006B; box-shadow: 0 0 0 3px rgba(101, 0, 107, .12); outline: none; }
.sygno-form .ff-el-tc label, .sygno-form .ff_t_c { font-size: 14px; color: #4E3D58; line-height: 1.5; }
.sygno-form .ff-btn-submit { background: #65006B !important; border-radius: 8px !important; font-family: inherit; font-weight: 700; font-size: 15px !important; padding: 14px 26px !important; }
.sygno-form .ff-btn-submit:disabled { background: #65006B !important; opacity: .6; }
.sygno-form .ff-btn-submit:hover { background: #3A1F40 !important; }
.sygno-form .ff-message-success { border: 0; border-radius: 10px; background: #fff; color: #1E1028; box-shadow: none; padding: 20px; }

/* Cookie consent banner */
.sygno-cookie-link { display: none; }
.sygno-consent-on .sygno-cookie-link { display: inline; }
.sygno-consent { position: fixed; z-index: 9999; left: 24px; bottom: 24px; max-width: 520px; background: #fff; color: #1E1028; border-radius: 16px; box-shadow: 0 24px 60px -20px rgba(58, 31, 64, .45), 0 0 0 1px #EBDFEC; padding: 26px 28px; font-size: 15px; line-height: 1.6; }
.sygno-consent[hidden] { display: none; }
.sygno-consent p { margin: 0 0 14px; color: #4E3D58; }
.sygno-consent .sygno-consent-title { font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 19px; color: #1E1028; margin-bottom: 8px; }
.sygno-consent a { color: #65006B; }
.sygno-consent-prefs { border-top: 1px solid #EBDFEC; margin: 4px 0 14px; }
.sygno-consent-prefs[hidden] { display: none; }
.sygno-consent-row { display: flex; gap: 16px; justify-content: space-between; align-items: center; padding: 12px 0; border-bottom: 1px solid #EBDFEC; font-size: 14px; color: #4E3D58; cursor: pointer; }
.sygno-consent-row strong { color: #1E1028; }
.sygno-consent-row input { width: 20px; height: 20px; accent-color: #65006B; flex: none; }
.sygno-consent-buttons { display: flex; flex-wrap: wrap; gap: 10px; }
.sygno-consent-buttons button { flex: 1 1 auto; font-family: var(--wp--preset--font-family--heading); font-weight: 700; font-size: 14px; padding: 11px 16px; border-radius: 8px; border: 1px solid #65006B; background: #fff; color: #65006B; cursor: pointer; }
.sygno-consent-buttons button[hidden] { display: none; }
.sygno-consent-buttons .sygno-c-primary, .sygno-consent-buttons [data-c=save] { background: #65006B; color: #fff; }
.sygno-consent-buttons button:hover { background: #3A1F40; border-color: #3A1F40; color: #fff; }
@media (max-width: 600px) { .sygno-consent { left: 12px; right: 12px; bottom: 12px; max-width: none; padding: 22px; } }

/* Legal pages */
.sygno-legal h2 { font-size: 28px; margin-top: 48px; }
.sygno-legal h3 { font-size: 21px; margin-top: 32px; }
.sygno-legal h4 { font-size: 17px; margin-top: 24px; }
.sygno-legal p, .sygno-legal li { color: #4E3D58; }
.sygno-legal li { margin-bottom: 8px; }