/*
Theme Name: F5 Works
Theme URI: https://f5works.co.uk
Author: F5 Works
Description: Block theme for F5 Works. On activation it creates every page (Home, Services, Work, Pricing and more) and the case studies, all editable in the block editor.
Version: 1.0.0
Requires at least: 6.6
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: f5works
*/

.wp-site-blocks > * { margin-block-start: 0; }
.wp-block-post-content > .alignfull, .f5-sec { margin-block-start: 0 !important; margin-block-end: 0; }
.f5-sec { padding-top: 96px; padding-bottom: 96px; }
.f5-sec.f5-first { padding-top: 64px; }
.f5-bg-white { background: #fff; }
.f5-bg-light { background: #F4F7FB; }
.f5-bg-navy { background: #0B1330; color: #fff; }
.f5-bg-blue { background: linear-gradient(120deg, #0EA5F5 0%, #1E3AC4 100%); color: #fff; }
.f5-sec p { color: #55607A; }
.f5-bg-navy p, .f5-bg-navy .f5-small, .f5-bg-navy .f5-eyebrow { color: #A9B4CE; }
.f5-bg-navy h1, .f5-bg-navy h2, .f5-bg-navy h3, .f5-bg-navy h4, .f5-bg-navy .f5-stat, .f5-bg-navy a:not(.wp-element-button),
.f5-bg-blue h1, .f5-bg-blue h2, .f5-bg-blue h3, .f5-bg-blue p, .f5-bg-blue a:not(.wp-element-button) { color: #fff; }
.f5-sec h1 a, .f5-sec h2 a, .f5-sec h3 a { color: inherit; text-decoration: none; }
.f5-sec p a { color: #1E3AC4; font-weight: 700; text-decoration: none; }
.f5-sec p a:hover { text-decoration: underline; }

.f5-grid { gap: 20px; }
.f5-row { gap: 12px 20px; }
.f5-card { border: 1px solid #E3E9F2; border-radius: 20px; padding: 28px; background: #fff; overflow: hidden; transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease; }
.f5-card:hover { border-color: #C9D6EA; box-shadow: 0 14px 36px rgba(11,19,48,.08); }
.f5-card > *:first-child { margin-top: 0; }
.f5-card-light { background: #F4F7FB; }
.f5-card-dark, .f5-bg-navy .f5-card { background: #111A3D; border-color: #24325C; color: #fff; }
.f5-card-dark p, .f5-bg-navy .f5-card p { color: #C9D2E6; }
.f5-card-dark h2, .f5-card-dark h3, .f5-card-dark .f5-stat { color: #fff; }
.f5-card-blue { background: #1E3AC4; border-color: #1E3AC4; color: #fff; }
.f5-card-blue p, .f5-card-blue h3, .f5-card-blue .f5-stat { color: #fff; }

.f5-eyebrow { font-size: 13px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #55607A; margin-bottom: 0; }
.f5-pill { display: inline-block; padding: 7px 14px; border-radius: 999px; border: 1px solid #E3E9F2; background: #fff; font-size: 14px; font-weight: 600; color: #0B0B0F !important; margin: 0; }
.f5-bg-navy .f5-pill { background: #111A3D; border-color: #24325C; color: #fff !important; }
.f5-stat { font-family: var(--wp--preset--font-family--heading); font-size: clamp(30px, 3.6vw, 48px); font-weight: 800; letter-spacing: -.04em; line-height: 1; color: #0B0B0F; margin: 0; }
.f5-small { font-size: 14px; }
.f5-lead { font-size: 19px; font-weight: 600; color: #0B0B0F; }

.f5-img { margin: 0; }
.f5-img img { width: 100%; height: auto; display: block; border-radius: 20px; }
.f5-card .f5-img img { border-radius: 14px; }
.f5-icon { margin: 0; }
.f5-icon img { width: 64px; height: 64px; object-fit: cover; border-radius: 16px; }

.wp-block-button.is-style-outline .wp-block-button__link { background: #fff; color: #0B0B0F; border: 1px solid #E3E9F2; }
.f5-bg-navy .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: #fff; border-color: rgba(255,255,255,.3); }
.wp-block-button__link:hover { filter: none; }

.wp-block-details { border: 1px solid #E3E9F2; border-radius: 16px; padding: 20px 24px; background: #fff; }
.wp-block-details + .wp-block-details { margin-top: 12px; }
.wp-block-details summary { font-family: var(--wp--preset--font-family--heading); font-weight: 600; font-size: 18px; letter-spacing: -.01em; color: #0B0B0F; cursor: pointer; }
.wp-block-details[open] summary { margin-bottom: 10px; }

.f5-header { position: sticky; top: 0; z-index: 60; background: rgba(255,255,255,.92); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); border-bottom: 1px solid #E3E9F2; padding-top: 14px; padding-bottom: 14px; }
.admin-bar .f5-header { top: 32px; }
.f5-header .wp-block-navigation { font-size: 15px; font-weight: 600; gap: 28px; }
.f5-header .wp-block-navigation a:hover { color: #1E3AC4; }
.f5-header .wp-block-button__link { padding: 11px 18px; font-size: 14px; }
.f5-footer.f5-sec { padding-top: 72px; padding-bottom: 40px; }

.f5-case-grid .wp-block-post { border: 1px solid #E3E9F2; border-radius: 20px; padding: 24px; background: #fff; }
.f5-case-grid .wp-block-post-title a { text-decoration: none; color: #0B0B0F; }

@media (max-width: 781px) {
  .f5-sec { padding-top: 64px; padding-bottom: 64px; }
  .f5-card { padding: 22px; }
  .admin-bar .f5-header { top: 46px; }
  .f5-header .wp-block-buttons { display: none; }
}