/*
Theme Name: CAIOSS
Theme URI: https://caioss.com
Description: Astra child theme — calm, accessible SaaS/AI editorial identity.
Author: CAIOSS
Template: astra
Version: 2.5.14
Text Domain: caioss
*/

:root {
  --caioss-bg: #f6f8fc;
  --caioss-surface: #ffffff;
  --caioss-surface-2: #eef3f9;
  --caioss-border: #d9e2ef;
  --caioss-ink: #172033;
  --caioss-muted: #64748b;
  --caioss-body: #334155;
  --caioss-cyan: #0369a1;
  --caioss-indigo: #818cf8;
  --caioss-focus: #f7c948;
  --caioss-danger: #ff8a8a;
  --caioss-content: 44rem;
  --caioss-wide: 72rem;
}

html { scroll-behavior: smooth; }
body,
.ast-separate-container,
.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-single {
  background: var(--caioss-bg);
  color: var(--caioss-ink);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: 1rem;
  line-height: 1.7;
}

body { overflow-wrap: break-word; }
.site-content { min-height: 50vh; }
.ast-container { max-width: var(--caioss-wide); padding-inline: 1.25rem; }
.entry-content,
.entry-header,
.ast-single-post .entry-content { max-width: var(--caioss-content); margin-inline: auto; }
.ast-page-builder-template .entry-content { max-width: var(--caioss-wide); }

h1, h2, h3, h4, h5, h6,
.entry-title, .entry-title a {
  color: var(--caioss-ink);
  font-weight: 700;
  letter-spacing: -0.02em;
}
h1, .entry-title { font-size: clamp(2rem, 5vw, 3.5rem); line-height: 1.08; }
h2 { font-size: clamp(1.5rem, 3vw, 2.25rem); line-height: 1.18; margin-top: 3rem; }
h3 { font-size: clamp(1.25rem, 2vw, 1.375rem); line-height: 1.3; }
p, ul, ol { margin-bottom: 1.25rem; }
.entry-meta, .entry-meta *, .ast-blog-meta-container, figcaption { color: var(--caioss-muted); }

.entry-content a:not(.wp-element-button),
.site-footer a,
.caioss-footer a {
  color: var(--caioss-cyan);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 0.18em;
}
.entry-content a:not(.wp-element-button):visited { color: #a8afff; }
a:hover { text-decoration-thickness: 2px; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--caioss-focus) !important;
  outline-offset: 3px;
}

.site-header,
.ast-primary-header-bar,
.ast-mobile-header-wrap .ast-primary-header-bar {
  background: #0f172a;
  border-bottom: 1px solid #26344d;
}
.ast-primary-header-bar { min-height: 4.5rem; }
.site-title a, .site-branding a, .ast-site-title-wrap .site-title a { color: #f8fafc; font-weight: 800; letter-spacing: 0.04em; }
#ast-desktop-header .ast-builder-grid-row { grid-template-columns:minmax(16rem,28rem) minmax(38rem,1fr); }
.main-header-menu { display:flex; flex-wrap:nowrap; }
.main-header-menu > .menu-item > .menu-link,
.ast-header-break-point .main-header-menu .menu-link { color:#e2e8f0; min-height:44px; white-space:nowrap; }
.main-header-menu > .menu-item > .menu-link:hover { color: #bae6fd; }
.main-header-menu > .current-menu-item > .menu-link,
.main-header-menu > .current_page_item > .menu-link,
.main-header-menu > .menu-item > .menu-link[aria-current="page"] { color: #7dd3fc; box-shadow: inset 0 -3px #38bdf8; font-weight: 700; }
.ast-mobile-popup-drawer .ast-mobile-popup-inner { background: #0f172a; }
.ast-button-wrap .menu-toggle.main-header-menu-toggle { color: #f8fafc; min-width: 44px; min-height: 44px; }
.site-header .ast-builder-layout-element:has(> .brand-tagline) { flex-wrap: wrap; align-content: center; }
.site-header .brand-tagline { color: #cbd5e1; flex: 0 0 100%; }
.custom-logo { width: auto; max-height: 3.75rem; }
@media (max-width: 57.5rem) {
  .site-header .custom-logo-link img.custom-logo { width: 11.25rem !important; max-width: 52vw; height: auto; max-height: none; }
  .site-header .brand-tagline { font-size: 0.72rem; margin-top: 0.2rem; }
}

.wp-block-button__link,
a.wp-element-button,
.caioss-cta {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0.75rem 1.125rem;
  background: var(--caioss-cyan);
  color: var(--caioss-bg) !important;
  border: 1px solid var(--caioss-cyan);
  border-radius: 6px;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none !important;
}
.wp-block-button__link:hover,
a.wp-element-button:hover,
.caioss-cta:hover { background: #075985; border-color: #075985; color: #ffffff !important; }

.wp-block-group.caioss-offer-card,
.caioss-note,
.wp-block-query .wp-block-post {
  background: var(--caioss-surface);
  border: 1px solid var(--caioss-border);
  border-radius: 12px;
  padding: 1.25rem;
}

.ast-separate-container .ast-article-post,
.ast-separate-container .ast-article-post .ast-article-inner,
.ast-separate-container .ast-article-post .entry-content,
.ast-separate-container .ast-article-post .entry-summary {
  background: var(--caioss-surface) !important;
  color: var(--caioss-body) !important;
}
.ast-separate-container .ast-article-post {
  border: 1px solid var(--caioss-border);
  border-radius: 12px;
  margin-bottom: 1.5rem;
  padding: clamp(1.25rem, 3vw, 2rem);
  min-height: 0;
  transition: border-color 160ms ease, transform 160ms ease;
}
.ast-separate-container .ast-article-post:hover,
.ast-separate-container .ast-article-post:focus-within { border-color: var(--caioss-cyan); transform: translateY(-2px); }
.ast-separate-container .ast-article-post .entry-title,
.ast-separate-container .ast-article-post .entry-title a {
  color: var(--caioss-ink) !important;
  font-size: clamp(1.875rem, 3.3vw, 2.25rem);
  line-height: 1.12;
  font-weight: 750;
  text-decoration: none !important;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
}
.ast-separate-container .ast-article-post .entry-title a:hover,
.ast-separate-container .ast-article-post .entry-title a:focus-visible { text-decoration: underline !important; text-underline-offset: 0.15em; }
.ast-separate-container .ast-article-post .entry-summary,
.ast-separate-container .ast-article-post .entry-content,
.ast-separate-container .ast-article-post p { color: var(--caioss-body) !important; font-size: clamp(1rem, 1.5vw, 1.125rem); }
.ast-separate-container .ast-article-post .entry-meta,
.ast-separate-container .ast-article-post .entry-meta * { color: var(--caioss-muted) !important; }
.ast-separate-container .ast-article-post .cat-links,
.ast-separate-container .ast-article-post .cat-links a { color: var(--caioss-cyan) !important; font-weight: 700; }
.ast-separate-container .ast-article-post .post-thumb,
.ast-separate-container .ast-article-post .wp-post-image { background: var(--caioss-surface-2); }
.ast-separate-container .ast-article-post .post-thumb { border: 1px solid var(--caioss-border); border-radius: 8px; overflow: hidden; padding: 0.4rem; }
.ast-separate-container .ast-article-post .post-thumb img,
.ast-separate-container .ast-article-post img.wp-post-image { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 6px; }

.brand-tagline { color: var(--caioss-muted); font-size: clamp(0.72rem, 1.1vw, 0.9rem); line-height: 1.3; margin: 0.2rem 0 0; max-width: 34rem; }
.brand-hero {
  background-color: #071426;
  background-image: linear-gradient(125deg, #071426 0%, #0b1d35 58%, #102743 100%);
  border-bottom: 1px solid #26344d;
  padding-block: clamp(2.75rem, 5vw, 4.75rem);
}
.brand-hero .ast-container { align-items:center; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(22rem,.85fr); gap:clamp(2rem,4vw,4rem); }
.brand-hero__copy { min-width: 0; }
.brand-hero__eyebrow { color: #7dd3fc; font-size: 0.85rem; font-weight: 800; letter-spacing: 0.12em; margin-bottom: 0.75rem; text-transform: uppercase; }
.brand-hero h1 { color:#f8fafc; font-size:clamp(2.25rem,5vw,3.8rem); margin:0 0 1rem; max-width:18ch; overflow-wrap:normal; text-wrap:balance; }
.brand-hero__copy > p:last-of-type { color: #e2e8f0; font-size: clamp(1.05rem, 2vw, 1.3rem); max-width: 42rem; margin: 0; }
.brand-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; margin-top: 1.5rem; }
.brand-hero__button { background: var(--caioss-cyan); border: 1px solid var(--caioss-cyan); border-radius: 6px; color: #fff !important; font-weight: 750; min-height: 44px; padding: 0.75rem 1.1rem; text-decoration: none !important; }
.brand-hero__button:hover, .brand-hero__button:focus-visible { background: #075985; border-color: #075985; }
.brand-hero__text-link { color: #bae6fd; font-weight: 700; text-underline-offset: 0.2em; }
.route-visual { background:#0f1f36; border:1px solid rgba(125,211,252,.35); border-radius:16px; box-shadow:0 24px 60px rgba(2,6,23,.35); margin:0; overflow:hidden; animation:caioss-card-in 440ms ease-out both; }
.route-visual img { aspect-ratio:16 / 9; display:block; height:auto; object-fit:cover; width:100%; }
@keyframes caioss-card-in { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
.brand-search { position: relative; align-items: center; }
.brand-search summary { align-items:center; color:#e8eef8; cursor:pointer; display:flex; justify-content:center; list-style:none; min-height:44px; min-width:44px; }
.brand-search summary::-webkit-details-marker { display: none; }
.brand-search form { background: var(--caioss-surface); border: 1px solid var(--caioss-border); border-radius: 8px; box-shadow: 0 12px 30px rgba(15,23,42,.18); display: flex; gap: .5rem; padding: .75rem; position: absolute; right: 0; top: calc(100% + .25rem); width: min(22rem, 85vw); z-index: 20; }
.brand-search input { border: 1px solid var(--caioss-border); min-height: 44px; min-width: 0; padding: .55rem .7rem; }
.brand-search button { background: var(--caioss-cyan); border: 0; border-radius: 5px; color: #fff; min-height: 44px; padding: .55rem .8rem; }
.route-page .entry-header { display:none; }
.route-hero { background:linear-gradient(135deg,#eef3f9 0%,#fff 62%,#e7f6fb 100%); border-bottom:1px solid var(--caioss-border); padding-block:clamp(2.25rem,5vw,4.5rem); }
.route-hero .ast-container { align-items:center; display:grid; gap:clamp(2rem,4vw,4rem); grid-template-columns:minmax(0,1.15fr) minmax(22rem,.85fr); }
.route-hero__eyebrow { color:var(--caioss-cyan); font-size:.82rem; font-weight:800; letter-spacing:.12em; margin-bottom:.75rem; text-transform:uppercase; }
.route-hero h1 { color:var(--caioss-ink); font-size:clamp(2.2rem,4vw,3.65rem); margin:0 0 1rem; max-width:24ch; overflow-wrap:normal; text-wrap:balance; }
.route-hero__copy > p:last-child { color:var(--caioss-body); font-size:clamp(1.05rem,2vw,1.25rem); margin:0; max-width:42rem; }
.route-page .site-content { padding-top:0; }
.route-page .site-main > article { padding-top:clamp(2rem,4vw,4rem); }
.section-page .section-hero-copy { display:none; }
.section-eyebrow { color: var(--caioss-cyan); font-size: .8rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.listing-disclosure { align-items:center; background:var(--caioss-surface-2); border-radius:8px; color:var(--caioss-body); display:flex; font-size:.9rem; gap:.75rem; padding:.8rem 1rem; }
.listing-disclosure::before { background-color:var(--caioss-cyan); content:""; flex:0 0 24px; height:24px; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' d='M6 2h8l4 4v5h-2V7h-3V4H8v16h4v2H6a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm11.6 11.2 1.4 1.4-4.2 4.2-2.3-2.3 1.4-1.4.9.9 2.8-2.8Z'/%3E%3C/svg%3E") center/contain no-repeat; width:24px; }
.section-page .wp-block-post-template { display: grid; gap: 1.25rem; grid-template-columns: repeat(2,minmax(0,1fr)); }
.section-page .wp-block-post { background:#fff; border:1px solid var(--caioss-border); border-radius:12px; overflow:hidden; padding:0 1.25rem 1.25rem; }
.section-page .wp-block-post-featured-image { margin:0 -1.25rem 1rem; }
.section-page .wp-block-post-featured-image img { aspect-ratio:16 / 9; height:auto; object-fit:cover; width:100%; }
.section-page .wp-block-post-title a { color: var(--caioss-ink); text-decoration: none; }
.section-page .wp-block-post-title a:hover { color: var(--caioss-cyan); text-decoration: underline; }
.section-card__terms,.section-card__date { color: var(--caioss-muted); font-size: .82rem; }
.search-no-results .site-main,.error404 .site-main { background:#fff; border:1px solid var(--caioss-border); border-radius:12px; padding:clamp(1.5rem,4vw,3rem); }
@media (prefers-reduced-data: reduce) {
  .brand-hero { background-image: linear-gradient(115deg, #071426 0%, #102743 100%); }
  .route-visual { display:none; }
  .brand-hero .ast-container,.route-hero .ast-container { grid-template-columns:1fr; }
}

.home .site-main > .ast-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; align-items: start; }
.home .site-main > .ast-row > article { width: 100% !important; margin: 0 !important; padding: clamp(1.25rem, 3vw, 2rem) !important; }
.home .site-main > .ast-row > article:first-of-type { grid-column: 1 / -1; }
.home .site-main > .ast-row > article:first-of-type .post-content { display: grid; grid-template-columns: minmax(0, 0.9fr) minmax(20rem, 1.1fr); column-gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.home .site-main > .ast-row > article:first-of-type .post-thumb { grid-column: 1; grid-row: 1 / 7; margin: 0; }
.home .site-main > .ast-row > article:first-of-type .post-content > :not(.post-thumb) { grid-column: 2; }
.home .site-main > .ast-row > article:first-of-type .entry-title,
.home .site-main > .ast-row > article:first-of-type .entry-title a { font-size: clamp(1.875rem, 3.2vw, 2.25rem); }
.home .site-main > .ast-row > article:not(:first-of-type) .entry-title,
.home .site-main > .ast-row > article:not(:first-of-type) .entry-title a { font-size: clamp(1.375rem, 2.2vw, 1.625rem); line-height: 1.18; }
.home .site-main > .ast-row > article:not(:first-of-type) .entry-summary,
.home .site-main > .ast-row > article:not(:first-of-type) .entry-content,
.home .site-main > .ast-row > article:not(:first-of-type) p { font-size: 1rem !important; }
.home .ast-pagination { grid-column: 1 / -1; }
.affiliate-disclosure { color: var(--caioss-muted); font-size: 0.875rem; }
.caioss-note--takeaways { border-left: 4px solid var(--caioss-cyan); }
.caioss-note--limits { border-left: 4px solid var(--caioss-danger); }
.caioss-note--limits h3 { color: var(--caioss-danger); }

.entry-content { min-width: 0; }
.entry-content :where(img, svg, video, canvas, iframe) { height: auto; max-width: 100%; }
.entry-content figure { max-width: 100%; }
.entry-content pre { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.entry-content :where(.wp-block-buttons, .brand-hero__actions) { max-width: 100%; flex-wrap: wrap; }
.wp-block-table { width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.wp-block-table table { width: 100%; min-width: 40rem; max-width: none; border-collapse: collapse; color: var(--caioss-ink); }
.entry-content > table { display: block; width: 100%; min-width: 0; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; border-collapse: collapse; color: var(--caioss-ink); }
.wp-block-table th, .wp-block-table td, .entry-content > table th, .entry-content > table td { border: 1px solid #d9e2ef; padding: 0.75rem; vertical-align: top; }
.wp-block-table thead th, .entry-content > table thead th { background: var(--caioss-surface-2); color: var(--caioss-ink); font-weight: 700; padding: 0.75rem; text-align: left; vertical-align: middle; }
.wp-block-table tbody td.is-numeric, .entry-content > table tbody td.is-numeric { text-align: right; font-variant-numeric: tabular-nums; }
.wp-block-table tbody tr:nth-child(even), .entry-content > table tbody tr:nth-child(even) { background: var(--caioss-surface-2); }
.wp-block-table tbody tr:nth-child(odd), .entry-content > table tbody tr:nth-child(odd) { background: var(--caioss-surface); }

.entry-content details { margin-block: 1rem; background: var(--caioss-surface); border: 1px solid var(--caioss-surface-2); border-radius: 10px; padding: 0.9rem 1rem; }
.entry-content summary { min-height: 44px; cursor: pointer; color: var(--caioss-ink); font-weight: 700; }
.entry-content details > :last-child { margin-bottom: 0; }

.method-process,.method-component,.about-component { background:#fff; border:1px solid var(--caioss-border); border-radius:14px; margin-block:1.5rem; padding:clamp(1.25rem,3vw,2rem); }
.method-process h2,.method-component h2,.about-component h2 { font-size:clamp(1.35rem,2vw,1.75rem); margin:0 0 .75rem; }
.method-process ol { counter-reset:steps; display:grid; gap:.75rem; grid-template-columns:repeat(5,minmax(0,1fr)); list-style:none; margin:1.5rem 0 0; padding:0; }
.method-process li { color:var(--caioss-body); font-size:.88rem; font-weight:700; min-width:0; position:relative; text-align:center; }
.method-process li::before { align-items:center; background:#0f172a; border:3px solid #7dd3fc; border-radius:50%; color:#fff; content:counter(steps); counter-increment:steps; display:flex; height:42px; justify-content:center; margin:0 auto .65rem; position:relative; width:42px; z-index:2; }
.method-process li:not(:last-child)::after { background:#bae6fd; content:""; height:3px; left:calc(50% + 21px); position:absolute; top:20px; width:calc(100% - 42px); z-index:1; }
.method-component,.about-component { display:grid; gap:1.25rem; grid-template-columns:64px minmax(0,1fr); }
.component-icon { align-items:center; background:var(--caioss-surface-2); border-radius:12px; color:var(--caioss-cyan); display:flex; height:56px; justify-content:center; width:56px; }
.component-icon svg { height:32px; width:32px; }
.component-copy > :last-child { margin-bottom:0; }
.evidence-scale { display:grid; gap:.55rem; margin:1rem 0; }
.evidence-scale span { align-items:center; background:#e8f6fb; border-left:calc(var(--level) * 7px) solid var(--caioss-cyan); color:var(--caioss-body); display:flex; min-height:38px; padding:.4rem .75rem; }
.about-components { display:grid; gap:1.25rem; grid-template-columns:repeat(3,minmax(0,1fr)); }
.route-a-propos .entry-content { margin-inline:auto !important; max-width:1088px !important; width:100% !important; }
.route-a-propos .entry-content .about-components { margin:0 !important; max-width:none !important; transform:none !important; width:100% !important; }
.about-component { align-content:start; grid-template-columns:1fr; grid-template-rows:auto auto; margin:0; }
.about-component .component-icon { margin-bottom:.25rem; }
.entry-content .method-process h2,.entry-content .method-component h2,.entry-content .about-component h2 { margin:0 0 .75rem; }

.caioss-footer { background: #0f172a; border-top: 1px solid #26344d; color: #cbd5e1; padding: 3rem 1.25rem; }
.caioss-footer__inner { display: grid; grid-template-columns: minmax(14rem, 2fr) repeat(3, minmax(9rem, 1fr)); gap: 2rem; max-width: var(--caioss-wide); margin: 0 auto; }
.caioss-footer__brand > a { color: #f8fafc; font-size: 1.2rem; font-weight: 800; text-decoration: none; }
.caioss-footer h2 { color: #f8fafc; font-size: 1rem; margin: 0 0 0.75rem; }
.caioss-footer a { color: #7dd3fc; }
.caioss-footer ul { list-style: none; margin: 0; padding: 0; }
.caioss-footer li { margin-bottom: 0.5rem; }
.site-below-footer-wrap { background: #070b16; color: #b8c3d6; }
.site-footer .site-below-footer-wrap { background:#070b16 !important; color:#b8c3d6; }

@media (min-width: 64rem) {
  body { font-size: 1.0625rem; }
  .ast-container { padding-inline: 2rem; }
  .entry-content h2 { margin-top: 4.5rem; }
}

@media (max-width: 63.99rem) {
  .ast-primary-header-bar { min-height: 4rem; }
  .brand-hero .ast-container,.route-hero .ast-container { grid-template-columns:1fr; }
  .route-visual { max-width:46rem; }
  .section-page .wp-block-post-template { grid-template-columns: 1fr; }
  .home .site-main > .ast-row { grid-template-columns: 1fr; }
  .home .site-main > .ast-row > article:first-of-type { grid-column: auto; }
  .home .site-main > .ast-row > article:first-of-type .post-content { display: block; }
  .caioss-footer__inner { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .about-components { grid-template-columns:1fr; }
}

@media (max-width: 37.5rem) {
  .caioss-footer__inner { grid-template-columns: 1fr; }
  .wp-block-button, .wp-block-button__link { width: 100%; justify-content: center; }
  .method-process ol { grid-template-columns:1fr; }
  .method-process li { align-items:center; display:grid; gap:.75rem; grid-template-columns:42px 1fr; text-align:left; }
  .method-process li::before { margin:0; }
  .method-process li:not(:last-child)::after { height:calc(100% - 24px); left:20px; top:36px; width:3px; }
  .method-component,.about-component { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .brand-method-card { animation: none; }
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; }
}
