/*
<?php
header('Content-type:text/css');
$colorClick="#fc3";
$colorCopy1="#fff";
$colorBgAlt="#ccc";
$colorBgFooter="#131211";
$colorBgService="#00a999";
$colorBorderFooter=$colorBorderMenu=$colorButtonFocus="#333";
$colorBorderPrimary="#1EAEDB";
$colorBorders="#e1e1e1"; #code, th, td, hr
$colorButtonBorders="#33c3f0";
*/
/*! normalize.css v3.0.2 | MIT License | git.io/normalize *//** 1. Set default font family to sans-serif. 2. Prevent iOS text size adjust after orientation change, without disabling user zoom. */ html{font-family:sans-serif; /* 1 */-ms-text-size-adjust:100%; /* 2 */-webkit-text-size-adjust:100%; /* 2 */} /** Remove default margin. */ body{margin:0;} /* HTML5 display definitions ========================================================================== *//* Correct `block` display not defined for any HTML5 element in IE 8/9. Correct `block` display not defined for `details` or `summary` in IE 10/11 and Firefox. Correct `block` display not defined for `main` in IE 11. */ article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary{display:block;} /** 1. Correct `inline-block` display not defined in IE 8/9. 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera. */ audio, canvas, progress, video{display:inline-block; /* 1 */vertical-align:baseline; /* 2 */} /** Prevent modern browsers from displaying `audio` without controls. Remove excess height in iOS 5 devices. */ audio:not([controls]){display:none;height:0;} /** Address `[hidden]` styling not present in IE 8/9/10. Hide the `template` element in IE 8/9/11, Safari, and Firefox < 22. */ [hidden], template{display:none;} /* Links ========================================================================== *//** Remove the gray background color from active links in IE 10. */ a{background-color:transparent;} /** Improve readability when focused and also mouse hovered in all browsers. */ a:active, a:hover{outline:0;} /* Text-level semantics ========================================================================== *//** Address styling not present in IE 8/9/10/11, Safari, and Chrome. */ abbr[title]{border-bottom:1px dotted;} /* Address style set to `bolder` in Firefox 4+, Safari, and Chrome. */ b, strong{font-weight:bold; color:#fff;} /* Address styling not present in Safari and Chrome. */ dfn{font-style:italic;} /** Address variable `h1` font-size and margin within `section` and `article` contexts in Firefox 4+, Safari, and Chrome. */ h1{font-size:2em;margin:0.67em 0;} /** Address styling not present in IE 8/9. */ mark{background:#ff0;color:#000;} /** Address inconsistent and variable font size in all browsers. */ small{font-size:80%;} /** Prevent `sub` and `sup` affecting `line-height` in all browsers. */ sub, sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;} sup{top:-0.5em;} sub{bottom:-0.25em;} /* Embedded content ========================================================================== *//** Remove border when inside `a` element in IE 8/9/10. */ img{border:0;} /** Correct overflow not hidden in IE 9/10/11. */ svg:not(:root){overflow:hidden;} /* Grouping content ========================================================================== *//* Address margin not present in IE 8/9 and Safari. */ figure{margin:1em 40px;} /** Address differences between Firefox and other browsers. */ hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;} /** Contain overflow in all browsers. */ pre{overflow:auto;} /** Address odd `em`-unit font size rendering in all browsers. */ code, kbd, pre, samp{font-family:monospace, monospace;font-size:1em;} /* Forms ========================================================================== *//** Known limitation:by default, Chrome and Safari on OS X allow very limited styling of `select`, unless a `border` property is set. *//** 1. Correct color not being inherited. Known issue:affects color of disabled elements. 2. Correct font properties not being inherited. 3. Address margins set differently in Firefox 4+, Safari, and Chrome. */ button, input, optgroup, select, textarea{color:inherit; /* 1 */font:inherit; /* 2 */margin:0; /* 3 */} /** Address `overflow` set to `hidden` in IE 8/9/10/11. */ button{overflow:visible;} /** Address inconsistent `text-transform` inheritance for `button` and `select`. All other form control elements do not inherit `text-transform` values. Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera. Correct `select` style inheritance in Firefox. */ button, select{text-transform:none;} /** 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` and `video` controls. 2. Correct inability to style clickable `input` types in iOS. 3. Improve usability and consistency of cursor style between image-type `input` and others. */ button, html input[type="button"], /* 1 */input[type="reset"], input[type="submit"]{-webkit-appearance:button; /* 2 */cursor:pointer; /* 3 */} /** Re-set default cursor for disabled elements. */ button[disabled], html input[disabled]{cursor:default;} /** Remove inner padding and border in Firefox 4+. */ button::-moz-focus-inner, input::-moz-focus-inner{border:0;padding:0;} /** Address Firefox 4+ setting `line-height` on `input` using `!important` in the UA stylesheet. */ input{line-height:normal;} /** It`s recommended that you don`t attempt to style these elements. Firefox`s implementation doesn`t respect box-sizing, padding, or width. 1. Address box sizing set to `content-box` in IE 8/9/10. 2. Remove excess padding in IE 8/9/10. */ input[type="checkbox"], input[type="radio"]{box-sizing:border-box; /* 1 */padding:0; /* 2 */} /** Fix the cursor style for Chrome`s increment/decrement buttons. For certain `font-size` values of the `input`, it causes the cursor style of the decrement button to change from `default` to `text`. */ input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button{height:auto;} /** 1. Address `appearance` set to `searchfield` in Safari and Chrome. 2. Address `box-sizing` set to `border-box` in Safari and Chrome (include `-moz` to future-proof). */ input[type="search"]{-webkit-appearance:textfield; /* 1 */-moz-box-sizing:content-box;-webkit-box-sizing:content-box; /* 2 */box-sizing:content-box;} /** Remove inner padding and search cancel button in Safari and Chrome on OS X. Safari (but not Chrome) clips the cancel button when the search input has padding (and `textfield` appearance). */ input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;} /** Define consistent border, margin, and padding. */ fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;} /** 1. Correct `color` not being inherited in IE 8/9/10/11. 2. Remove padding so people aren`t caught out if they zero out fieldsets. */ legend{border:0; /* 1 */padding:0; /* 2 */} /** Remove default vertical scrollbar in IE 8/9/10/11. */ textarea{overflow:auto;} /** Don`t inherit the `font-weight` (applied by a rule above). NOTE:the default cannot safely be changed in Chrome and Safari on OS X. */ optgroup{font-weight:bold;} /* Tables ========================================================================== *//** Remove most spacing between table cells. */ table{border-collapse:collapse;border-spacing:0;} td, th{padding:0;}
/* Skeleton V2.0.4 Copyright 2014, Dave Gamache www.getskeleton.com Free to use under the MIT license. http://www.opensource.org/licenses/mit-license.php 12/29/2014 */
/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- 1 Grid
- 2 Base Styles
- 3 Typography
- 4 Links
- 5 Buttons
- 6 Forms
- 7 Lists
- 8 Code
- 9 Tables
- 10 Spacing
- 11 Utilities
- 12 Miscellaneous
- 13 Images
- 14 Clearing
- 15 Media Queries */

html {scroll-behavior: smooth;}

/* MOBILE FIRST DESIGN*/
/* 1 Grid –––––––––––––––––––––––––––––––––––––––––––––––––– */
*{box-sizing:border-box;position: relative;}
section{position:relative;}
body section:nth-of-type(2).dark::after {content: '';position: absolute;top: 0; left: 0; right: 0; bottom: 0;z-index: -1;overflow: hidden;pointer-events: none;opacity: 0.4;background-image: url('random-circles.php?v=1');background-size: cover;}

/*default*/
body section:nth-of-type(2).dark                    {background: linear-gradient(to right, #727, #536, #345, #333) no-repeat;} /* not yet used*/
/* Awareness — cool blue to blue-teal */                                                                                       /* funnel distance */
body.blogs section:nth-of-type(2).dark              {background: linear-gradient(to right, #056, #536, #345, #333) no-repeat;} /* 10% */
body.field-notes section:nth-of-type(2).dark        {background: linear-gradient(to right, #146, #536, #345, #333) no-repeat;} /* 15% */
body.niches section:nth-of-type(2).dark             {background: linear-gradient(to right, #158, #536, #345, #333) no-repeat;} /* 20% */
body.micro-educationals section:nth-of-type(2).dark {background: linear-gradient(to right, #169, #536, #345, #333) no-repeat;} /* 25% */
body.parents section:nth-of-type(2).dark            {background: linear-gradient(to right, #17a, #536, #345, #333) no-repeat;} /* 25% */
body.pillars section:nth-of-type(2).dark            {background: linear-gradient(to right, #18b, #536, #345, #333) no-repeat;} /* 25% */
/* Consideration — muted greens */
body.mistakes section:nth-of-type(2).dark           {background: linear-gradient(to right, #252, #536, #345, #333) no-repeat;} /* 30% */
body.utilities section:nth-of-type(2).dark          {background: linear-gradient(to right, #363, #536, #345, #333) no-repeat;} /* 30% */
body.guides section:nth-of-type(2).dark             {background: linear-gradient(to right, #374, #536, #345, #333) no-repeat;} /* 35% */
body.problems section:nth-of-type(2).dark           {background: linear-gradient(to right, #485, #536, #345, #333) no-repeat;} /* 40% */
body.diagnostics section:nth-of-type(2).dark        {background: linear-gradient(to right, #596, #536, #345, #333) no-repeat;} /* 55% */
/* Evaluation — purples */
body.cases section:nth-of-type(2).dark              {background: linear-gradient(to right, #516, #536, #345, #333) no-repeat;} /* 65% */
body.comparisons section:nth-of-type(2).dark        {background: linear-gradient(to right, #627, #536, #345, #333) no-repeat;} /* 65% */
body.products section:nth-of-type(2).dark           {background: linear-gradient(to right, #727, #536, #345, #333) no-repeat;} /* 70% */
body.trusts section:nth-of-type(2).dark             {background: linear-gradient(to right, #838, #536, #345, #333) no-repeat;} /* 70% */
body.facets section:nth-of-type(2).dark             {background: linear-gradient(to right, #848, #536, #345, #333) no-repeat;} /* 75% */
/* Conversion — amber-gold */
body.campaigns section:nth-of-type(2).dark          {background: linear-gradient(to right, #a71, #633, #345, #333) no-repeat;} /* 80% */
body.conversions section:nth-of-type(2).dark        {background: linear-gradient(to right, #b81, #633, #345, #333) no-repeat;} /* 90% */
section.kettle {background: linear-gradient(to right, #750, #536, #345, #333) no-repeat;}
section.kettle div.container::before {content: '';position: absolute;top: 120px; left: -150px; width: 150px; height: 150px; opacity:0.3; background-image: url(/theme/marketing-kettle.svg);background-repeat: no-repeat;background-size: contain;}
section.dark.kettle[data-cms-section="body2"] div.container::before{display:none;}

.container{position:relative;width:100%;max-width:66rem;margin:0 auto; padding:1rem 2rem 6rem 2rem;counter-reset: card-counter;}
#proposition .container{padding-top: 8rem; padding-bottom: 0;}
@media(min-width: 481px){.container{padding:4rem 2rem 8rem 2rem;}}
@media(min-width: 1024px){.container{padding:12rem 2rem 16rem 2rem;} section:nth-of-type(2) .container{padding:9rem 2rem 12rem 2rem;}}
/* Base positioning — all sections from #3 onwards */
section:nth-child(n+3)::before, section#invitation-to-act::before {opacity: 1;filter: grayscale(0%);position: absolute;left: 50%;top: -22px;transform: translateX(-50%) scale(0.8);z-index: 999;}
/* 7 ornament rules cycling the full pattern */
section:nth-child(9n+3)::before { content: url('/theme/ornament-heart.svg'); }
section:nth-child(9n+4)::before { content: url('/theme/ornament-floral.svg'); }
section:nth-child(9n+5)::before,
section:nth-child(9n+0)::before { content: url('/theme/ornament-intertwine.svg'); }
section:nth-child(9n+6)::before { content: url('/theme/ornament-twigs.svg'); }
section:nth-child(9n+7)::before,
section:nth-child(9n+2)::before { content: url('/theme/ornament-life.svg'); }
section:nth-child(9n+8)::before { content: url('/theme/ornament-branch.svg'); }
section:nth-child(9n+1)::before { content: url('/theme/ornament-leafy.svg'); }
section#proposition::before { content: none; }

/* invitation-to-act pinned to heart */
section#invitation-to-act::before { content: url('/theme/ornament-act.svg'); }
section#invitation-to-act div.container::before {content: '';position: absolute;top: 120px; left: -140px; width: 150px; height: 150px; opacity:0.4; background-image: url(/theme/marketing-coffee.svg);background-repeat: no-repeat;background-size: contain;}

@media (min-width: 481px) {  section:nth-child(n+3)::before, section#invitation-to-act::before { transform: translateX(-50%) scale(1); }  }
@media (min-width: 769px) {  section:nth-child(n+3)::before, section#invitation-to-act::before { transform: translateX(-50%) scale(1.2); top: -20px; }  }

.dark, .light, .flat{position: relative; z-index:0;}
/*.dark::after{content:'';background:url('/theme/sunlight-lens-blur.svg');position:absolute; top:0;left:0;right:0;bottom:0;opacity:0.7; z-index:-1; background-size: cover;}*/
.dark{background:#30343a/*'.$colorBgService.'*/;background:radial-gradient(circle at top left, #345,#333) no-repeat;background-size: 130% 130%;}
.light{background:#40444a/*'.$colorBgService.'*/;background:radial-gradient(circle at top left, #456,#444) no-repeat;background-size: 130% 130%;}
.flat{background-color:#202224/*'.$colorBgAlt.'*/; background:radial-gradient(circle at top left, #234,#222) no-repeat;background-size: 130% 130%;}

/* Staggered gentle deceleration animation - updated for container structure */
.dark > *, .dark .container > *, .light > *, .light .container > *, .flat > *, .flat .container > * {transform: translateY(25px);transition: opacity 0.9s cubic-bezier(0.165, 0.84, 0.44, 1), transform 0.9s cubic-bezier(0.165, 0.84, 0.44, 1);}
.dark.visible > *:nth-child(1), .dark.visible .container > *:nth-child(1), .light.visible > *:nth-child(1), .light.visible .container > *:nth-child(1), .flat.visible > *:nth-child(1), .flat.visible .container > *:nth-child(1) {transition-delay: 0.15s;}
.dark.visible > *:nth-child(2), .dark.visible .container > *:nth-child(2), .light.visible > *:nth-child(2), .light.visible .container > *:nth-child(2), .flat.visible > *:nth-child(2), .flat.visible .container > *:nth-child(2) {transition-delay: 0.3s;}
.dark.visible > *:nth-child(3), .dark.visible .container > *:nth-child(3), .light.visible > *:nth-child(3), .light.visible .container > *:nth-child(3), .flat.visible > *:nth-child(3), .flat.visible .container > *:nth-child(3) {transition-delay: 0.45s;}
.dark.visible > *:nth-child(4), .dark.visible .container > *:nth-child(4), .light.visible > *:nth-child(4), .light.visible .container > *:nth-child(4), .flat.visible > *:nth-child(4), .flat.visible .container > *:nth-child(4) {transition-delay: 0.6s;}
.dark.visible > *:nth-child(5), .dark.visible .container > *:nth-child(5), .light.visible > *:nth-child(5), .light.visible .container > *:nth-child(5), .flat.visible > *:nth-child(5), .flat.visible .container > *:nth-child(5) {transition-delay: 0.75s;}
.dark.visible > *:nth-child(6), .dark.visible .container > *:nth-child(6), .light.visible > *:nth-child(6), .light.visible .container > *:nth-child(6), .flat.visible > *:nth-child(6), .flat.visible .container > *:nth-child(6) {transition-delay: 0.9s;}
.dark.visible > *, .dark.visible .container > *, .light.visible > *, .light.visible .container > *, .flat.visible > *, .flat.visible .container > * {opacity: 1;transform: translateY(0);}
.dark > picture.bg-image, .light > picture.bg-image{transform:translateY(0);}
.dark > div.container, .light > div.container{transform:translateY(12px);}

footer{padding:5rem 20px; margin:0; background:#131211/*'.$colorBgFooter.'*/; background:radial-gradient(circle at top left, #111, #201c34, #000) no-repeat;background-size: 120% 120%;}
#legal{margin:3rem 5%;padding-top:3rem; border-top:1px solid #333/*'.$colorBorderFooter.'*/;}
#foot-menu{margin:3rem 5% 6rem 5%;}
#brand-logo{position:absolute;top:0;left:0;z-index:99999;padding:0.8rem;}
div.section{margin: 1rem 0;position:relative;}
.grid + h2{margin-top: 8rem;}
h2.deeper-dive{color:#013E40;font-size: 5rem;font-weight:200;line-height: 0.96; border-left: 1.6rem solid #013E4055; padding-left: 3.2rem; margin-top:-3rem; margin-bottom:-3rem; border-radius: 1.6rem;}
h2.deeper-dive span{display:block; font-size: 1.6rem;font-weight:bold; color:#6df; text-transform: uppercase; letter-spacing: 1.3rem; margin-top:3rem; }
h2.deeper-dive::first-letter{font-family: zzz, kiro; font-size:100%;padding-right:0;}
@media(min-width: 481px){div.section{margin: 8rem 0;}}
.grid{display: grid; gap: 0.8rem;}
.grid.cards{margin-bottom: 4.2rem;}
@media (min-width: 768px){
 .grid-2{grid-template-columns: repeat(2, 1fr);}
 .grid-3{grid-template-columns: repeat(3, 1fr);}
}
.awards{ padding: 2rem; background: #00000011; border:1px solid #00000033; border-radius: 1rem;}
.awards svg{width:20rem;height:auto; margin:0;}
#legal .footer-awards {display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:1.5rem 3rem; align-items:start; max-width:600px; margin-top:1rem;}
#legal .footer-awards .award {display:flex; flex-direction:column; align-items:center; text-align:center; gap:0.5rem; padding:0.75rem; border-radius:8px; transition:transform 0.2s ease, background-color 0.2s ease;}
#legal .footer-awards .award:hover {transform:scale(1.06); background-color:#ffcc3322;}
#legal .footer-awards .award img {width:auto; object-fit:contain; max-width:162px; height:auto;}
#legal .footer-awards .award a:hover {background:none;}
#legal .footer-awards .award p {color:#c5c; margin:0 0 5rem 0;}
#legal .footer-awards .award:nth-of-type(2) p {color:#CFBA83;}
#legal .footer-awards .award:nth-of-type(3) p {color:#5992DC;}
.card, .cta, .process-step{position:relative; overflow: hidden; background:radial-gradient(circle at top left, rgba(255,255,255,0.08), rgba(255,255,255,0.01), rgba(255,255,255,0.03)) no-repeat;background-size: 130% 130%; border: 1px solid rgba(255,255,255,0.08);padding: 1.5rem;box-shadow: 0 1px 3px rgba(0,0,0,0.1);border-radius: 1.1rem;}
.card{margin-bottom: 1rem;}
.process-step{margin-bottom:30px;position: relative; background:radial-gradient(circle at top left, rgba(153,204,255,0.1), rgba(153,204,255,0.05), rgba(153,204,255,0.1)) no-repeat;background-size: 130% 130%; overflow: visible;}
.process-step::after{content:'';height:30px;width:30px;display:block; position:absolute; top: calc(100% + 1px); left: 7rem; background-image: url('/theme/process-arrow.svg'); background-size: contain;background-repeat:no-repeat;}
.process-step:last-of-type::after{background: none;}
@media (min-width: 768px){.card, .process-step{padding:2.5rem;}}
@media (min-width: 1280px){.card, .process-step{padding:2.5rem 3.5rem;}}
@media (min-width: 1920px){.card, .process-step{padding:2.5rem 4rem 2.5rem 4.5rem;}}
.cta{padding:5rem 2rem 3rem 2rem;}
.card.numbered::before{counter-increment: card-counter; /* Increment the counter */content: counter(card-counter); /* Display the counter value */position: absolute;top: -7.2rem;right: 0rem; /* Optional styling for the number */font-size:20rem;opacity:0.05;font-weight: bold;color: #fff;}
.card.numbered.niches svg{width:5rem;height:auto;margin:0;display:block;}
.card.beyond, .card.works{background:none;position:relative; z-index:0;}
.card.beyond::before, .card.works::before{content:' ';position:absolute;top:0;left:0;right:0;bottom:0;opacity:0.3; background-size:cover; background-repeat: no-repeat; z-index:-1;}
.card.beyond::before{background-image: url("/pics/healing/contact-medium.jpg");}
.card.works:nth-of-type(1)::before{background-image: url("/pics/healing/marketing-for-therapists-retreats-and-healers-collaboration-medium.jpg");}
.card.works:nth-of-type(2)::before{background-image: url("/pics/healing/lovely-consequences-medium.jpg");}
.card.works:nth-of-type(3)::before{background-image: url("/pics/healing/marketing-for-healers-medium.jpg");}
.card.works:nth-of-type(4)::before{background-image: url("/pics/healing/marketing-guides-wellness-business-tips-medium.jpg");}
.card.works:nth-of-type(5)::before{background-image: url("/pics/healing/our-price-promise-medium.jpg");}
.card.works:nth-of-type(6)::before{background-image: url("/pics/healing/pricing-marketing-packages-medium.jpg");}
.card .questions li{margin-bottom: 1.6rem;}
.card *:last-child{margin:0;}
.card ul.tight li{margin:0;}
.card ul.cards {list-style-type: none; padding-left:0;}
.card ul.cards li a{text-decoration: none;}
.feature-list{list-style: none;padding-left:0;}
.feature-list li{display: flex;align-items: center;margin-bottom: 1rem; background:rgba(255,255,255,0.1);border-radius: 0.5rem; border: 1px solid rgba(51,204,255,0.15);padding: 1rem;box-shadow: 0 1px 3px rgba(0,0,0,0.1);}
.feature-list li::before{content: url("/theme/checkbox4.svg"); margin-right: 0.75rem; font-weight: bold; font-size:125%; display: block;}
.img-placeholder{width: 100%;height: 16rem;background: #E5E7EB;border-radius: 0.5rem;}
.cta{background:radial-gradient(circle at top left, #002a3a66, #00556666, #003a4a66) no-repeat;background-size: 130% 130%; text-align: center;border-radius: 1.1rem; padding-bottom:0;}
/* Icon placeholders */
.big-icon, .icon{width: 4.2rem;height: auto; border-radius: 0.25rem;margin-top:1rem;vertical-align:-5px; }
.big-icon{width: 6rem;}
.pricing .icon{display: block;margin: 0 auto; opacity:0.8;}
table.pricing tr td.batch{font-weight:700; color:#baf;}

/* Related services - Improved Responsive Strategy */
.service-link {display: flex;flex-direction: column; /* Stack content for better mobile handling */justify-content: center;align-items: flex-start;text-decoration: none;position: relative; /* Essential for the overlay */overflow: hidden;margin-bottom: 0;border: 1px solid #331;border-radius: 8px; padding: 1rem 4rem; min-height:8rem; transition: transform 0.3s ease, box-shadow 0.3s ease; /* Background Image Fixes */background-size: cover !important; /* Ensure image fills the card */background-position: center !important; /* Keep image centered */background-repeat: no-repeat;z-index: 1;}
/* Add a dark overlay to ensure text is ALWAYS readable over the photo */
.service-link::after {content: '';position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: linear-gradient(90deg, #000033cc 0%, #00223300 70%); z-index: -1; /* Place behind the text */transition: background 0.3s ease;}
/* Maintain the icon sprite on the left */
.service-link::before {content: '';position: absolute;left: 10px;top: 50%;transform: translateY(-50%);width: 60px;height: 60px; /* Make it square */background-image: url('/pics/healing/about-us-medium.jpg');background-size: 400px;z-index: 2;border-radius: 4px;}
/* Responsive Padding Adjustment */
@media (max-width: 480px) {  .service-link {padding: 4rem 1.5rem 1.5rem 1.5rem; /* Stack icon on top for very small screens */}  .service-link::before {top: 10px;left: 50%;transform: translateX(-50%);width: 40px;height: 40px;}  }
.service-link:hover {transform: translateY(-2px);box-shadow: 0 4px 15px rgba(0,0,0,0.3);}
.service-link:hover::after {background: rgba(255, 204, 51, 0.65); /* viibe yellow at high opacity */}
/* Typography Improvements */
.service-link h3 {position: relative;z-index: 3;color: #fc3;margin: 0;font-size: 1.8rem;line-height: 1.2;text-shadow: 0 0 1rem #023, 0 0 2rem #023, 0 0 3rem #023; /* Critical for readability */}
.service-link:hover h3 {color: #000;text-shadow: none;}
.arrow{font-size: 1.5rem;}

.column, .cols{width:100%;float:left;}
/* > smaller smartphones */
@media(min-width:481px){.container{width:85%;}}
/* > tablets and larger smartphones */
@media(min-width:769px){
 .container{width:80%;}
 .cols{margin-left:4%;}
 .cols:first-child{margin-left:0;}
 .one.cols{width:4.66666666667%;}
 .two.cols{width:13.3333333333%;}
 .three.cols{width:22%;}
 .four.cols{width:30.6666666667%;}
 .five.cols{width:39.3333333333%;}
 .six.cols{width:48%;}
 .seven.cols{width:56.6666666667%;}
 .eight.cols{width:65.3333333333%;}
 .nine.cols{width:74.0%;}
 .ten.cols{width:82.6666666667%;}
 .eleven.cols{width:91.3333333333%;}
 .twelve.cols{width:100%; margin-left:0;}
 .one-third.cols{width:30.6666666667%;}
 .two-thirds.cols{width:65.3333333333%;}
 .one-half.cols{width:48%;}
 /* Offsets */
 .offset-by-one.cols{margin-left:8.66666666667%;}
 .offset-by-two.cols{margin-left:17.3333333333%;}
 .offset-by-three.cols{margin-left:26%;}
 .offset-by-four.cols{margin-left:34.6666666667%;}
 .offset-by-five.cols{margin-left:43.3333333333%;}
 .offset-by-six.cols{margin-left:52%;}
 .offset-by-seven.cols{margin-left:60.6666666667%;}
 .offset-by-eight.cols{margin-left:69.3333333333%;}
 .offset-by-nine.cols{margin-left:78.0%;}
 .offset-by-ten.cols{margin-left:86.6666666667%;}
 .offset-by-eleven.cols{margin-left:95.3333333333%;}
 .offset-by-one-third.cols{margin-left:34.6666666667%;}
 .offset-by-two-thirds.cols{margin-left:69.3333333333%;}
 .offset-by-one-half.cols{margin-left:52%;}
}
/* 2 Base Styles –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE html is set to 62.5% so that all the REM measurements throughout Skeleton are based on 10px sizing */
/* Breaks:https://www.browserstack.com/guide/responsive-design-breakpoints*/
html{font-size:calc(62.5%);}/* < smaller smartphones */
@media(min-width:481px){html{font-size:calc(62.5% * 1.1);}}/* > smaller smartphones */
@media(min-width:769px){html{font-size:calc(62.5% * 1.1);}}/* > tablets & larger smartphones */
@media(min-width:1280px){html{font-size:calc(62.5% * 1.1);}}/* > smaller laptops, desktops & larger landscape tablets */
@media(min-width:1921px){html{font-size:calc(62.5% * 1.1);}} /* > normal desktop */
body{width:100%;padding:0;font-size:1.6rem; overflow-x:hidden;line-height:1.67; font-weight:200; font-family: zzz, kiro, sans-serif; font-style:normal; color:#bcd; background:#222;letter-spacing:0.05rem; position:relative;z-index:0;}

/* 3 Typography –––––––––––––––––––––––––––––––––––––––––––––––––– */
#proposition p, #proposition h2{text-align: center; line-height:1.2;}
#proposition span, #invitation-to-act span, #subscribe span, #contact span, #testimonials span{display:block; position:relative;bottom:0; margin:0; padding:2rem 2rem 1rem 2rem; border-radius: 1rem 1rem 0 0;}
@media(min-width:481px){
 #proposition span, #invitation-to-act span, #subscribe span, #contact span, #testimonials span{padding:4rem 0 1rem 0; margin: 2rem 0 0 0;}
 #proposition p, #proposition h2{font-size:115%;}
 #proposition span{margin:16rem 0;padding:0;}
}
#proposition span{text-align: center; font-size:105%; margin: 5rem 0 0 0; background:transparent;}
@media(min-width:769px){#proposition span{margin:4rem 0 0 0;}}
@media(min-width:1280px){#proposition span{margin:6rem -10rem 0 -10rem;}}
@media(min-width:1920px){#proposition span{margin:8rem -20rem 0 -20rem;}}

h1, h2, h3, h4, h5, h6{margin-top:0;margin-bottom:2rem; font-weight:bold; color:#8bd;font-family: zzz, kiro, sans-serif;letter-spacing:0;}
h1{font-size:5.6rem; line-height:1; text-align:center;color:#fff/*'.$colorCopy1.'*/;text-shadow:0 0 9rem #47a;z-index:100;}
h1 em{font-size:6.4rem; font-style:normal; display:block;}
h2{font-size:3.4rem; line-height:1.1; color:#cde;letter-spacing:0.1rem;}
h1:first-letter,h2:first-letter{font-family: zzz, yink, sans-serif; font-weight:400;font-size:150%;font-style: normal; padding-right:0.2rem;}
h3{font-size:2.2rem; line-height:1.3; margin-bottom:0;letter-spacing:0.05rem;}
h4, #thanks{font-size:1.8rem; line-height:1.35; margin-bottom:0;text-transform:uppercase;font-weight:bold;text-shadow: 0 0 2rem #fff;color:#cc99ffcc;}
h5{font-size:1.9rem; line-height:1.5;letter-spacing:0.02rem;}
h6{font-size:1.7rem; line-height:1.6; margin-bottom:0;letter-spacing:0.01rem;}
#thanks{text-align:center;}
@media(max-width:481px){h1{font-size:3.6rem;}h2{font-size:3rem;}}
#legal p{font-size:1.2rem;margin:1.3rem 0;color:#999;}
footer li{list-style:none;}
#proposition p.standfirst{color:#ddd;font-size:133%;padding:0 0 8rem 0; margin:0 auto; max-width:80rem; text-align: center;}
p.opener{color:#3cf;font-size:125%;line-height:1.5; text-shadow: 0 0 1rem #3cf;}
p.opener::first-letter {font-family: zzz, kiro, sans-serif; font-weight:700; float: left;font-size: 7rem; line-height:6rem; padding: 0 0.3rem 0 1.1rem; margin: -.3rem 0 0 -1.3rem; color:#fff;text-shadow:0 0 9rem #c3f;}
div.constituents{border:1px solid #33ccff55; background: #33ccff11; padding:2rem 3rem; border-radius:1rem; margin-bottom:2.4rem;}
div.constituents + div.constituents {border:1px solid #ff33cc55; background: #ff33cc11;}
div.constituents svg{width:5rem; height:auto; margin:0; padding:0; display:block;}
div.constituents ul{list-style-type:none; padding:0; margin:0;}
div.constituents p{padding:0; margin:0;}
div.constituents a{text-decoration: none;}
p.factoid{border:1px solid #cc33ff66; background: linear-gradient(to right, #00000099, #00000033); padding:2rem 3rem; border-radius:1rem; margin:6rem 0;}
p.factoid b{display:block;}

ol.differences{margin:2rem 0; color:#fff;}
p.more-besides{display:block; text-align:right; text-transform: uppercase; color: rgba(255,255,255,0.2); margin:1rem 0; font-weight:bold;}
sub{font-size:80%; line-height:1.5;}
.alignLeft{text-align:left;}
.alignCentre{text-align:center;}
.alignRight{text-align:right;}
.alignJustify{text-align:justify;}
ul.testimonial{list-style-type: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 1rem;}
ul.testimonial em{display:block;font-size:1.4rem; color:#999;}
p.disclaimer{background:#ff33cc11; border:1px solid #ff33cc66; border-radius: 1.5rem; color:#ff33cc;padding: 1rem 2rem; }
/* 4 Links –––––––––––––––––––––––––––––––––––––––––––––––––– */
a{color:#fc3/*'.$colorClick.'*/;}
a:hover{color:#000;background:#fc3/*'.$colorClick.'*/; text-decoration:none;}
#hamburger{display:none;}
a#logo-footer:hover{background:none;}
a#brand-logo{padding-left:1.5rem; text-decoration:none;border-top:0.5rem solid transparent;}
a#brand-logo:hover{padding-bottom:0;background:rgba(255,204,51,0.2);}
a#logo-footer{transition:transform 0.2s ease, background-color 0.2s ease; border-radius:8px; display:inline-block;}
a#logo-footer:hover{background-color:#ffcc3322 !important; transform:scale(1.06);}
a#brand-logo{transition:transform 0.2s ease;}
a#brand-logo:hover{transform:scale(1.06);}
.innovate-uk-award{width:200px;height:auto; margin:0;}
div.encourage-scroll-line{width:4px;height:48px;background-color:#60a5fa;margin:0 auto;border-radius:4px;animation:bounce 2s infinite;}
@keyframes bounce{ 0%, 100%{transform:translateY(0);} 50%{transform:translateY(16px);}}

/* 4b head menu */
.dropdown-toggle { display: none; } /* Hide toggle by default (desktop) */
.mobile-only { display: none !important; }
#head-menu{position:absolute;top:0;left:0; width:100%;margin:0; padding:0 0 7rem 6.5rem;background:linear-gradient(to bottom, rgba(0,0,0,0.7), rgba(255,0,0,0)); vertical-align:top; z-index:9999;}
#menu-background{display:none;}
nav ul{list-style:none;margin:0; padding:0;}
nav li{color:#ccc; display:block; float:left; padding:1rem 0; position:relative;text-decoration:none;transition-duration:0.5s;}
nav li a{color:#fc3;padding:1.1rem 1.5rem 0 1.5rem; text-decoration:none; font-weight:bold; width:100%; display:inline-block;}
nav li a:hover{background:none; color:#fff;}
nav li ul li:first-of-type{margin-top:0rem;}
nav li:hover, nav li:focus-within{background:rgba(0,0,0,0.7); cursor:pointer;}
nav li:focus-within a{outline:none;}
nav ul li ul{background:rgba(0,0,0,0.7); visibility:hidden; width:25rem; opacity:0; position:absolute; margin:1rem 0 0 0; left:0; display:none; transition:all 0.5s ease;}
nav ul li:hover > ul, nav ul li:focus-within > ul, nav ul li ul:hover, nav ul li ul:focus{visibility:visible;opacity:1;display:block;}
nav ul li ul a{padding:0.1rem 1.5rem; text-transform:none;}
nav ul li ul a:hover{background:rgba(255,204,51,0.2);}
nav ul li ul li{clear:both; width:100%; margin:0; padding:0; border:none;}
/* 4c foot menu */
nav#foot-menu *{visibility:visible;opacity:1;display:block;float:none;position:relative;background:none;}
nav#foot-menu ul{display:grid;grid-template-columns:repeat(auto-fill,minmax(22rem,1fr));gap:0 1rem;}
nav#foot-menu ul li{padding-left:0;}
nav#foot-menu ul li a:first-of-type{margin-bottom:1rem;}
nav#foot-menu ul li ul li a:first-of-type{margin-bottom:0;}
nav#foot-menu ul li ul{display:block;padding:0;margin:0 0 3rem 0;}
nav#foot-menu ul a{padding:0rem 1rem 0rem 1rem;border-left:0.4rem solid #468 !important;border-radius:2rem;}
nav#foot-menu ul li ul a{font-weight:200;border-left:none !important;}
nav#foot-menu ul a:hover{background:rgba(255,204,51,0.2);}

@media (max-width:768px){
 /* 4b head menu */
 #hamburger{display:block;right:0;top:-0.5rem;position:absolute;font-size:230%;text-decoration:none;z-index:999;padding:0.5rem 1rem 0 1rem;}
 #menu-background{position:absolute;top:0;left:0;width:100%;height:9rem;padding:6.5rem 0;background-image:repeating-linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%); display:block; z-index:99;}
 #head-menu{left:unset;right:0;padding:5.6rem 0 5rem 0; display:none; text-align:right;width:25rem;background:none;font-size:96%; z-index:999;}
 nav ul{background:#222;}
 nav li{float:none;padding:0; margin-bottom:1px;}
 nav li a{background:#333; padding: 1rem 1.5rem 0.8rem 1rem;}
 nav li ul li:first-of-type{margin-top:1rem;}
 nav#foot-menu ul li ul{position:relative; margin:0 0 2rem 0 !important; left:unset; width:100%; visibility:unset;display:block;opacity:1;background:none;}
 nav ul li ul a{background:#222;}
 #head-menu li .menu-item-wrapper {display: flex;justify-content: space-between;align-items: center;background: #333;} /* Fix for menu item layout */
 #head-menu li a {flex-grow: 1;background: transparent; /* Move background to wrapper */}
 #head-menu .dropdown-toggle {display: block;padding: 1rem 2rem;font-size: 1.5rem;color: #fc3;cursor: pointer;border-left: 1px solid #444;} /* Style the toggle button */
 .mobile-only { display: block !important; }
 #head-menu .dropdown {position: relative !important;display: none; /* Controlled by JS */width: 100% !important;opacity: 1 !important;visibility: visible !important;margin: 0 !important;background: #222 !important;box-shadow: inset 0 5px 10px rgba(0,0,0,0.5);} /* Fix the overlapping dropdowns */
 #head-menu .dropdown li a {padding-left: 2.5rem !important;font-weight: normal;font-size: 0.9em;} /* Nesting visual cue */
}
/* 5 Buttons –––––––––––––––––––––––––––––––––––––––––––––––––– */
.button, button, .btn-primary,  input[type="submit"], input[type="reset"], input[type="button"]{display:inline-block;max-width:100%;padding:0.7rem 3rem;color:#111;text-align:center;font-weight:bold;line-height:38px;letter-spacing:.05rem;text-transform:uppercase;text-decoration:none;white-space:nowrap;background-color:#fc3/*'.$colorClick.'*/;border-radius:5px;border:1px solid transparent;cursor:pointer;}
.button:hover, button:hover, input[type="submit"]:hover, input[type="reset"]:hover, input[type="button"]:hover, .button:focus, button:focus, input[type="submit"]:focus, input[type="reset"]:focus, input[type="button"]:focus{color:#fc3/*'.$colorButtonFocus.'*/;border:1px solid #fc3;outline:0; background:#000;}
.button.button-primary, button.button-primary, input[type="submit"].button-primary, input[type="reset"].button-primary, input[type="button"].button-primary{color:#fff/*'.$colorCopy1.'*/;background-color:#fc3/*'.$colorClick.'*/;border-color:#33c3f0/*'.$colorButtonBorders.'*/;}
.button.button-primary:hover, button.button-primary:hover, input[type="submit"].button-primary:hover, input[type="reset"].button-primary:hover, input[type="button"].button-primary:hover, .button.button-primary:focus, button.button-primary:focus, input[type="submit"].button-primary:focus, input[type="reset"].button-primary:focus, input[type="button"].button-primary:focus{color:#fff/*'.$colorCopy1.'*/;background-color:#fc3/*'.$colorClick.'*/;border-color:#1EAEDB/*'.$colorBorderPrimary.'*/;}
.confirm-btn{background:#3f3;}
.cancel-btn{background: #777;color: #666;border: none;}
.button, button, input[type="submit"], input[type="reset"], input[type="button"], .cta-button{font-weight:bold;}
.button.big{font-size:120%; padding:2rem; width: 100%; margin: 0 auto 3rem auto; background: linear-gradient(to bottom, gold 0%, #fc3 50%, darkorange 100%);white-space:pre-wrap; line-height:1.1;}
.button.big:hover{background: linear-gradient(to bottom, darkorange 0%, #fc3 50%, gold 100%) !important; color:#000; border:1px solid #fc3;}
.button.big span{display:block; text-transform:lowercase; font-size:70%;}

.glow-on-hover, .magnet-contact-button {border: 1px solid #000;outline: none;cursor: pointer;position: relative;z-index: 0;background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #48ff00, #00ffd5, #002bff, #7a00ff, #ff00c8, #ff0000);animation: glowing 140s linear infinite;opacity: 1;transition: opacity .3s ease-in-out; overflow:visible;}
.glow-on-hover:before, .magnet-contact-button:before {content: '';background: linear-gradient(45deg, #ff0000, #ff7300, #fffb00, #fc3, #cf3, #fc3, #3fc, #ff00c8, #ff0000);position: absolute;top: 0;left:0;background-size: 400%;z-index: -1;filter: blur(5px);width: calc(100% + 0px);height: calc(100% + 0px);animation: glowing 20s linear infinite;opacity: 1;transition: opacity .3s ease-in-out;}
.glow-on-hover:active, .magnet-contact-button:active  {color: #000}
.glow-on-hover:active:after, .magnet-contact-button:active:after {background: transparent;}
.glow-on-hover:after, .magnet-contact-button:after {z-index: -1;content: '';position: absolute;width: 100%;height: 100%;left: 0;top: 0;}
.sc-glint {position: absolute !important;width: 4px !important;height: 4px !important;border-radius: 50% !important;background: #fff8c0;box-shadow: 0 0 4px 1px rgba(253,233,106,0.8);pointer-events: none;z-index: 9999;animation: scGlintPop var(--dur) ease-in-out var(--delay) infinite;}
@keyframes scGlintPop {0% {opacity:0;} 30% {opacity:1;} 60% {opacity:0.6;} 100% {opacity:0;}}
@keyframes glowing {0% {background-position: 0 0;} 50% {background-position: 200% 0;} 100% {background-position: 0 0;}}

/* 6 Forms –––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea, select{height:38px;padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */background-color:#fff/*'.$colorCopy1.'*/; color:#333; border:1px solid #D1D1D1;border-radius:4px;box-shadow:none;}
/* Removes awkward default styles on some inputs for iOS */
input[type="email"], input[type="number"], input[type="search"], input[type="text"], input[type="tel"], input[type="url"], input[type="password"], textarea{-webkit-appearance:none;-moz-appearance:none;appearance:none;}
textarea{min-height:65px;padding-top:6px;padding-bottom:6px;}
input[type="email"]:focus, input[type="number"]:focus, input[type="search"]:focus, input[type="text"]:focus, input[type="tel"]:focus, input[type="url"]:focus, input[type="password"]:focus, textarea:focus, select:focus{border:1px solid #33c3f0/*'.$colorButtonBorders.'*/;outline:0;}
label, legend{display:block;margin-bottom:0;font-weight:bold; line-height:1;}
fieldset{padding:0;border-width:0;}
input[type="checkbox"], input[type="radio"]{display:inline;}
label > .label-body{display:inline-block;margin-left:.5rem;font-weight:bold;}

/* 7 Lists –––––––––––––––––––––––––––––––––––––––––––––––––– */
ul{list-style:disc;}
ol{list-style:decimal;}
ol, ul{padding-left:1.6rem;margin-top:0;}
ul ul, ul ol, ol ol, ol ul{margin:1.5rem 0 1.5rem 3rem;}
li{margin-bottom:0.25rem;}
.clients {display: flex;align-items: flex-start;margin-bottom: 1rem; padding:2rem 2rem 1rem 2rem; border:1px solid #ffffff11; border-radius: 1rem; background: #ffffff08;}
.clients svg {flex-shrink: 0;margin-right: 2rem; /* Space between icon and text */}
.clients div {flex: 1; /* This allows the text content to take remaining space */}
.clients h3, .clients p {margin: 0 0 8px 0; /* Reset margins and add some space between h3 and p */display: block; /* Ensure block display for stacking */}
ul.sitemap{list-style: none; padding:0;}
ul.sitemap li a{text-decoration: none;}
ol[type="a"]{list-style-type: lower-alpha;}

/* 8 Code –––––––––––––––––––––––––––––––––––––––––––––––––– */
code{padding:.2rem .5rem;margin:0 .2rem;font-size:90%;white-space:nowrap;background:#F1F1F1;border:1px solid #e1e1e1/*'.$colorBorders.'*/;border-radius:4px;}
pre > code{display:block;padding:1rem 1.5rem;white-space:pre;}

/* 9 Tables –––––––––––––––––––––––––––––––––––––––––––––––––– */
/* Base table styles */
table{width:100%; margin:0 auto;border-collapse:collapse;}
tr{border-bottom:1px solid #222 /*'.$colorBorders.'*/;}
th, td{padding:0.75rem 1rem;text-align:left;background: #000;line-height:1.25; font-size: 85%; vertical-align: top; word-wrap: break-word;}
@media (max-width: 768px){th,td{padding:0.75rem 0.1rem;width:auto;} td:first-of-type{padding-left:1rem;}}
th{background:#333;}
table.pricing tr:nth-child(1) th, table.pricing tr:nth-child(2) td:nth-child(1){border-radius: 0.75rem 0.75rem 0 0;}
table.pricing tr:last-of-type td{border-radius: 0 0 0.75rem 0.75rem;}
table.pricing tr:last-of-type{border-bottom: none;}
table.pricing th, table.pricing td{ text-align: center; color:#8bd;}
table.pricing th{text-align: center; position: relative;}
table.pricing td:nth-child(1){ text-align: left; color:#ccc;}
table.pricing th:nth-child(1){background:none;}
table.pricing th:nth-child(2){background:#012;}
table.pricing th:nth-child(3){background:#123;}
table.pricing th:nth-child(4){background:#234;}
table.pricing th:nth-child(5){background:#345;}
table.pricing td:nth-child(2){background:#123;}
table.pricing td:nth-child(3){background:#234;}
table.pricing td:nth-child(4){background:#345; }
table.pricing td:nth-child(5){background:#456;}
table.pricing tr.totals td{border:1px solid #999;}

th.recommended{position: relative;border: 1px solid #3cf; z-index:3;}
th.recommended::before{content: 'Recommended';position: absolute;top: -1rem;left: 50%;transform: translateX(-50%);background: #3cf;color: #000;padding: 0.25rem 1rem;border-radius: 1rem;font-size: 1rem;}
.plan-name{font-size: 1.6rem;font-weight:bold;margin-bottom: 0.5rem;}
.plan-price, .plan-price sub{color: #3cf; margin:-2.4rem 0 2.4rem;}
.plan-price sub{display:inline-block;vertical-align: 0.25rem;font-weight:200;font-size:1.6rem; border:none;padding:0;background:none;}

.card hr{margin: 2.6rem 0; padding:0; border:none; border-top:7px dotted #33ccff66;}
.plan-subtitle{color: #aaa;font-size: 1rem;}
.price{font-size:3.2rem;color:#8bd; margin:-3.2rem 0 2rem 1.3rem;font-weight:700; border-left:1px dotted #cde; padding-left:1rem;}
.price span{font-size:1.6rem; text-transform: uppercase; color:#8bd; font-weight:200;}
.cta-button{display: inline-block;padding: 0.75rem 1.5rem;background-color: #fc3;color: #000;text-decoration: none;border-radius: 0.375rem; margin: 1rem 0;}
td strong{display: block;margin-bottom: 0.25rem;}
td em{display: block;font-style: normal;color: #999;font-size: 1rem;margin: 0.5rem 0;}
@media (max-width: 768px){
 table, tbody, tr, th, td{display: block;margin-bottom: 1rem;}
 table.pricing th, table.pricing td{display: table-cell;}
 table.pricing tr {display:table-row;}
 thead{display: none;}
 td::before{content: attr(data-label);font-weight:bold;display: block;margin-bottom: 0.5rem;}
 th.recommended{transform: none;}
 td{margin-bottom: 0.5rem;}
}

/* 10 Spacing –––––––––––––––––––––––––––––––––––––––––––––––––– */
button, .button{margin-bottom:1rem;}
input, textarea, select, fieldset{margin-bottom:1.5rem;}
pre, blockquote, dl, figure, table, p, ul, ol, form{margin-bottom:3.2rem;}
blockquote{border-left: 1rem solid #3cf; margin-left:0; color: #3cf; padding-left:1rem;}
p{margin-top:0;}

/* 11 Utilities –––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width{width:100%;}
.u-max-full-width{max-width:100%;}
.u-pull-right{float:right;}
.u-pull-left{float:left;}

/* 12 Misc –––––––––––––––––––––––––––––––––––––––––––––––––– */
hr{margin-top:3rem;margin-bottom:3.5rem;border-width:0;border-top:1px solid #e1e1e1/*'.$colorBorders.'*/;}
#share div a span svg{}

/* 13 Images –––––––––––––––––––––––––––––––––––––––––––––––––– */
#menu #brand-logo img{width:8rem;height:auto;}
.bg-image{position:absolute;   top: 0;right: 0;bottom: 0;left: 0;}
.bg-image::after {content: '';position: absolute;top: 0;right: 0;bottom: 0;left: 0;  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.1) 40%, rgba(0, 0, 0, 0.7) 100%); pointer-events: none;}
.bg-image img{width:100%;height:100%; object-fit:cover;}
#invitation-to-act .bg-image img{opacity:0.7;}
#invitation-to-act .bg-image::after {background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.05) 10%, rgba(0, 0, 0, 0.1) 100%);}

.fg-image{position:relative; display:inline-block; margin:0; width:100%; z-index:19;}
@media(min-width:769px){.fg-image{margin: 0 -5rem; width:calc(100% + 10rem);}}
@media(min-width:1280px){.fg-image{margin: 0 -10rem; width:calc(100% + 20rem);}}
@media(min-width:1920px){.fg-image{margin: 0 -15rem; width:calc(100% + 30rem);}}

.fg-image img{width:100%;height:auto; border-radius: 1.1rem; margin-bottom: 2.4rem;}
#logo-footer img{width:24rem;height:auto;}
#brand-logo img{width:4.2rem;height:auto;}
.lazypic{opacity: 0;transition: opacity 0.5s ease-in-out;}
.lazypic.loaded{opacity:1;}
img.learning{display:block;width:150px;height:auto;margin-bottom:1.6rem;}
div.caption{background: #000; padding: 5rem 1rem 0.5rem; border-radius: 1rem; margin-top:-7.5rem; z-index:18; margin-bottom:3.2rem; line-height: 1.3;}
picture.tv + div.caption{margin-top:-7.5rem;}
svg text {font-family: zzz, kiro, sans-serif;}
.svg-image{width:90%; height:auto; margin-bottom:4.2rem;}
@media(min-width:481px){.svg-image{width:75%;}}
/* 14 Video –––––––––––––––––––––––––––––––––––––––––––––––––– */
.video{position: relative; width:100%; margin: 2rem 0 3.2rem 0; display: block;padding:56.25% 0 0 0;} /* Video wrapper styles for actual content */
@media(min-width:769px){.video{margin: 0 -8rem 3.2rem; width:calc(100% + 16rem);padding-top: calc( (100% + 16rem) * 9 / 16 );} }
@media(min-width:1280px){.video{margin: 0 -16rem 3.2rem; width:calc(100% + 32rem);padding-top: calc( (100% + 32rem) * 9 / 16 );}}
@media(min-width:1920px){.video{margin: 0 -24rem 3.2rem; width:calc(100% + 48rem); padding-top: calc( (100% + 48rem) * 9 / 16 );}}
.video iframe{position:absolute;top:0;left:0; width: 100%; height:100%; aspect-ratio: 16/9;border:0;border-radius: 1.1rem;}
.video.original-width{display: inline-block;} /* Original width variation */
.video.paragraph-width{} /* Standard paragraph width */
.video.container-width{width: calc(100% + 4rem); margin: 0 -2rem;} /* Container width variation */
.video.page-width{width: 100vw;margin-left: calc(-50vw + 50%);margin-right: calc(-50vw + 50%);} /* Full page width variation */
.video.height-natural iframe{aspect-ratio:1/1 !important;}
.off{display:none;}

/* 15 Add-2-Any –––––––––––––––––––––––––––––––––––––––––––––––––– */
.a2a_kit{background:none !important; left:0; top:150px; opacity:0.4 !important;}
.a2a_kit:hover{opacity:1 !important;}
.a2a_kit_size_24.a2a_floating_style.a2a_vertical_style{}
@media screen and (max-width: 481px){  .a2a_floating_style.a2a_vertical_style{display: none;}}

/* 16 Calculator –––––––––––––––––––––––––––––––––––––––––––––––––– */
.calculator{border-radius: 1rem; background: radial-gradient(ellipse at left top, #a3d 0%, #636 100%); padding:10%;}
.calculator h5{margin-bottom: 0.3rem;}
.calculator .slider-section{margin-bottom: 25px;}
.slider-container{margin-bottom:0; border-radius: 1rem 1rem 1rem 0; background: rgba(0,0,0,0.1); padding:1.6rem;}
.calculator .current-value{font-size:6rem; font-weight:200;line-height:5rem; background:rgba(0,0,0,0.1); margin-top:0; padding: 0 1rem; display: inline-block; border-radius: 0 0 1rem 1rem;}
.calculator .current-value .monthly{display:block; font-size:2rem;line-height: 1;  background:rgba(0,0,0,0.2); margin: 0 -1rem; padding:1rem; border-radius: 0 0 1rem 1rem;}
 label{display: block;margin-bottom:1rem;font-weight:bold; color:#fff;}
.slider{-webkit-appearance: none;width: 100%;height: 13px;background: #000;outline: none;opacity: 0.7;-webkit-transition: .2s;transition: opacity .2s; margin: 1rem 0; border-radius: 1.6rem;}
.slider:hover{opacity: 1;}
.slider::-webkit-slider-thumb{-webkit-appearance: none;appearance: none;width: 25px;height: 25px;background: #fc3;cursor: pointer; border-radius: 1.6rem;}
.slider::-moz-range-thumb{width: 25px;height: 25px;background: #fc3;cursor: pointer;}
.calculator .services{display:table; width:100%; background: rgba(255,255,255,0.1); padding:1.6rem 1.6rem 0.8rem 1.6rem; margin: 2rem 0; border-radius: 1rem;}
.calculator h5{color:#000;}
.calculator .service-row{padding: 0.5rem 0 0.2rem 0;border-bottom: 1px solid #333;}
.calculator tr{display:table-row; width:100% !important;}
.calculator td{background: none;}
.calculator .service-row .service-value{text-align: right;}
.calculator .service-row:last-of-type{border:none; padding-bottom: 0;}
.calculator .service-name{color:#000; font-weight:bold;}
.calculator .service-row i{font-weight:bold;letter-spacing:-.25rem;font-style: normal;color: #424;}
.calculator .service-row i em{font-style: normal; color:#eee; display:inline;font-size:inherit;}
@media (max-width:768px){
 .calculator{padding:5%;}
 .calculator tbody{width:100%; display:table-row-group;}
 .calculator td{display:table-cell;}
 .calculator td.service-value{text-align: right;}
}

/* 17 assessment */
.question{background:radial-gradient(ellipse at left top, #1a1a1a66 0%, #2a2a2a66 100%);}
.slider-container{background:rgba(255,204,51,0.1); border-radius:1rem;}
.consequence{color:#fc3; cursor:pointer;}
.dial-container {  width: 100%;height: auto;border-radius: 8px;display: flex;justify-content: center;align-items: center;padding: 20px;}
svg.dial {width: 100%;height: auto; display: block; aspect-ratio: 1 / 1; /* Maintains square aspect ratio */}
#arc1,#arc2,#arc3,#arc4,#arc5,#arc6{transform: rotate(225deg);transform-origin: 50% 50%;}
#number1,#number2,#number3,#number4,#number5,#number6{fill:#fff; font-weight:bold;font-size:200%;}
svg.dial + h5{text-align:center; margin:0 0 6rem 0;}

/* 18. Wow */
.wow-container{background:linear-gradient(135deg,#056 0%,#605 100%); padding:3rem; border-radius: 1rem; border:0.5rem solid #605; margin:6rem 0 8rem 0;}

/* 19 Self Clearing Goodness –––––––––––––––––––––––––––––––––––––––––––––––––– */
.cleared, .container:after, .row:after, .u-cf, #foot-menu:after{content:"";display:table;clear:both;}
img{width:100%;}
span.highlight *{background:#982;}

/* List and related on-page super-category styles */
.jnav-grid {display: grid;grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));gap: 0.8rem;margin-bottom: 6rem;}
.jnav-card {display: flex;flex-direction: column;gap: 0.4rem;padding: 1.5rem;text-decoration: none;background: radial-gradient(circle at top left, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.01), rgba(255, 255, 255, 0.03)) no-repeat;background-size: 130% 130%;border: 1px solid rgba(255, 255, 255, 0.08);border-radius: 1rem;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;border-width:0; border-left:1px solid #3ec;}
.jnav-card:hover {transform: translateY(-2px);box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);border-color: rgba(255, 204, 51, 0.4);background: radial-gradient(circle at top left, rgba(255, 204, 51, 0.08), rgba(255, 204, 51, 0.02), rgba(255, 204, 51, 0.04)) no-repeat;color: inherit;}
.jnav-card:nth-of-type(2){border-color:#f9c;}
.jnav-card:nth-of-type(3){border-color:#fc9;}
.jnav-card:nth-of-type(4){border-color:#caf;}
.jnav-card:nth-of-type(5){border-color:#fa5;}
.jnav-card:nth-of-type(6){border-color:#9e6;}
.jnav-pill {display: inline-block;font-size: 1rem;font-weight: bold;padding: 0.2rem 1rem;border-radius: 2rem;margin: 0 0.2rem 0.4rem 0;width: fit-content;letter-spacing: 0.05rem;text-transform: uppercase;}
.jnav-label {font-size: 1.5rem;font-weight: bold;color: #cde;line-height: 1.3;}
.jnav-sub {font-size: 1.2rem;color: #8bd;line-height: 1.4;}

.jnav-card .jnav-pill, .card .jnav-pill{background: #33eecc26; color: #3ec;border: 1px solid #33eecc44;} /*teal*/
.jnav-card:nth-of-type(2) .jnav-pill{background: #ff99cc26; color: #f9c;border: 1px solid #ff99cc44;} /*rose*/
.jnav-card:nth-of-type(3) .jnav-pill{background: #ffcc9926; color: #fc9;border: 1px solid #ffcc9944;} /*sand*/
.jnav-card:nth-of-type(4) .jnav-pill{background: #ccaaff26; color: #caf;border: 1px solid #ccaaff44;} /*purple*/
.jnav-card:nth-of-type(5) .jnav-pill{background: #ffaa5526; color: #fa5;border: 1px solid #ffaa5544;} /*coral*/
.jnav-card:nth-of-type(6) .jnav-pill{background: #99ee6626; color: #9e6;border: 1px solid #99ee6644;} /*green*/

/*
.p-teal {background: #33eecc26; color: #3ec;border: 1px solid #33eecc44;}
.p-blue {background: #ff99cc26; color: #f9c;border: 1px solid #ff99cc44;} !*rose*!
.p-amber {background: #ffcc9926; color: #fc9;border: 1px solid #ffcc9944;} !*sand*!
.p-coral {background: #ffaa5526; color: #fa5;border: 1px solid #ffaa5544;}
.p-purple {background: #ccaaff26; color: #caf;border: 1px solid #ccaaff44;}
.p-green {background: #99ee6626; color: #9e6;border: 1px solid #99ee6644;} !*lime*!

/* Super-category h2 colour accents — left border matches pill colour
h2.sc-teal {color: #3ec;}
h2.sc-blue {color: #f9c;}
h2.sc-amber {color: #fc9;}
h2.sc-coral {color: #fa5;}
h2.sc-purple {color: #caf;}
h2.sc-green {color: #9e6;}
*/
.jnav-grid ~ div.card{border-right:1px solid #00000033; margin-bottom:2rem;}
.jnav-grid ~ .card h2::before {content: '⡇'; display: block;position:absolute;left:-2.6rem; top: 0.2rem;font-size:4rem; font-weight: 100; color:#ffffff33;}
.jnav-grid ~ div:nth-of-type(2) h2{color: #3ec;}
.jnav-grid ~ div:nth-of-type(3) h2{color: #f9c;}
.jnav-grid ~ div:nth-of-type(4) h2{color: #fc9;}
.jnav-grid ~ div:nth-of-type(5) h2{color: #caf;}
.jnav-grid ~ div:nth-of-type(6) h2{color: #fa5;}
.jnav-grid ~ div:nth-of-type(7) h2{color: #9e6;}
.jnav-grid ~ div:last-of-type {margin-bottom:4.2rem;}

/* Magnet Chart Styles */
:root {
 --chart-primary-color: #3cf;
 --chart-primary-bg: transparent;
 --chart-grid-color: #888;
 --chart-radar-axis-color: #000;
 --chart-bar-axis-color: #000;
 --chart-text-color: #ddd;
 --chart-tick-color: #ddd;
 --chart-label-font-size: 13px; /* 1.4rem */
 --gauge-track-color: #00000066;
 --gauge-fill-low: #3cf;
 --gauge-fill-mid: #3cf;
 --gauge-fill-high: #3cf;
 --gauge-center-bg: #ffffff11;
 --chart-grid-label-bg: rgba(255, 255, 255, 0.0);
}

.form-control-range{width:100%;margin:0;}
.range-container{margin: 0 0 3rem 0; padding:2rem; background:#ffffff11; border:1px solid #ffffff1a; border-radius:1rem;}
.range-container label{line-height:1.25; color:#bcd;}
.range-container output{color:#fff; text-transform: uppercase;font-size:1.2rem;}
.form-control-range::-webkit-slider-runnable-track {background: #00000033;border-radius: 1rem;height: 0.5rem;}  /* Target the track in WebKit/Blink browsers (Chrome, Safari, Edge) */
.form-control-range::-moz-range-track {background: #00000033;border-radius: 1rem;height: 0.5rem;}  /* Target the track in Firefox */
.form-control-range::-webkit-slider-thumb {-webkit-appearance: none;appearance: none;width: 2rem;height: 2rem;background: linear-gradient(135deg, #fd6, #fc3);cursor: pointer;border-radius: 50%;margin-top: -0.75rem;border: 3px solid #333;box-shadow: 0 0 5px rgba(0,0,0,0.3);}
.form-control-range::-moz-range-thumb {width: 2rem;height: 2rem;background: linear-gradient(135deg, #fd6, #fc3);cursor: pointer;border-radius: 50%;border: 2px solid #fff;box-shadow: 0 0 5px rgba(0,0,0,0.3);}
.form-control-range {accent-color: #fc3;-webkit-appearance: none;width: 100%;background: transparent;cursor: pointer;}  /* Modern browsers support accent-color for quick overrides */

@media (min-width: 600px) {
 .magnet-container.magnet-readiness {counter-reset: readiness-step;} /* 1. Reset the counter on the parent */
 .magnet-container.magnet-readiness .form-group {counter-increment: readiness-step;} /* 2. Increment and display it on each form-group */
 .magnet-container.magnet-readiness .form-group::before {content: counter(readiness-step); position: absolute;right: 100%; top: -5rem;margin-right: 0.5rem;font-size:9rem;font-weight: 700;color:#ffffff22;}
}

.gauge-score{font-size:2.4rem;color:#fff;}
.gauge-score-label{font-size:2.8rem; color:#fff; text-transform: uppercase;}
.gauge-status{font-size:2rem;font-weight:700;}
.step-progress{margin:2rem 0; display:none;}
.magnet-contact-action{margin: 2rem 0;}
.magnet-progress{display:none;}

.magnet-contact .magnet-form{padding:2rem;background:#ffffff11;border:1px solid #ffffff22;border-radius:1rem;}
.magnet-contact .magnet-form input[type="text"], .magnet-contact .magnet-form input[type="email"]{width:30rem; max-width:100%;border:1px solid #000;}
.magnet-contact .magnet-form textarea{width:100%;padding:0.5rem;border:1px solid #000;margin:0.5rem 0;}

/* Bookings Styles */
.booking-embed{margin-bottom:4.2rem;}
.booking-embed form{margin-bottom:0.5rem;}
.booking-step{padding:1rem; margin:-1rem; background:#ffffff11;position: relative; display:block; border:1px solid #ffffff22;border-radius:0.5rem;}
.booking-step h2 span{text-transform: uppercase; font-size:2rem; color: #ccc; padding-left:1rem;}
@media (min-width:48rem){.booking-step{padding:2rem;}}
.progress-text{margin:0 0 1rem 0; background:#222; padding:1rem 1rem 1rem 2rem; font-weight: 700; text-transform: uppercase; font-size: 1.3rem; border-radius:0.5rem;}
.calendar-picker {max-width: 32rem;margin: 20px 0;}
.calendar-header {width: 100%; display: flex;justify-content: space-between;align-items: center;padding: 10px;background:#00000044;color: #999;border-radius: 12px;}
.calendar-header button {color: #fc3;border: none;background: #333;padding: 8px 12px;border-radius: 0.5rem;cursor: pointer;transition: all 0.3s ease; margin-bottom:0;}
.calendar-header button:hover {color: #000; background:#fc3; transform: scale(1.05);}
.calendar-month {font-weight: 600;font-size: 18px;}
.calendar-grid {display: grid;grid-template-columns: repeat(7, 1fr);gap: 5px; }
.calendar-day-label {text-align: center;font-weight: 600;padding: 0.5rem;font-size: 12px;color: #3cf;text-transform: uppercase;}
.calendar-day {aspect-ratio: 1;display: flex;align-items: center;justify-content: center;border-radius: 3px;transition: all 0.2s ease;background: #ffffff22;font-weight: 700;font-size:1.4rem;position: relative;overflow: hidden;}
.calendar-day:hover:not(.disabled):not(.other-month):not(.no-slots) {background: #fc3;color: #000;transform: scale(1.05);cursor: pointer;}
.calendar-day.selected {background: linear-gradient(135deg, #3cf 30%, #3cf 100%);color: #000;font-weight: 700;box-shadow: 0 4px 12px rgba(255,204,51, 0.4);}
.calendar-day.disabled {color: #444;cursor: not-allowed;background: #000;text-decoration: line-through;}
.calendar-day.other-month {color: #444;background:none;cursor:not-allowed;}
.calendar-day.today {border: 2px solid #3cf;}
.calendar-day.no-slots {color: #444;background: #000;cursor: not-allowed;opacity: 0.5;}
.calendar-day.no-slots:hover {background: #222;transform: none;}
.booking-step button {background: linear-gradient(135deg, #fc3 30%, #fa1 100%);color: #000; margin:0; font-weight: bold;}
.booking-step button:hover {background: linear-gradient(-45deg, #fc3 30%, #3cf 100%);color: #000;}
.booking-step button.btn-secondary {background: #555; color: #ccc;}
.booking-step .form-group label{margin:1rem 0 0 0;}
.booking-summary p{margin-bottom:0.5rem;}
.booking-summary h3{margin:2rem 0 0 0;}
.booking-step.booking-success{background:#66ff6611;border:1px solid #66ff6633; color: #bcd;}
.booking-step .room-buttons button.btn-secondary{color: #ccc; padding: 0 2rem; border-radius: .25rem; font-size: 1.2rem; margin-right: 0.5rem;}
/* *{outline:1px solid red;}*/