:root {
    /* Base Palette */
    --colour-bg: #FAFAFA;       /* Off white */
    --colour-text: #1C1C1C;     /* Slate Gray */
    --colour-textsub: #969696;  /* Medium Gray */
    --colour-nav: #1C1C1C;      /* Slate Gray */
    --colour-link: #4A4AEB;     /* Bright Cobalt */
    --colour-border:#e5e5e5;    /* Light Grey */
}



html { font-size:20px; }
body { background:var(--colour-bg); margin:6em 0 4em 0; color:var(--colour-text); font-size:1em; font-family:"Lato",sans-serif; font-weight:300; line-height:1.6; text-align:center; }
img { border:none; }
p { margin-top:0px; margin-bottom:1em; }


a { color:var(--colour-link); font-weight:400; text-decoration:none; transition: color 0.3s ease; }
a:active { outline:none; }


.Centered { text-align:center; }

a.Button , a.ButtonPrimary { margin-top:1.5em; transition: background 0.3s ease, border 0.3s ease, color 0.3s ease, box-shadow 0.3s ease; }
a.ButtonPrimary { font-size:0.85em; background:var(--colour-link); border:2px solid var(--colour-link); color:white !important; padding:8px 32px 8px 32px; text-align:center; text-decoration:none; display:inline-block; font-weight:400 !important; margin:1em; border-radius:16px; }
a.ButtonPrimary:hover { background:white; color:var(--colour-link) !important; border:2px solid var(--colour-link); cursor:pointer; }

a.Button { font-size:0.85em; background:white; border:2px solid var(--colour-link); color:var(--colour-link) !important; padding:8px 32px 8px 32px; text-align:center; text-decoration:none; display:inline-block; font-weight:400 !important; margin:1em; border-radius: 16px; }
a.Button:hover { background:var(--colour-link); border-color:var(--colour-link); color:white !important; cursor:pointer; }

.Footer a.ButtonPrimary:hover { border-color:white; }



div, a, h1, h2 { max-height:999999px; }

ul { padding-left:1em; }
ul li { padding-bottom:0.5em; }

h1, h2 { font-family:"Lora"; letter-spacing:-0.03em; }

h1 { font-weight:500; font-size:2em; margin-top:3em; margin-bottom:1em; line-height:1.25; }
h2 { font-weight:300; font-size:1.75em; margin-top:1.75em; margin-bottom:0.25em; line-height:1.25; }
h3 { font-weight:400; font-size:1.25em; margin-top:1.75em; margin-bottom:0.5em; }
h3b { font-weight:300; font-size:1em; margin-top:2em; margin-bottom:0; }
h4 { font-weight:300; font-size:1em; margin-top:1em; margin-bottom:0; }


abbr { text-transform:uppercase; font-size:0.85em; letter-spacing:0.05em; }


.NavContainer { position:fixed; top:0; display:block; width:100%; z-index:9999; background:var(--colour-nav); font-size:1em; padding:1em 0 1em 0; margin-bottom:60px; text-align:center; }
.Nav { padding:0.5em 0.5em 0.5em 0em; font-weight:300; }
.NavHome { font-weight:400; color:white; }
.NavContainer a:hover { color:white; }

.NavWidth { max-width:700px; margin:auto; }
.NavTitle { float:left; margin-left:2em; }
.NavLinks { float:right; margin-right:2em; }
.NavLinks a { color:var(--colour-textsub); text-transform:lowercase }


a.LinkOn { color:white; font-weight:300; }

.AnchorLinks { text-align:center; padding:2em 0 0em 0; font-weight:600; }
.AnchorLinks a { margin-right:0.1em; }
.AnchorLinks span { display:block; font-weight:300; font-style:italic; }



.Title { text-align:center; }
.SubTitle { font-weight:400; }


.Container { width:100%; max-width:700px; margin:auto; text-align:left; }
.Container a:hover { color:var(--colour-text) }

a.NoUnderline { border-bottom:none; }

.Prose { margin:auto; padding:0 2em 0 2em; text-align:left; }

.Quote { text-align:center; margin:0 0 2em 0; font-size:0.9em; }

.Testimonial { margin:auto; font-size:0.9em; margin:0 0 2em 0; text-align:center;  }

p.Quotation { font-size:0.9em; border-left:5px solid var(--colour-border); padding-left:1em; }
.Attribution , .TileSub .Attribution { display:block; color:var(--colour-text); padding-top:0.5em; margin-bottom:1em;  }


.Context, .ContextList { display:block; margin:0 0 2em 0; font-size:1em; color:var(--colour-text); }
.Context br { display:none; }

.CompanyDesc { display:block; font-style:italic; margin:0 0 1.5em 0; font-size:0.9em; color:var(--colour-textsub); }


img.Profile { display:block; height:12em; margin:1em auto 2em auto }

.Logo { height:2em; margin:0.5em auto 1em auto; opacity:0.75; }
.LogoCol { display:inline; height:2em; margin:0.5em auto 1em auto; }
.LogoColList { display:inline; height:2em; margin:0.5em auto 1em auto; padding:0 1em 0 1em; }


.Email { color:var(--colour-link); }

.CompanyAward { margin-top:-0.5em; }
.CompanyAward img.LogoCol { margin-top:0.5; margin-bottom:0; }
.Companies .LogoCol { height:2.5em; margin-top:1.5em; margin-bottom:0; margin-left:0 }
.Companies .Logo { height:1.5em; margin-top:1.5em; margin-bottom:-0.5em; margin-left:0 }
.CompaniesSummary .LogoCol { height:1.5em; margin-left:-0.5em; margin-right:-0.5em; margin-top:.25em; margin-bottom:0.25em; }
.CompaniesSummary .Logo { height:1.35em; margin-left:0.75em; margin-right:0.75em; margin-top:0em; margin-bottom:0em; }

.Sector { color:var(--colour-textsub); text-transform:uppercase; font-weight:600; }
h3 .Sector { font-size:0.5em; letter-spacing:0.1em; }
p.Sector { font-size:0.75em; margin-top:-0.5em; margin-bottom:0.5em; }


.Contact { margin:auto; max-width:20em; text-align:center }
.Contact a { font-size:0.9em; margin:0.25em; }
.Contact a:hover { color:var(--colour-text) }

.Footer { font-size:0.9em; color:#ccc; background:var(--colour-nav); margin:auto; margin:5em 0 -5em 0; padding:2em 0 2em 0; text-align:center; }
.Footer p { line-height:2em; }
.Footer a { color:var(--colour-textsub); }
.Footer a:hover { color:white; }

.Social img { padding:0.5em; height:1.2em; opacity:0.8; }

.HomeLink { margin-top:-0.5em; text-transform:none; font-weight:600; color:var(--colour-textsub); }

.VideoLink { margin-top:-0.5em; color:var(--colour-textsub); font-weight:600; font-size:0.9em; }


.Shadow { box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.03); }

a.TileMini { display:grid; place-items:center; height:10em; width:100%; margin:2em 0em 0 0em; align:center; text-align:center; background:white; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.03); }


.Tile { width:100%; padding:none; margin-top:2em; }
.HomeTile { margin-top:1em; margin-bottom:1em; }
.Logos { margin-top:2em; margin-bottom:2em; }

.PlanTop { color:white; margin-top:1em; padding:0.5em 1em 0.5em 1em; background:var(--colour-nav); }
.PlanSub { font-size:0.9em; padding:1em 1em 0 1em; border:1px solid var(--colour-nav); }

.PlanTop h3 , .PlanTop p { margin:0em; }
.PlanPrice { font-weight:300; font-size:1.25em; }
.PlanPrice2 { font-size:0.8em; margin-left:0.5em;  }
.PlanPrice2 strong { font-weight:400; color:var(--colour-bg); }

.PlanFrequency { margin-left:0.25em; font-size:0.8em; }
.PlanDetails { margin:1em 0 1em 0; font-style:italic}
.PlanSession { font-weight:400; }

.TileSub { padding:0.25em 0em 0.5em 0em; text-align:left; }
.TileSub h3 { margin-top:0.25em; margin-bottom:0em; }
.TileSub li { margin-top:0.25em }
.TileSub p { margin-top:0.25em; margin-bottom:0.5em; }
.TileSub p.Sector { font-size:0.7em; margin-top:0; margin-bottom:0.5em; letter-spacing:0.1em; }
.TileSub .CompanyAward { margin-top:-0.5em; }

.CompanyAward span { padding-left:0.2em; padding-right:0.2em; font-weight:600; font-size:0.8em; }
.CompanyAward img { vertical-align:middle; padding-bottom:0.2em; padding-right:0.2em; }
.CompanyAward a { color:var(--colour-text); }


/*
.TileSub { padding:0.5em 2em 0.5em 2em; text-align:left; background:white; box-shadow: 0 8px 16px 0 rgba(0, 0, 0, 0.03); }
.TileSub h3 { margin:0em; }
.TileSub p , .TileSub li { font-size:0.9em; line-height:1.4em; }
.TileSub p.Sector { font-size:0.75em; margin-top:0; margin-bottom:0.5em; }
*/

.TileSubDark { padding:0.5em 2em 0.5em 2em; text-align:left; background:var(--colour-nav); color:var(--colour-bg); }
.TileSubDark h3 { margin:0em; }
.TileSubDark p { color:var(--colour-bg); font-size:0.9em; line-height:1.4em; }
.TileSubDark p.Sector { color:var(--colour-textsub); font-size:0.75em; text-transform:uppercase; font-weight:600; margin-top:0; margin-bottom:0.5em; }
.TileSubDark a:hover { color:white; }



.Caption { margin:auto; margin:-1.5em 0em 2em 0em; padding:0.5em 2em 0.5em 2em; text-align:center; }
.Caption a:hover { color:var(--colour-text); }

.Anchor { float:left; margin-top:-3em; }

.NoMargin { margin-top:0; }





/* --- Comparison Table --- */

.PlanTable {
	width: 100%;
	margin-bottom: 3em;
	border-collapse: collapse; /* Cleaner lines */
	font-size: 0.9em; /* Slightly smaller to fit */
	text-align: left;
}

.PlanTable th,
.PlanTable td {
	padding: 1em 0em;
	border-bottom: 1px solid #ddd; /* Light separator */
	line-height: 1.6;
}

/* Table Header */
.PlanTable th {
	font-weight: 400;
	font-size: 1.1em;
	padding-bottom: 1.6em;
	text-align: left;
}

/* Center-align the plan columns for easy reading */
.PlanTable th:not(:first-child),
.PlanTable td:not(:first-child) {
	text-align: center;
}

/* Remove bottom border from last row */
.PlanTable tbody tr:last-child td {
	border-bottom: none;
}

.PlanTable strong { font-size:0.9em; }






@media only screen and (max-width:550px) {
	html { font-size:16px; }
	p { font-size:1.05em; }
	.Nav { padding:0.5em 0.25em 0.5em 0.25em; }
	.NavContainer { font-size:0.9em; }
	.Design , .Photo { padding:0; }
	.Prose { padding-left:0; padding-right:0 }
	.Prose p , .Prose h1 , .Prose h2 , .Prose h3 , .Prose h4 { padding-left:30px; padding-right:30px; }
	.Prose li , .PlanTop , .PlanSub { margin-left:30px; margin-right:30px; }
	.PlanTop , .PlanSub { padding-left:0em; padding-right:0; }
	.PlanTop h3 , .PlanSub h3 , .PlanTop p , .PlanSub p { padding-left:1em; padding-right:1em; }
	.PlanTop li , .PlanSub li { margin-left:1em; margin-right:1em; }
	.PlanTable { margin-left:0.5em; width:97%; }
	.Quotation { margin-left:2em; padding-left:1em !important; }
}
