/*
Theme Name: Centri Point Operations
Theme URI: https://centripointgroup.com/
Author: Centri Point Group
Description: Local redesign prototype for Centri Point Group remote operations staffing.
Version: 0.2.15
*/

:root { --ink:#0b2943; --ink-soft:#193d59; --blue:#159bd7; --blue-dark:#0872a8; --cyan:#bfeeff; --amber:#ef9b4c; --paper:#f7fafb; --white:#fff; --muted:#5e7180; --line:#d7e1e7; --shadow:0 22px 60px rgba(11,41,67,.13); --radius:5px; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Arial, Helvetica, sans-serif; font-size:16px; line-height:1.65; }
a { color:inherit; }
.cpo-container { width:min(1180px, calc(100% - 3rem)); margin-inline:auto; }
.cpo-skip { position:absolute; left:1rem; top:-5rem; z-index:20; padding:.7rem 1rem; background:var(--amber); color:var(--ink); font-weight:700; }
.cpo-skip:focus { top:1rem; }
.cpo-header { position:sticky; top:0; z-index:10; background:rgba(247,250,251,.96); border-bottom:1px solid rgba(11,41,67,.12); backdrop-filter:blur(12px); }
.cpo-header-inner { min-height:82px; display:flex; align-items:center; justify-content:space-between; gap:2rem; }
.cpo-brand { display:flex; align-items:center; gap:.75rem; text-decoration:none; letter-spacing:-.04em; line-height:1.05; }
.cpo-logo-mark { width:46px; height:46px; flex:0 0 auto; display:block; }
.cpo-brand-name { display:block; font-size:1rem; font-weight:850; }
.cpo-brand small { display:block; color:var(--muted); font-size:.75rem; letter-spacing:.1em; margin-top:.35rem; }
.cpo-nav { display:flex; align-items:center; gap:1.25rem; font-size:.88rem; font-weight:700; }
.cpo-nav a { text-decoration:none; color:var(--muted); }.cpo-nav a:hover,.cpo-nav a:focus-visible { color:var(--ink); }
.cpo-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.7rem 1.15rem; border:1px solid var(--ink); border-radius:999px; background:transparent; text-decoration:none; font-weight:800; transition:transform .18s ease, background .18s ease; }.cpo-button:hover,.cpo-button:focus-visible { transform:translateY(-2px); }.cpo-button-primary { background:var(--amber); border-color:var(--amber); color:var(--ink); }.cpo-button-dark { background:var(--ink); color:var(--white); }
.cpo-menu { display:none; border:1px solid var(--line); background:var(--white); padding:.55rem .75rem; font-weight:700; }
.cpo-hero { position:relative; overflow:hidden; padding:7rem 0 6rem; background:radial-gradient(circle at 78% 22%, rgba(191,238,255,.95), transparent 30%), linear-gradient(135deg, #eef9fc 0%, var(--paper) 55%, #e0f4fb 100%); }
.cpo-hero:before { content:''; position:absolute; inset:0; pointer-events:none; opacity:.42; background-image:linear-gradient(rgba(21,155,215,.08) 1px, transparent 1px),linear-gradient(90deg, rgba(21,155,215,.08) 1px, transparent 1px); background-size:42px 42px; mask-image:linear-gradient(90deg, black, transparent 72%); }
.cpo-hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.78fr); align-items:center; gap:5rem; }.cpo-kicker { margin:0; color:var(--blue-dark); font-size:.78rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }.cpo-hero h1,.cpo-section h2 { margin:.7rem 0 1.25rem; font-family:Georgia, 'Times New Roman', serif; font-weight:500; letter-spacing:-.06em; line-height:1.02; }.cpo-hero h1 { max-width:760px; font-size:clamp(3rem,6vw,5.8rem); }.cpo-lede { max-width:650px; color:var(--muted); font-size:1.2rem; }.cpo-actions { display:flex; flex-wrap:wrap; align-items:center; gap:.8rem; margin-top:2rem; }.cpo-note { margin-top:1rem; color:var(--muted); font-size:.85rem; }
.cpo-hero-card { position:relative; overflow:hidden; padding:2rem; background:var(--ink); color:var(--white); box-shadow:var(--shadow); }.cpo-hero-card:before,.cpo-hero-card:after { content:''; position:absolute; border:1px solid rgba(191,238,255,.3); border-radius:50%; width:390px; height:390px; right:-190px; top:-180px; }.cpo-hero-card:after { width:235px; height:235px; right:-110px; top:-100px; }.cpo-card-label,.cpo-card-foot,.cpo-work-row { position:relative; z-index:1; }.cpo-card-label { color:var(--cyan); font-size:.75rem; font-weight:800; letter-spacing:.12em; }.cpo-card-title { position:relative; z-index:1; margin:5rem 0 3rem; font-family:Georgia,serif; font-size:2.2rem; line-height:1.05; letter-spacing:-.05em; }.cpo-work-row { display:grid; grid-template-columns:105px 1fr 68px; gap:1rem; align-items:center; margin:1.1rem 0; font-size:.82rem; color:rgba(255,255,255,.75); }.cpo-work-row b { color:var(--white); font-size:.75rem; font-weight:600; text-align:right; }.cpo-bar { height:5px; background:rgba(255,255,255,.14); }.cpo-bar span { display:block; height:100%; background:var(--blue); }.cpo-card-foot { display:flex; gap:.6rem; align-items:center; margin-top:2.2rem; color:rgba(255,255,255,.68); font-size:.8rem; }.cpo-dot { width:8px; height:8px; border-radius:50%; background:var(--amber); }
.cpo-proof { background:var(--cyan); }.cpo-proof-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; padding:1.2rem 0; font-size:.86rem; font-weight:750; }.cpo-proof-grid div { display:flex; gap:.8rem; align-items:center; }.cpo-number { color:var(--blue-dark); font-size:.78rem; letter-spacing:.1em; }
.cpo-section { padding:7rem 0; }.cpo-section-paper { background:var(--paper); }.cpo-section-dark { background:var(--ink); color:var(--white); }.cpo-section-sky { background:#e6f5fb; }.cpo-section-communication { background:linear-gradient(120deg, #d7f3fb 0%, #bfeeff 100%); }.cpo-two-col { display:grid; grid-template-columns:.8fr 1.2fr; gap:5rem; align-items:start; }.cpo-section h2 { font-size:clamp(2.2rem,4vw,4rem); }.cpo-intro { color:var(--muted); max-width:650px; }.cpo-light { color:rgba(255,255,255,.72); }.cpo-light h2,.cpo-light .cpo-kicker { color:var(--white); }
.cpo-services { border-top:1px solid var(--line); }.cpo-service { display:grid; grid-template-columns:70px 1fr; gap:1rem; align-items:start; padding:1.4rem 0; border-bottom:1px solid var(--line); text-decoration:none; }.cpo-service h3 { margin:0 0 .25rem; font-size:1.15rem; }.cpo-service p { margin:0; color:var(--muted); }.cpo-faq { border-top:1px solid var(--line); }.cpo-faq details { border-bottom:1px solid var(--line); padding:1rem 0; }.cpo-faq summary { cursor:pointer; font-weight:800; padding-right:2rem; }.cpo-faq p { max-width:700px; margin:.75rem 0 0; color:var(--muted); }
.cpo-process-grid,.cpo-card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem; }.cpo-case-grid { grid-template-columns:repeat(2,1fr); }.cpo-process,.cpo-card { padding:1.5rem; border:1px solid rgba(255,255,255,.16); background:var(--ink-soft); }.cpo-card { background:var(--white); border-color:var(--line); min-height:210px; }.cpo-process h3,.cpo-card h3 { margin:2.2rem 0 .4rem; }.cpo-process p,.cpo-card p { margin:0 0 1rem; color:var(--muted); }.cpo-process p { color:rgba(255,255,255,.68); }
.cpo-cta { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:2rem; border:1px solid var(--line); }.cpo-cta h2 { max-width:700px; margin:0; font-size:clamp(2rem,3vw,3.2rem); }
.cpo-footer { padding:4rem 0 1.5rem; background:#061d30; color:var(--white); }.cpo-footer-grid { display:grid; grid-template-columns:1.2fr .8fr 1fr; gap:4rem; padding-bottom:3rem; }.cpo-footer .cpo-brand { color:var(--white); }.cpo-footer p,.cpo-footer a { color:rgba(255,255,255,.65); }.cpo-footer a { display:block; margin:.35rem 0; text-decoration:none; font-size:.88rem; }.cpo-footer a:hover,.cpo-footer a:focus-visible { color:var(--cyan); }.cpo-footer-label { color:var(--cyan); text-transform:uppercase; letter-spacing:.12em; font-size:.75rem; font-weight:900; }.cpo-footer-bottom { display:flex; justify-content:space-between; gap:1rem; border-top:1px solid rgba(255,255,255,.16); padding-top:1.2rem; color:rgba(255,255,255,.45); font-size:.75rem; }
.cpo-page { padding:5rem 0; }.cpo-page h1 { max-width:800px; font-family:Georgia,serif; font-size:clamp(2.8rem,5vw,5rem); line-height:1; letter-spacing:-.06em; }.cpo-page-content { max-width:820px; }.cpo-page-content img { max-width:100%; height:auto; }.cpo-page-content a { color:var(--blue-dark); }.cpo-page-content h2,.cpo-page-content h3 { font-family:Georgia,serif; font-weight:500; }.cpo-media-section { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; align-items:center; }.cpo-media-section > * { min-width:0; }.cpo-media-figure { width:100%; margin:0; overflow:hidden; border:1px solid var(--line); background:var(--white); box-shadow:0 12px 34px rgba(11,41,67,.1); }.cpo-media-figure img { display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover; }
.cpo-form-card { max-width:820px; margin-top:2.5rem; padding:2rem; background:var(--white); border:1px solid var(--line); box-shadow:var(--shadow); }.cpo-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }.cpo-field { display:grid; gap:.35rem; }.cpo-field-full { grid-column:1/-1; }.cpo-field label { font-size:.84rem; font-weight:800; }.cpo-field input,.cpo-field select,.cpo-field textarea { width:100%; border:1px solid #b8c9d3; border-radius:3px; padding:.75rem .8rem; background:var(--paper); color:var(--ink); font:inherit; }.cpo-field textarea { resize:vertical; }.cpo-field input:focus,.cpo-field select:focus,.cpo-field textarea:focus { outline:3px solid rgba(21,155,215,.25); border-color:var(--blue-dark); }.cpo-field-help { color:var(--muted); font-size:.78rem; line-height:1.4; }.cpo-form-status { margin:1rem 0; padding:.85rem; background:#e6f5fb; color:var(--ink); }.cpo-form-note { color:var(--muted); font-size:.8rem; }.cpo-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }.cpo-steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:2.5rem; }.cpo-step { border-top:1px solid var(--line); padding-top:1rem; }.cpo-step h3 { margin:2rem 0 .35rem; }.cpo-step p { margin:0; color:var(--muted); }.cpo-feature-list { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2.5rem; }.cpo-feature-list article { padding:1.25rem; border:1px solid var(--line); background:var(--white); }.cpo-feature-list h3 { margin:.5rem 0 .3rem; }.cpo-feature-list p { margin:0; color:var(--muted); }
.cpo-consent { display:block; }.cpo-consent label { display:flex; align-items:flex-start; gap:.6rem; font-weight:500; line-height:1.5; }.cpo-consent input { width:auto; margin-top:.25rem; }
@media (max-width:900px) { .cpo-nav { display:none; position:absolute; top:81px; left:1rem; right:1rem; padding:1rem; flex-direction:column; align-items:stretch; background:var(--white); box-shadow:var(--shadow); }.cpo-nav.is-open { display:flex; }.cpo-menu { display:block; }.cpo-hero-grid,.cpo-two-col { grid-template-columns:1fr; gap:3rem; }.cpo-hero { padding-top:4rem; }.cpo-hero-card { max-width:620px; }.cpo-footer-grid { grid-template-columns:1fr 1fr; }.cpo-footer-grid > :first-child { grid-column:1/-1; }.cpo-steps { grid-template-columns:1fr 1fr; } }
@media (max-width:620px) { .cpo-container { width:calc(100% - 2rem); }.cpo-header-inner { min-height:72px; }.cpo-nav { top:71px; }.cpo-hero h1 { font-size:clamp(2.8rem,14vw,4rem); }.cpo-lede { font-size:1.05rem; }.cpo-proof-grid,.cpo-process-grid,.cpo-card-grid,.cpo-case-grid,.cpo-footer-grid,.cpo-feature-list,.cpo-steps { grid-template-columns:1fr; }.cpo-proof-grid { gap:.7rem; }.cpo-section { padding:4.5rem 0; }.cpo-cta { flex-direction:column; align-items:flex-start; }.cpo-footer-grid > :first-child { grid-column:auto; }.cpo-footer-bottom { flex-direction:column; }.cpo-form-grid { grid-template-columns:1fr; }.cpo-field-full { grid-column:auto; }.cpo-form-card { padding:1rem; } }
.cpo-form-status-top { display:flex; align-items:flex-start; gap:.85rem; margin:0 0 2.25rem; padding:1.25rem 1.4rem; border:2px solid #168455; border-radius:5px; background:#e3f7eb; color:#0b3d2b; box-shadow:0 8px 24px rgba(22,132,85,.14); font-size:1rem; }
.cpo-form-status-top strong { display:block; font-size:1.15rem; line-height:1.3; }
.cpo-form-status-top small { display:block; margin-top:.25rem; color:#245b47; font-size:.95rem; line-height:1.5; }
.cpo-status-icon { display:grid; place-items:center; flex:0 0 1.8rem; width:1.8rem; height:1.8rem; border-radius:50%; background:#168455; color:#fff; font-weight:900; font-size:1.15rem; line-height:1; }
.cpo-form-status-error { border:2px solid #b42318; background:#fff0ee; color:#7a271a; }
.cpo-form-status-error small { color:#8f3023; }
