/*
Theme Name: Webics Consulting
Theme URI: https://webicsconsulting.online
Author: Webics Consulting (INSTANT PAYMENTS LIMITED)
Author URI: https://webicsconsulting.online
Description: B2B UI/UX design, layout audit and frontend engineering agency theme. Includes the full corporate landing page, a request-a-proposal workflow and a complete set of legal and policy pages.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: webics
Tags: business, agency, one-column, custom-menu, custom-logo, translation-ready
*/

/* ------------------------------------------------------------------
   Design tokens
   Palette : deep slate ink, emerald accent, cool paper
   Display : Familjen Grotesk   Body : Inter   Utility : IBM Plex Mono
------------------------------------------------------------------ */

:root {
  --ink:        #0B1418;
  --slate:      #16242B;
  --slate-soft: #223640;
  --paper:      #F3F6F4;
  --paper-2:    #E6ECE8;
  --emerald:    #10A96B;
  --emerald-dk: #06603C;
  --mist:       #9DB2AA;
  --line:       rgba(157, 178, 170, .28);

  --font-display: "Familjen Grotesk", "Helvetica Neue", Arial, sans-serif;
  --font-body:    "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-mono:    "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
}

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
}

body {
  font-family: var(--font-body);
  background: var(--paper);
  color: var(--ink);
  font-feature-settings: "cv02","cv03","cv04","ss01";
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, .font-display { font-family: var(--font-display); letter-spacing: -.02em; }
.font-mono, .spec { font-family: var(--font-mono); }

/* Utility spec label — the recurring "measurement annotation" motif */
.spec {
  font-size: .6875rem;
  letter-spacing: .16em;
  text-transform: uppercase;
  font-weight: 500;
}

/* Signature: hairline measurement ticks used as section rules */
.tickrule {
  height: 14px;
  background-image: repeating-linear-gradient(to right,
    var(--line) 0 1px, transparent 1px 12px);
  background-position: bottom;
  background-repeat: repeat-x;
  background-size: 12px 8px;
}
.tickrule--dark {
  background-image: repeating-linear-gradient(to right,
    rgba(255,255,255,.22) 0 1px, transparent 1px 12px);
}

/* Baseline grid overlay used behind the hero */
.baseline-grid {
  background-image:
    linear-gradient(to bottom, rgba(157,178,170,.16) 1px, transparent 1px);
  background-size: 100% 32px;
}
.column-grid {
  background-image:
    linear-gradient(to right, rgba(157,178,170,.14) 1px, transparent 1px);
  background-size: 8.3333% 100%;
}

/* Focus visibility floor */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 2px solid var(--emerald);
  outline-offset: 3px;
  border-radius: 2px;
}

.skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999;
  background: var(--ink); color: #fff; padding: .75rem 1.25rem;
  font-family: var(--font-mono); font-size: .8125rem;
}
.skip-link:focus { left: 1rem; top: 1rem; }

/* Long-form legal typography */
.legal-prose { max-width: 74ch; }
.legal-prose p { margin: 0 0 1.15rem; line-height: 1.75; color: #33474F; }
.legal-prose ul, .legal-prose ol { margin: 0 0 1.35rem 1.15rem; line-height: 1.75; color: #33474F; }
.legal-prose ul { list-style: disc; }
.legal-prose ol { list-style: decimal; }
.legal-prose li { margin-bottom: .5rem; padding-left: .25rem; }
.legal-prose strong { color: var(--ink); font-weight: 600; }
.legal-prose a { color: var(--emerald-dk); text-decoration: underline; text-underline-offset: 3px; }
.legal-prose table { width: 100%; border-collapse: collapse; margin: 0 0 1.5rem; font-size: .9375rem; }
.legal-prose th, .legal-prose td {
  border: 1px solid var(--line); padding: .7rem .85rem; text-align: left; vertical-align: top;
}
.legal-prose th { background: #fff; font-weight: 600; color: var(--ink); }
.legal-prose td { color: #33474F; }

/* Accordion marker */
details > summary { list-style: none; cursor: pointer; }
details > summary::-webkit-details-marker { display: none; }
details[open] .acc-icon { transform: rotate(45deg); }

/* WordPress core alignment classes */
.alignleft  { float: left;  margin: .5rem 1.5rem 1rem 0; }
.alignright { float: right; margin: .5rem 0 1rem 1.5rem; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.screen-reader-text {
  border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%);
  height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute;
}
