/*
Theme Name: NetworkOne
Template: twentytwentyfive
Description: NetworkOne business support site (child of Twenty Twenty-Five).
Version: 1.0.0
Text Domain: networkone
*/

/* ---------- base ---------- */
body { -webkit-font-smoothing: antialiased; }
main.wp-block-group { margin-top: 0 !important; }
.wp-site-blocks > * + * { margin-block-start: 0; }
.wp-site-blocks { padding-top: 0; }
:where(.entry-content, .wp-block-post-content) > *:first-child { margin-block-start: 0; }
p, li { max-width: 72ch; }
.has-text-align-center { margin-left: auto; margin-right: auto; }
a { text-underline-offset: .18em; }
::selection { background: var(--wp--preset--color--highlight); color: var(--wp--preset--color--ink); }

.n1-eyebrow {
  font-size: .8rem !important; font-weight: 700; letter-spacing: .12em; text-transform: uppercase;
  color: var(--wp--preset--color--accent); margin-bottom: .25rem !important;
}
.n1-lead { font-size: clamp(1.1rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--wp--preset--color--muted); }
.n1-small { font-size: .9rem; color: var(--wp--preset--color--muted); }

/* ---------- header ---------- */
.n1-header {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--wp--preset--color--base) 92%, transparent);
  backdrop-filter: saturate(160%) blur(8px);
  border-bottom: 1px solid var(--wp--preset--color--line);
  padding-top: .9rem; padding-bottom: .9rem;
}
.admin-bar .n1-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .n1-header { top: 46px; } }
.n1-header-inner { max-width: var(--wp--style--global--wide-size); margin-inline: auto !important; width: 100%; gap: 1.5rem; }
.n1-wordmark {
  font-family: var(--wp--preset--font-family--literata); font-weight: 700; font-size: 1.45rem;
  letter-spacing: -.02em; color: var(--wp--preset--color--ink); text-decoration: none; white-space: nowrap;
}
.n1-wordmark span { color: var(--wp--preset--color--accent); }
.n1-wordmark small {
  display: block; font-family: var(--wp--preset--font-family--manrope); font-size: .62rem; font-weight: 700;
  letter-spacing: .16em; text-transform: uppercase; color: var(--wp--preset--color--muted); margin-top: -.15rem;
}
.n1-header .wp-block-navigation { font-size: .95rem; font-weight: 600; gap: 1.6rem; }
.n1-header .wp-block-navigation a { text-decoration: none; }
.n1-header .wp-block-navigation a:hover { color: var(--wp--preset--color--accent); }
.n1-header .wp-block-navigation__submenu-container {
  border: 1px solid var(--wp--preset--color--line) !important; border-radius: 10px; padding: .5rem 0 !important;
  box-shadow: 0 12px 32px rgba(15, 42, 58, .12); min-width: 260px !important;
}
.n1-header .wp-block-navigation__submenu-container a { padding: .45rem 1.1rem !important; }
.n1-header .n1-nav-cta > a {
  background: var(--wp--preset--color--accent); color: #fff !important; padding: .55rem 1.1rem !important;
  border-radius: 6px;
}
.n1-header .n1-nav-cta > a:hover { background: var(--wp--preset--color--navy); }
.wp-block-navigation__responsive-container.is-menu-open { padding: 2rem 1.5rem; }

/* ---------- sections ---------- */
.n1-section { padding-top: clamp(3.5rem, 7vw, 6rem); padding-bottom: clamp(3.5rem, 7vw, 6rem); }
.n1-section.n1-tight-top { padding-top: 0; }
.n1-soft { background: var(--wp--preset--color--soft); }
.n1-section-head { margin-bottom: 2.25rem; }
.n1-section-head h2 { margin-top: .2rem; }

.n1-hero {
  background:
    radial-gradient(1100px 500px at 85% -10%, rgba(0, 200, 0, .22), transparent 60%),
    radial-gradient(700px 400px at -10% 110%, rgba(227, 167, 47, .14), transparent 60%),
    var(--wp--preset--color--navy);
  color: #e8eef2;
  padding-top: clamp(4rem, 9vw, 7.5rem); padding-bottom: clamp(4rem, 9vw, 7rem);
}
.n1-hero h1 { color: #fff; max-width: 18ch; margin-top: .4rem; }
.n1-hero.n1-hero-page h1 { max-width: 24ch; }
.n1-hero .n1-eyebrow { color: #7ee88a; }
.n1-hero .n1-lead { color: #c5d3dc; max-width: 60ch; }
.n1-hero .wp-block-buttons { margin-top: 2rem; }
.n1-hero .is-style-outline .wp-block-button__link { color: #fff; border-color: rgba(255,255,255,.55); }
.n1-hero .is-style-outline .wp-block-button__link:hover { background: rgba(255,255,255,.08); border-color: #fff; }
.n1-hero a:not(.wp-block-button__link) { color: #7ee88a; }

/* proof strip */
.n1-proof { background: var(--wp--preset--color--ink); color: #dfe7ec; padding-top: 2.2rem; padding-bottom: 2.2rem; }
.n1-proof .n1-stat { margin: 0; }
.n1-stat strong {
  display: block; font-family: var(--wp--preset--font-family--literata); font-size: clamp(1.6rem, 3vw, 2.1rem);
  color: var(--wp--preset--color--highlight); font-weight: 700; line-height: 1.15;
}
.n1-stat { font-size: .95rem; line-height: 1.45; color: #b9c7d0; }

/* cards */
.n1-card {
  background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--line); border-radius: 14px;
  padding: 1.75rem 1.6rem 1.6rem; height: 100%;
  transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease;
}
.n1-card > *:first-child { margin-top: 0; }
.n1-card h3 { font-size: 1.28rem; margin-bottom: .5rem; }
.n1-card h3 a { color: var(--wp--preset--color--ink); text-decoration: none; }
.n1-card h3 a::after { content: " →"; color: var(--wp--preset--color--accent); transition: margin .2s ease; }
.n1-card p { color: var(--wp--preset--color--muted); font-size: 1rem; }
.n1-card.is-link:hover { border-color: var(--wp--preset--color--accent); box-shadow: 0 14px 34px rgba(15, 42, 58, .09); transform: translateY(-2px); }
.n1-card .n1-tag {
  display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--wp--preset--color--accent); background: rgba(10, 125, 50, .09); padding: .25rem .55rem; border-radius: 4px;
  margin-bottom: .9rem;
}
.n1-icon {
  width: 44px; height: 44px; border-radius: 10px; display: grid; place-items: center; margin-bottom: 1rem;
  background: rgba(10, 125, 50, .1); color: var(--wp--preset--color--accent);
}
.n1-icon svg { width: 24px; height: 24px; }

/* numbered steps */
.n1-steps { counter-reset: n1step; }
.n1-step { position: relative; padding-top: 3.2rem !important; counter-increment: n1step; }
.n1-step::before {
  content: counter(n1step, decimal-leading-zero);
  position: absolute; top: 1.5rem; left: 1.6rem; font-family: var(--wp--preset--font-family--literata);
  font-weight: 700; font-size: 1.05rem; color: var(--wp--preset--color--accent);
}

/* checks list */
ul.n1-checks { list-style: none; padding-left: 0; }
ul.n1-checks li { position: relative; padding-left: 1.9rem; margin-bottom: .65rem; }
ul.n1-checks li::before {
  content: ""; position: absolute; left: 0; top: .32em; width: 1.15rem; height: 1.15rem; border-radius: 50%;
  background: var(--wp--preset--color--accent)
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E")
    center / 70% no-repeat;
}
ul.n1-signs { list-style: none; padding-left: 0; }
ul.n1-signs li { padding: .8rem 0 .8rem 1.4rem; border-bottom: 1px solid var(--wp--preset--color--line); position: relative; margin: 0; }
ul.n1-signs li::before { content: ""; position: absolute; left: 0; top: 1.35rem; width: .5rem; height: .5rem; background: var(--wp--preset--color--highlight); border-radius: 2px; }

/* price / callout */
.n1-callout {
  border-left: 4px solid var(--wp--preset--color--highlight); background: var(--wp--preset--color--soft);
  border-radius: 0 12px 12px 0; padding: 1.5rem 1.75rem;
}
.n1-callout > *:first-child { margin-top: 0; }
.n1-callout > *:last-child { margin-bottom: 0; }
.n1-price strong { font-family: var(--wp--preset--font-family--literata); font-size: 2rem; color: var(--wp--preset--color--ink); }

/* split two-col */
.n1-split { gap: clamp(2rem, 5vw, 4.5rem) !important; }

/* results */
.n1-result { border-top: 1px solid var(--wp--preset--color--line); padding-top: 3rem; margin-top: 3rem !important; }
.n1-result:first-of-type { border-top: 0; margin-top: 0 !important; padding-top: 0; }
.n1-result-figures { gap: 1rem !important; }
.n1-figure {
  background: var(--wp--preset--color--soft); border-radius: 12px; padding: 1.1rem 1.2rem; margin: 0;
  font-size: .92rem; color: var(--wp--preset--color--muted); line-height: 1.4;
}
.n1-figure strong { display: block; font-family: var(--wp--preset--font-family--literata); font-size: 1.45rem; color: var(--wp--preset--color--accent); margin-bottom: .2rem; }

/* FAQ */
.wp-block-details { border-bottom: 1px solid var(--wp--preset--color--line); padding: 1.1rem 0; }
.wp-block-details summary { font-weight: 700; cursor: pointer; font-size: 1.08rem; color: var(--wp--preset--color--ink); }
.wp-block-details[open] summary { margin-bottom: .6rem; }

/* table */
.n1-table table { border-collapse: collapse; width: 100%; font-size: .98rem; }
.n1-table th, .n1-table td { border: 0; border-bottom: 1px solid var(--wp--preset--color--line); padding: .9rem .8rem; text-align: left; vertical-align: top; }
.n1-table thead th { border-bottom: 2px solid var(--wp--preset--color--ink); font-size: .82rem; text-transform: uppercase; letter-spacing: .06em; }
.n1-table td:first-child { font-weight: 700; color: var(--wp--preset--color--ink); }

/* CTA band */
.n1-cta {
  background:
    radial-gradient(900px 380px at 100% 0%, rgba(0, 200, 0, .45), transparent 60%),
    radial-gradient(600px 300px at 0% 100%, rgba(227, 167, 47, .25), transparent 60%),
    linear-gradient(120deg, #0a5a2b 0%, #0b4a3a 55%, #0f2a3a 100%);
  color: #dfe7ec; padding-top: clamp(3.5rem, 7vw, 5rem); padding-bottom: clamp(3.5rem, 7vw, 5rem);
}
.n1-cta h2 { color: #fff; }
.n1-cta p { color: #c5d3dc; }
.n1-cta a:not(.wp-block-button__link) { color: #fff; }
.n1-cta .is-style-outline .wp-block-button__link { color: #fff; border-color: rgba(255,255,255,.55); }

/* buttons */
.wp-block-button__link { transition: background .15s ease, color .15s ease, border-color .15s ease; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: var(--wp--preset--color--accent-dark); }
.is-style-outline .wp-block-button__link { border-width: 2px; }

/* ---------- contact form ---------- */
.n1-form { display: grid; gap: 1rem; }
.n1-form .row { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
@media (max-width: 640px) { .n1-form .row { grid-template-columns: 1fr; } }
.n1-form label { display: block; font-weight: 700; font-size: .9rem; margin-bottom: .35rem; color: var(--wp--preset--color--ink); }
.n1-form input, .n1-form select, .n1-form textarea {
  width: 100%; box-sizing: border-box; font: inherit; font-size: 1rem; padding: .75rem .85rem;
  border: 1px solid #c7d0d5; border-radius: 8px; background: #fff; color: var(--wp--preset--color--ink);
}
.n1-form input:focus, .n1-form select:focus, .n1-form textarea:focus { outline: 3px solid rgba(10,125,50,.25); border-color: var(--wp--preset--color--accent); }
.n1-form textarea { min-height: 150px; resize: vertical; }
.n1-form .hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.n1-form button {
  justify-self: start; font: inherit; font-weight: 700; background: var(--wp--preset--color--accent); color: #fff;
  border: 0; border-radius: 6px; padding: .85rem 1.6rem; cursor: pointer;
}
.n1-form button:hover { background: var(--wp--preset--color--accent-dark); }
.n1-notice { padding: 1rem 1.2rem; border-radius: 8px; font-weight: 600; }
.n1-notice.ok { background: #e3f4ef; color: #0b5a4f; }
.n1-notice.err { background: #fbe9e7; color: #8a2a1c; }

/* ---------- footer ---------- */
.n1-footer { background: var(--wp--preset--color--ink); color: #b9c7d0; padding-top: 3.5rem; padding-bottom: 2rem; font-size: .95rem; }
.n1-footer h4 { color: #fff; font-family: var(--wp--preset--font-family--manrope); font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 1rem; }
.n1-footer a { color: #dfe7ec; text-decoration: none; }
.n1-footer a:hover { color: #7ee88a; text-decoration: underline; }
.n1-footer ul { list-style: none; padding: 0; margin: 0; }
.n1-footer li { margin-bottom: .45rem; }
.n1-footer .n1-wordmark { color: #fff; }
.n1-footer .n1-wordmark small { color: #8fa3b0; }
.n1-footer-bottom { border-top: 1px solid rgba(255,255,255,.12); margin-top: 2.5rem !important; padding-top: 1.25rem; font-size: .85rem; color: #8fa3b0; }

@media (max-width: 781px) {
  .n1-card { padding: 1.4rem 1.25rem; }
  .n1-step::before { left: 1.25rem; }
}

/* ---------- logo ---------- */
.n1-logo { display: inline-flex; flex-direction: column; text-decoration: none; line-height: 1; }
.n1-logo img { height: 28px; width: auto; display: block; }
.n1-logo small {
  font-size: .62rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase;
  color: var(--wp--preset--color--muted); margin-top: .35rem;
}
.n1-footer .n1-logo small { color: #8fa3b0; }
@media (max-width: 600px) { .n1-logo img { height: 22px; } }

/* ---------- colour coding ---------- */
.n1-c-green  { --c: #1a9e45; --c-soft: #e8f6ec; --c-light: #7ee88a; }
.n1-c-blue   { --c: #2b6fd6; --c-soft: #e9f0fc; --c-light: #8fb8ff; }
.n1-c-amber  { --c: #c98411; --c-soft: #fcf3e2; --c-light: #f5c868; }
.n1-c-violet { --c: #7a4fd0; --c-soft: #f1ecfb; --c-light: #c2a8ff; }
.n1-c-coral  { --c: #df5434; --c-soft: #fcece8; --c-light: #ff9f86; }
.n1-c-teal   { --c: #0f9494; --c-soft: #e4f5f5; --c-light: #74dcdc; }

.n1-card[class*="n1-c-"] { border-top: 4px solid var(--c); }
.n1-card[class*="n1-c-"] .n1-icon { background: var(--c-soft); color: var(--c); }
.n1-card[class*="n1-c-"] h3 a::after,
.n1-card[class*="n1-c-"].n1-step::before { color: var(--c); }
.n1-card[class*="n1-c-"] .n1-tag { color: var(--c); background: var(--c-soft); }
.n1-card.is-link[class*="n1-c-"]:hover { border-color: var(--c); box-shadow: 0 14px 34px color-mix(in srgb, var(--c) 18%, transparent); }

.n1-stat[class*="n1-c-"] strong { color: var(--c-light); }
.n1-proof { border-top: 4px solid; border-image: linear-gradient(90deg, #1a9e45, #0f9494, #2b6fd6, #7a4fd0, #df5434, #e3a72f) 1; }

.n1-hero[class*="n1-c-"] {
  background:
    radial-gradient(1100px 500px at 85% -10%, color-mix(in srgb, var(--c) 45%, transparent), transparent 60%),
    radial-gradient(700px 400px at -10% 110%, rgba(0, 200, 0, .14), transparent 60%),
    var(--wp--preset--color--navy);
}
.n1-hero[class*="n1-c-"] .n1-eyebrow { color: var(--c-light); }

.n1-result[class*="n1-c-"] > .n1-eyebrow { color: var(--c); }
.n1-result[class*="n1-c-"] .n1-figure { background: var(--c-soft); }
.n1-result[class*="n1-c-"] .n1-figure strong { color: var(--c); }
.n1-result[class*="n1-c-"] ul.n1-checks li::before { background-color: var(--c); }
.n1-result h3 { font-size: 1.1rem; margin-top: 1.4rem; }
.n1-result h3:first-child { margin-top: 0; }
.n1-result-label { font-family: var(--wp--preset--font-family--manrope) !important; font-size: .8rem !important; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--muted) !important; margin-top: 2rem !important; }

/* section tints */
.n1-soft { background: linear-gradient(180deg, #eff7f1 0%, #f6faf7 100%); }

/* CTA band buttons: white primary for contrast on green */
.n1-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link { background: #fff; color: var(--wp--preset--color--accent-dark); }
.n1-cta .wp-block-button:not(.is-style-outline) .wp-block-button__link:hover { background: #e9fbe9; }
.n1-cta p { color: #d7ecdc; }

/* ---------- mobile menu ---------- */
/* backdrop-filter makes the header the containing block for the fixed overlay, squashing it into the bar */
.n1-header:has(.is-menu-open) { backdrop-filter: none; background: var(--wp--preset--color--base); }
@media (max-width: 599px) {
  .n1-header { backdrop-filter: none; background: var(--wp--preset--color--base); }
}
.n1-header .wp-block-navigation__responsive-container.is-menu-open {
  background: var(--wp--preset--color--base); color: var(--wp--preset--color--ink); padding: 1.25rem 1.5rem 2rem;
}
.n1-header .is-menu-open .wp-block-navigation__responsive-container-content,
.n1-header .is-menu-open .wp-block-navigation__container { align-items: flex-start !important; gap: 1.1rem !important; }
.n1-header .is-menu-open .wp-block-navigation__responsive-container-content { padding-top: 2.5rem; font-size: 1.2rem; }
.n1-header .is-menu-open .wp-block-navigation__submenu-container {
  border: 0 !important; box-shadow: none !important; min-width: 0 !important;
  padding: .6rem 0 0 1rem !important; gap: .7rem !important; font-size: 1rem; font-weight: 500;
}
.n1-header .is-menu-open .wp-block-navigation__submenu-container a { padding: 0 !important; color: var(--wp--preset--color--muted); }
.n1-header .is-menu-open .n1-nav-cta { margin-top: .5rem; }
.n1-header .wp-block-navigation__responsive-container-open svg,
.n1-header .wp-block-navigation__responsive-container-close svg { width: 30px; height: 30px; }
.n1-header .is-menu-open .has-child,
.n1-header .is-menu-open .wp-block-navigation__submenu-container { align-items: flex-start !important; text-align: left; }
.n1-header .is-menu-open .wp-block-navigation-item { justify-content: flex-start !important; }
