/* Shared visual system: warm paper, deep navy and the existing bronze identity. */
:root {
  --navy: #102b3b;
  --teal: #386c77;
  --gold: #b69a72;
  --gold-light: #dbc6a2;
  --soft: #f6f4ee;
  --line: #e1e3df;
  --paper: #fcfbf8;
}
body { background: var(--paper); color: var(--navy); -webkit-font-smoothing: antialiased; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.fractional-content .fractional-questions { list-style: none; margin: 26px 0 0; padding: 0; }
.fractional-content .fractional-questions li { margin: 0; padding: 22px 0; border-top: 1px solid var(--line); color: var(--navy); font-size: 19px; line-height: 1.8; font-weight: 500; }
.fractional-content .fractional-questions li::before { content: none; }
.fractional-content .fractional-questions li:last-child { border-bottom: 1px solid var(--line); }
::selection { background: #dac6a2; color: #102b3b; }
h1, h2, h3 { text-wrap: balance; }
p { color: #566774; }
.section { max-width: 1200px; padding-block: 80px; }
.section-heading { gap: 50px; margin-bottom: 36px; }
.section-heading h2 { font-size: clamp(30px,3.1vw,44px); line-height: 1.35; }
.section-heading>p { font-size: 17px; line-height: 1.9; }
.eyebrow { color: #886e47; font-size: 12px; letter-spacing: .02em; }
.eyebrow::before { width: 27px; height: 1px; background: currentColor; }
.eyebrow.light { color: var(--gold-light); }
.button { border-radius: 7px; padding: 13px 24px; transition: background .2s,color .2s,border-color .2s; }
.button:hover { transform: none; background: #234b5b; border-color: #234b5b; }
.read-link { font-size: 15px; }
.site-header { position: sticky; top: 0; z-index: 30; max-width: none; height: 92px; padding-inline: max(4%,calc((100% - 1320px)/2)); background: #fcfbf8f5; backdrop-filter: blur(14px); border-bottom: 1px solid #102b3b0d; gap: 24px; }
.site-header .brand { width: 137px; }
.site-header .brand img { height: 81px; }
.footer-logo { height: auto; background: #fff; border-radius: 4px; padding: 9px; }
.site-header nav { gap: 22px; font-size: 15px; }
.site-header nav a.active::after { background: var(--gold); }
.header-actions { gap: 16px; }
.header-actions .button { background: var(--navy); font-size: 13px; padding-inline: 16px; }
.language { min-width: 37px; padding: 5px 0; text-align: center; border: 1px solid var(--line); border-radius: 6px; }
.mobile-menu { top: 92px; background: var(--paper); border-bottom: 1px solid var(--line); }

/* Homepage */
.hero-promotion { min-width: 0; overflow: hidden; align-self: center; border: 1px solid #3b7186; border-radius: 18px; background: #082e45; box-shadow: 0 24px 55px #0003; }
.budget-art { aspect-ratio: 1280 / 234; overflow: hidden; background: #062c46; border-bottom: 1px solid #4e9eac55; }
.budget-art img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.budget-art[data-language=en] img { object-position: center bottom; }
.budget-promotion-copy { padding: 25px 28px 23px; }
.hero-promotion h2 { color: #fff; font-size: clamp(25px,2.15vw,31px); line-height: 1.45; margin: 0; }
.budget-offer { display: block; color: #e5f5f6; font-size: 18px; line-height: 1.8; margin: 14px 0; text-wrap: balance; }
.budget-offer strong { color: #36ded6; font-size: 34px; line-height: 1; white-space: nowrap; }
.budget-description { color: #c7dce5; font-size: 16px; line-height: 1.9; margin: 0 0 22px; }
.budget-action { width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; color: #052c3c; background: #36d4cc; border-color: #36d4cc; font-size: 16px; font-weight: 700; text-align: start; }
.budget-action svg { flex: 0 0 22px; width: 22px; height: 22px; }
html[dir=rtl] .budget-action svg { transform: rotate(180deg); }
.budget-action:hover { color: #052c3c; background: #71e5df; border-color: #71e5df; }
.budget-action:focus-visible { outline: 3px solid #fff; outline-offset: 4px; }
.budget-terms { color: #b6cdd8; font-size: 13px; line-height: 1.8; margin: 14px 0 0; }
@media(max-width:1100px) and (min-width:801px) { .budget-promotion-copy { padding: 22px; } .hero-promotion h2 { font-size: 25px; } .budget-description { font-size: 15px; } }
@media(max-width:800px) { .hero-promotion { order: -1; width: 100%; } .budget-promotion-copy { padding: 24px; } }
@media(max-width:500px) { .hero-promotion { border-radius: 12px; } .budget-promotion-copy { padding: 21px; } .hero-promotion h2 { font-size: 25px; } .budget-offer { font-size: 17px; } .budget-description { font-size: 15px; line-height: 1.85; } .budget-action { font-size: 15px; padding-inline: 15px; } .budget-terms { font-size: 12px; } }
.hero { background: #102b3b; }
.hero-grid { background: none; }
.hero::before { content: ''; position: absolute; inset-inline-end: -60px; bottom: -120px; width: 440px; height: 440px; background: var(--gold); opacity: .035; mask: url('/assets/cfo-map-symbol.svg') center/contain no-repeat; pointer-events: none; }
.hero-inner { max-width: 1320px; min-height: 620px; grid-template-columns: 1.08fr .92fr; gap: 64px; padding: 64px 4% 54px; }
.hero h1 { font-size: clamp(42px,4.4vw,65px); line-height: 1.3; letter-spacing: 0; }
.hero h1 em { color: var(--gold-light); }
.hero-copy .eyebrow { margin-bottom: 22px; }
.hero-copy>p { font-size: 19px; line-height: 1.9; color: #d0dce0; margin-top: 22px; max-width: 530px; }
.hero-actions { margin-top: 28px; }
.hero .light-button { background: var(--gold-light); border-color: var(--gold-light); color: #102b3b; }
.hero .light-button:hover { background: #eadbc0; border-color: #eadbc0; }
.hero-outline { border-color: #d1dedb60; color: #eef2ef; }
.hero-outline:hover { background: #ffffff0c; border-color: #d1dedb; }
.hero-credentials { margin-top: 26px; padding-top: 20px; border-color: #ffffff1c; gap: 10px 20px; }
.hero-credentials li { font-size: 13px; color: #c2d0d6; }
.hero-credentials li::before { color: var(--gold-light); }
.hero-visual { height: 450px; border: 0; border-radius: 56px 8px 8px 8px; background: linear-gradient(180deg,#102b3b05 18%,#102b3b7a 68%,#102b3bd9),url('/assets/riyadh.jpg') center 50%/cover; box-shadow: 0 18px 40px #06131c18; }
.hero-visual::before { background: linear-gradient(180deg,#102b3b48,transparent 45%); }
.visual-label { color: #fff; font-size: 10px; top: 28px; left: 28px; letter-spacing: 2px; }
.path-card { background: #fcfbf8f5; border: 0; border-inline-start: 3px solid var(--gold); border-radius: 4px; bottom: 44px; left: 20px; right: 20px; padding: 21px 23px; box-shadow: none; backdrop-filter: none; }
.path-card>span { color: #826a47; font-size: 12px; }
.path-card strong { font-size: 23px; line-height: 1.4; }
.path-card small { font-size: 12px; color: #526575; }
.path-track { margin-top: 20px; }
.path-track::before { background: #c9ba9f; }
.path-track i { background: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.visual-index { color: #e2e8e4; font-size: 10px; left: 25px; right: 25px; }
.hero-bottom { max-width: 1200px; padding-block: 16px; font-size: 10px; color: #b2c1c9; }
.clients-section { padding-block: 25px 22px; background: #fff; }
.clients-heading { max-width: 1200px; margin-bottom: 0; }
.clients-heading h2 { font-size: 19px; color: #64727b; }
.clients-heading .eyebrow { font-size: 11px; }
.client-track-group { padding-block: 14px 0; }
.client-logo { height: 88px; }
.needs-grid { gap: 18px; }
.need-item { position: relative; display: block; padding: 25px 0 48px; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; transition: border-color .2s; }
.need-top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 25px; }
.need-top svg { width: 31px; height: 31px; color: var(--teal); }
.need-item .mini-index { color: #917851; font-size: 13px; }
.need-item h3 { font-size: 22px; line-height: 1.45; }
.need-item p { font-size: 16px; line-height: 1.8; }
.need-arrow { position: absolute; bottom: 12px; inset-inline-end: 0; color: #917851; font-size: 23px; }
.need-item:hover { border-color: var(--teal); }
.soft-section { background: var(--soft); }
.cfo-comparison { padding: 0 0 32px; border: 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; color: var(--navy); margin-bottom: 36px; }
.cfo-comparison>h3 { font-size: 24px; }
.cfo-options span { color: #886e47; font-size: 12px; }
.cfo-options a { border: 0; font-size: 21px; }
.cfo-options p { color: #566774; font-size: 16px; line-height: 1.8; }
.cfo-options>div+div { border-color: var(--line); }
.services-grid { gap: 28px 36px; border: 0; }
.service-card { border: 0; border-top: 1px solid var(--line); border-radius: 0; padding: 27px 0 30px; background: transparent; }
.service-card:hover { background: transparent; border-color: var(--teal); box-shadow: none; }
.service-card h2,.service-card h3 { font-size: 24px; line-height: 1.5; max-width: none; }
.service-card p { line-height: 1.85; max-width: 36ch; }
.service-top { margin-bottom: 24px; }
.service-top svg { color: var(--teal); }
.service-top>span { color: #8e7857; }
.solutions-explorer { border: 1px solid var(--line); border-radius: 3px; overflow: hidden; background: #fff; }
.solution-tabs { background: #f2f0ea; }
.solution-tabs button { border-color: #dddcd4; padding: 19px 24px; font-size: 17px; }
.solution-tabs button[aria-selected=true] { background: var(--navy); color: white; }
.solution-panel { background: #fff; padding: 36px; }
.solution-panel h3 { font-size: 29px; }
.solution-panel .oversize-number { color: var(--gold); opacity: .14; }
.solution-disclosure { border-color: var(--line); }
.value-band { background: #e9efed; color: var(--navy); border-block: 1px solid #dfe5df; }
.value-band .eyebrow { color: #77613f; }
.value-band p { color: #526575; }
.value-band .value-grid>div { border-color: #cfdad5; }
.value-band svg { color: var(--teal); }
.why-section { gap: 70px; }
.why-list>div { border-color: #d9d8cf; }
.why-list h3 { font-size: 27px; }
.why-list>div>span { color: #927650; }
.founder-section { gap: 76px; }
.founder-photo { border: 0; border-radius: 40px 8px 8px; background: #efefed; border-bottom: 4px solid var(--gold); }
.founder-photo img { mix-blend-mode: multiply; }
.founder-role { color: var(--teal); }
.founder-license-list { border-color: var(--line); }
.founder-section p { font-size: 18px; line-height: 1.9; }
.founder-biography p { color: #4f616c; }
.article-card { background: transparent; border: 0; border-radius: 0; overflow: hidden; padding-bottom: 8px; }
.article-card>.article-meta,.article-card>h3,.article-card>p,.article-card>.read-link { margin-inline: 0; }
.article-card>.read-link { display: inline-flex; }
.article-card h3 { font-size: 23px; line-height: 1.5; }
.article-card>p { line-height: 1.8; }
.article-art { border: 0; height: 180px; background: #dfe8e7; }
.article-art.art-1 { background: #eae2d3; }
.article-art.art-2 { background: #e2e4e7; }
.article-art::before { background-image: none; }
.article-art svg { width: 65px; height: 65px; }
.article-art-index { opacity: .1; font-size: 130px; }
.article-art small { color: #536673; font-size: 10px; }
.home-articles-carousel { --article-gap: 22px; }

/* Tools and tangible outputs approved by the client. */
.executive-tools { background: var(--navy); color: #fff; scroll-margin-top: 100px; }
.executive-tools .section { padding-block: 65px; }
.executive-tools h2,.executive-deliverables h2 { font-size: clamp(30px,3vw,42px); line-height: 1.35; }
.tools-intro { color: #c6d5da; max-width: 720px; margin-top: 17px; font-size: 18px; line-height: 1.9; }
.executive-tools-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 28px; margin-top: 35px; }
.executive-tool-card { padding: 25px 0 0; background: transparent; border: 0; border-top: 1px solid #ffffff35; border-radius: 0; }
.tool-illustration { width: 100%; max-width: 190px; height: 110px; margin: 0 auto 22px; display: block; fill: none; stroke: #d7e4e7; stroke-width: 2; stroke-linecap: round; }
.tool-illustration-0 rect { fill: #ffffff05; stroke: #ffffff15; }
.tool-projection { stroke-dasharray: 4 5; stroke: #91b7c2; }
.tool-illustration .tool-bar { fill: #d7e4e7; stroke: none; }
.tool-illustration .tool-bar.accent { fill: #739cac; }
.tool-illustration-3 path { stroke-width: 4; }
.executive-tool-card h3 { font-size: 23px; line-height: 1.5; margin-bottom: 15px; }
.executive-tool-card p { color: #c5d3d9; font-size: 16px; line-height: 1.9; }
.executive-deliverables { background: #f3eee6; scroll-margin-top: 100px; }
.executive-deliverables .section { padding-block: 65px; }
.deliverables-intro { font-size: 18px; line-height: 1.9; max-width: 700px; margin-top: 17px; }
.deliverables-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 15px; list-style: none; margin-top: 30px; padding: 0; }
.deliverables-grid li { display: flex; align-items: center; gap: 15px; padding: 18px 0; min-height: 80px; background: transparent; border: 0; border-top: 1px solid #d9d2c6; border-radius: 0; }
.deliverables-grid li>span { display: grid; place-items: center; flex-shrink: 0; width: 34px; height: 34px; border-radius: 5px; background: var(--navy); color: #e1cba7; font: 12px 'Overpass',sans-serif; }
.deliverables-grid h3 { font-size: 18px; font-weight: 500; line-height: 1.6; }
@media(max-width:1000px) { .executive-tools-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } .deliverables-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:700px) { .executive-tools .section,.executive-deliverables .section { padding-block: 45px; } .executive-tools-grid { grid-template-columns: 1fr; gap: 14px; margin-top: 25px; } .executive-tool-card { padding: 25px 0 8px; } .executive-tool-card h3 { font-size: 24px; } .tool-illustration { margin-inline: 0; height: 90px; margin-bottom: 15px; } .deliverables-grid { grid-template-columns: 1fr; gap: 10px; } .deliverables-grid li { min-height: 76px; } .tools-intro,.deliverables-intro { font-size: 17px; } }

/* Company framework: a separate map, followed by the engagement stages. */
.business-map { background: #eee8dc; border-block: 1px solid #e0d8c8; scroll-margin-top: 100px; }
.business-map>.section { padding-block: 55px; }
.map-heading { display: flex; justify-content: space-between; align-items: center; gap: 25px; }
.map-heading h2 { font-size: clamp(30px,3vw,42px); line-height: 1.35; }
.map-heading p { font-size: 19px; margin-top: 12px; }
.map-model-label { font-size: 12px; color: #725d3e; border: 1px solid #c8b99f; padding: 7px 13px; border-radius: 30px; white-space: nowrap; }
.map-canvas { position: relative; margin-top: 35px; }
.map-route { position: absolute; inset: 0; width: 100%; height: 180px; pointer-events: none; }
.map-route path { fill: none; stroke: #bba580; stroke-width: 2; vector-effect: non-scaling-stroke; }
.map-stations { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); min-height: 180px; position: relative; }
.map-stations button { display: flex; flex-direction: column; align-items: center; gap: 15px; align-self: start; padding: 0 5px; border: 0; background: none; color: var(--navy); }
.map-stations button:nth-child(even) { margin-top: 48px; }
.map-node { display: grid; place-items: center; width: 56px; height: 56px; border: 1px solid #bba580; border-radius: 50%; background: #f9f7f0; font: 16px 'Overpass',sans-serif; color: #77613f; transition: background .2s,color .2s; }
.map-stations strong { font-weight: 500; font-size: 16px; line-height: 1.45; max-width: 130px; }
.map-stations [aria-selected=true] .map-node { background: var(--navy); color: #e1caa4; border-color: var(--navy); box-shadow: 0 0 0 5px #102b3b0b; }
.map-stations button:hover .map-node { border-color: var(--navy); }
.map-stations button:focus-visible { outline: 2px solid var(--teal); outline-offset: 7px; border-radius: 5px; }
.map-foundations { display: grid; grid-template-columns: repeat(3,1fr); gap: 15px; margin-bottom: 20px; }
.map-foundations>span { display: flex; align-items: center; justify-content: center; gap: 10px; padding: 14px; border: 1px solid #d5ccbb; border-radius: 7px; font-size: 15px; }
.map-foundations i { width: 5px; height: 5px; background: #9b805a; transform: rotate(45deg); }
.map-panel { display: grid; grid-template-columns: minmax(150px,.65fr) 1.4fr auto; align-items: center; gap: 35px; padding: 25px 30px; background: var(--paper); border: 1px solid #e0d8c8; border-radius: 10px; min-height: 145px; }
.map-current { font-size: 12px; color: #886e47; }
.map-panel h3 { font-size: 25px; line-height: 1.4; margin-top: 5px; }
.map-panel p { font-size: 16px; line-height: 1.9; }
.map-panel a { font-size: 14px; white-space: nowrap; }
@media(max-width:1000px) { .map-panel { grid-template-columns: .65fr 1.4fr; gap: 15px 25px; } .map-panel a { grid-column: 2; justify-self: start; } .map-stations strong { font-size: 14px; } }
@media(max-width:700px) {
 .map-heading { align-items: flex-start; flex-direction: column; gap: 15px; } .map-heading h2 { font-size: 32px; } .map-heading p { font-size: 17px; }
 .business-map>.section { padding-block: 40px; } .map-canvas { margin-top: 25px; } .map-route { display: none; }
 .map-stations { display: flex; flex-direction: column; gap: 0; min-height: 0; margin-bottom: 25px; }
 .map-stations::before { content: ''; position: absolute; inset-inline-start: 22px; top: 20px; bottom: 20px; border-inline-start: 1px solid #bba580; }
 .map-stations button,.map-stations button:nth-child(even) { flex-direction: row; align-self: stretch; margin: 0; gap: 18px; padding: 9px 0; text-align: start; position: relative; }
 .map-node { width: 46px; height: 46px; flex-shrink: 0; font-size: 14px; } .map-stations strong { font-size: 19px; max-width: none; }
 .map-foundations { gap: 8px; } .map-foundations>span { font-size: 12px; line-height: 1.6; padding: 12px 8px; text-align: center; flex-direction: column; gap: 6px; }
 .map-panel { grid-template-columns: 1fr; padding: 22px; gap: 15px; min-height: 0; } .map-panel a { grid-column: 1; } .map-panel h3 { font-size: 25px; }
}

/* Seven original stages, presented as an interactive route. */
.work-journey { background: var(--navy); color: #fff; }
.work-journey .eyebrow { color: var(--gold-light); }
.journey-tabs { position: relative; display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 14px; margin: 40px 0 28px; }
.journey-tabs::before { content: ''; position: absolute; inset-inline: 6%; top: 25px; height: 1px; background: #b69a7260; }
.journey-tabs button { position: relative; display: flex; flex-direction: column; align-items: center; gap: 15px; padding: 0 5px; border: 0; background: none; color: #ced9dd; }
.journey-tabs button>span { display: grid; place-items: center; width: 52px; height: 52px; background: var(--navy); border: 1px solid #829aa0; border-radius: 50%; font: 15px 'Overpass',sans-serif; color: var(--gold-light); transition: background .2s,color .2s; }
.journey-tabs strong { font-size: 16px; font-weight: 500; line-height: 1.5; }
.journey-tabs [aria-selected=true]>span { background: var(--gold-light); border-color: var(--gold-light); color: var(--navy); }
.journey-tabs [aria-selected=true] strong { color: #fff; }
.journey-detail { display: grid; grid-template-columns: auto 1fr auto; gap: 25px; align-items: center; background: var(--paper); color: var(--navy); padding: 25px 30px; border-radius: 9px; min-height: 140px; }
.journey-number { font: 45px 'Overpass',sans-serif; color: #a28a65; }
.journey-detail h3 { font-size: 24px; margin-bottom: 8px; }
.journey-detail p { font-size: 17px; }
.journey-detail .read-link { white-space: nowrap; }
.journey-note { color: #c1cfd4; font-size: 15px; margin-top: 22px; }

/* Inner pages and contact share the same palette. */
/* Shared page titles follow the same reading direction as the body. */
.page-intro { background: var(--paper); padding: 34px 5.5% 36px; border: 0; border-bottom: 1px solid var(--line); }
.page-intro-inner { max-width: 1200px; }
.page-intro .breadcrumbs { margin-bottom: 24px; }
.page-intro-content { display: block; }
.page-intro-content h1,html[lang=en] .page-intro-content h1 { max-width: 28ch; font-size: clamp(34px,3.5vw,49px); line-height: 1.35; letter-spacing: 0; text-wrap: pretty; }
.page-intro-content p { max-width: 820px; margin-top: 17px; padding: 0; border: 0; font-size: 20px; line-height: 1.85; text-wrap: pretty; }
.outputs { background: transparent; padding: 0; padding-inline-start: 28px; border-inline-start: 1px solid var(--line); }
.breadcrumbs { color: #66747a; }
.detail-list,.article-body,.legal-body { color: var(--navy); }
.detail-index-grid .index-card,.index-card { border-radius: 10px; }
.sticky-index>a { border-color: var(--line); }
.method-steps li>span { background: var(--paper); border-color: var(--gold); color: #7f6847; }
.article-header { background: var(--soft); }
.takeaways,.article-conversion { background: var(--soft); border-color: #ded7c9; border-radius: 0; }
.article-filters button { border-radius: 6px; }
.contact-page { background: var(--paper); }
.contact-welcome .eyebrow { color: #8b714b; }
.contact-welcome h1 { font-size: clamp(38px,4vw,54px); }
.contact-lead { font-size: 25px; }
.contact-form-panel .lead-form { background: #fff; border-color: #e4e2da; box-shadow: 0 14px 45px #102b3b05; }
.contact-form-panel input,.contact-form-panel select,.contact-form-panel textarea { background: #fcfcfa; border-color: #d9dfdc; }
.contact-form-panel input:focus,.contact-form-panel textarea:focus,.contact-form-panel select:focus { border-color: var(--teal); }
.contact-strip { background: #eee7d9; border: 0; }
.contact-strip-inner { max-width: 1200px; padding-block: 42px; }
.contact-strip h2 { font-size: 31px; }
.contact-strip .outline-button { border-color: #8c9d9f; }
.site-footer { background: #0b2230; }
.footer-bottom { border-color: #ffffff20; }
.quiet-whatsapp { background: #fff; color: #28665e; border-color: #bfcfca; box-shadow: 0 4px 18px #102b3b14; }

@media(min-width:1301px) and (max-width:1390px) { .section,.hero-bottom { margin-inline: 5.5%; } }
@media(max-width:1200px) { .hero-inner { gap: 36px; } .site-header nav { gap: 14px; font-size: 14px; } .site-header { gap: 18px; } .hero-visual { height: 430px; } .journey-tabs strong { font-size: 14px; } }
@media(max-width:1100px) { .site-header>nav { display: none; } .menu-toggle { display: block; } .hero h1 { font-size: 46px; } .hero-copy>p { font-size: 17px; } .hero-inner { gap: 30px; } .hero .discovery-actions { flex-direction: column; align-items: stretch; } .hero-credentials { grid-template-columns: 1fr; } .journey-detail { grid-template-columns: auto 1fr; } .journey-detail>.read-link { grid-column: 2; justify-self: start; } }
@media(max-width:800px) { .hero-inner { grid-template-columns: 1fr; padding: 44px 6%; } .hero-copy>p { max-width: 650px; } .hero .discovery-actions { flex-direction: row; } .hero-credentials { grid-template-columns: 1fr 1fr; max-width: none; } .hero-visual { height: 380px; } .hero-bottom { margin-inline: 6%; } .section { padding-block: 60px; } .founder-section { gap: 35px; } .journey-tabs { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 22px 12px; } .journey-tabs::before { display: none; } .journey-tabs strong { font-size: 15px; } .why-section { gap: 35px; } }
@media(max-width:700px) {
  .site-header { height: 78px; padding-inline: 6%; } .site-header .brand { width: 120px; } .site-header .brand img { height: 70px; } .mobile-menu { top: 78px; }
  .hero h1,html[lang=en] .hero h1 { font-size: 39px; line-height: 1.3; } html[lang=en] .hero h1 em { font-size: inherit; }
  .hero-inner { padding: 34px 6% 26px; gap: 28px; min-height: 0; } .hero-copy .eyebrow { font-size: 11px; }
  .hero-visual { height: 315px; border-radius: 32px 6px 6px; } .visual-label { font-size: 9px; top: 20px; left: 22px; }
  .path-card { left: 15px; right: 15px; padding: 17px 18px; bottom: 38px; } .path-card strong { font-size: 21px; }
  .hero-credentials li { font-size: 12px; } .hero-credentials { padding-top: 18px; margin-top: 21px; gap: 10px; }
  .hero-actions .button { font-size: 15px; } .hero .discovery-actions { display: grid; grid-template-columns: 1fr; width: 100%; }
  .hero-bottom { font-size: 9px; gap: 18px; } .hero-bottom span:last-child { max-width: 150px; }
  .clients-section { padding-block: 20px 16px; } .clients-heading>div { display: flex; gap: 17px; } .clients-heading .eyebrow { margin: 0; } .clients-heading h2 { font-size: 17px; }
  .client-logo { height: 78px; border: 0; } .section-heading h2 { font-size: 32px; } .section-heading>p { font-size: 16px; margin-top: 16px; }
  .needs-grid { grid-template-columns: 1fr; gap: 12px; } .need-item { padding: 22px 0 42px; } .need-top { margin-bottom: 16px; } .need-item h3 { font-size: 23px; }
  .cfo-comparison { padding: 0 0 26px; } .cfo-options>div+div { border-top-color: var(--line); } .service-card { padding: 24px 0 28px; } .service-card h2,.service-card h3 { font-size: 23px; }
  .journey-tabs { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; margin-top: 28px; }
  .journey-tabs button { flex-direction: row; text-align: start; gap: 10px; align-items: center; padding: 0; } .journey-tabs button>span { width: 39px; height: 39px; flex-shrink: 0; font-size: 12px; } .journey-tabs strong { font-size: 14px; }
  .journey-detail { padding: 22px; gap: 12px 18px; } .journey-number { font-size: 32px; } .journey-detail h3 { font-size: 22px; } .journey-detail p { font-size: 16px; } .journey-detail>.read-link { grid-column: 1/-1; } .journey-note { font-size: 14px; }
  .founder-photo { border-radius: 28px 7px 7px; } .founder-section p { font-size: 17px; } .article-art { height: 160px; } .article-card h3 { font-size: 23px; } .article-card>.article-meta,.article-card>h3,.article-card>p,.article-card>.read-link { margin-inline: 0; }
  .contact-strip h2 { font-size: 28px; } .contact-strip-inner { padding-block: 32px; } .contact-lead { font-size: 23px; } .contact-welcome h1 { font-size: 37px; }
}

/* Fractional CFO: owner-supplied service details, within the existing page system. */
.fractional-content { padding: 0; }
.fractional-content>.soft-section { background: transparent; }
.fractional-content h2 { font-size: clamp(28px,2.6vw,35px); line-height: 1.45; }
.fractional-content h3 { font-size: 23px; line-height: 1.5; }
.fractional-lead { padding-block: 28px 50px; }
.fractional-lead>p { max-width: 950px; font-size: 20px; line-height: 1.9; margin-bottom: 24px; }
.fractional-fit,.fractional-outputs { display: grid; grid-template-columns: 1fr; gap: 26px; align-items: start; border-top: 1px solid var(--line); padding-block: 55px; }
.fractional-fit>div>p { margin-top: 12px; font-size: 18px; line-height: 1.85; }
.fractional-fit>div>.eyebrow,.fractional-outputs>div>.eyebrow { margin-bottom: 12px; }
.fractional-content .fractional-checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 36px; }
.fractional-content .fractional-checklist li { position: relative; margin: 0; padding: 19px 0; padding-inline-start: 28px; border-top: 1px solid var(--line); font-size: 18px; line-height: 1.85; color: #4f616c; }
.fractional-content .fractional-checklist li:last-child { grid-column: 1 / -1; }
.fractional-content .fractional-checklist li::before { content: '✓'; position: absolute; inset-inline-start: 0; top: 19px; width: auto; height: auto; border: 0; transform: none; color: var(--teal); }
.fractional-scope { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 27px; margin-top: 35px; }
.fractional-scope article { border-top: 1px solid #d6dcd8; padding-top: 20px; }
.fractional-scope .mini-index { color: #8b714a; }
.fractional-scope h3 { margin-block: 13px 12px; }
.fractional-scope p { font-size: 17px; line-height: 1.9; }
.fractional-packages { background: #f4f1e9; scroll-margin-top: 100px; }
.fractional-packages-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin-top: 30px; border-block: 1px solid #d9d1c2; }
.fractional-package { background: transparent; border: 0; border-radius: 0; padding: 30px; display: flex; flex-direction: column; }
.fractional-package+.fractional-package { border-inline-start: 1px solid #d9d1c2; }
.fractional-package h3 { font-size: 28px; }
.package-days { color: #687a83; font-size: 16px; margin-top: 10px; }
.fractional-package .package-price { color: var(--navy); font: 38px 'Overpass','Tajawal',sans-serif; padding-block: 25px; margin-top: 0; border-bottom: 1px solid #dedfd8; }
.package-price span { display: block; font: 15px 'Tajawal',sans-serif; color: #64737c; margin-top: 5px; }
html[lang=en] .package-price span { font-family: 'Overpass',sans-serif; }
.fractional-package .package-fit { font-size: 17px; line-height: 1.9; margin-block: 22px; flex: 1; }
.fractional-package .read-link { align-self: flex-start; font-size: 15px; }
.fractional-terms { font-size: 16px; line-height: 1.9; margin-top: 25px; max-width: 940px; }
.fractional-first90 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 35px; list-style: none; margin-top: 35px; padding: 0; }
.fractional-first90 li { margin: 0; border-top: 1px solid #d5c8b1; padding: 22px 0 0; }
.fractional-first90 li::before { content: none; }
.fractional-first90 li>span { font: 30px 'Overpass',sans-serif; color: #9a825c; }
.fractional-first90 h3 { margin-block: 18px 12px; }
.fractional-first90 p { font-size: 17px; line-height: 1.9; }
.fractional-comparison { margin-top: 30px; }
.fractional-comparison table { border-collapse: collapse; width: 100%; table-layout: fixed; background: #fff; }
.fractional-comparison th,.fractional-comparison td { border: 0; border-bottom: 1px solid #dce0da; text-align: start; padding: 22px; font-size: 17px; line-height: 1.9; vertical-align: top; }
.fractional-comparison thead th { background: var(--navy); color: #fff; font-size: 19px; font-weight: 500; }
.fractional-comparison thead th:first-child { width: 19%; }
.fractional-comparison tbody th { background: var(--paper); font-weight: 500; }
.fractional-comparison td:last-child { background: #f0f4f0; }
.fractional-next { background: var(--navy); color: #fff; }
.fractional-next>.section { display: grid; grid-template-columns: 1fr auto; gap: 40px; align-items: center; padding-block: 50px; }
.fractional-next p { color: #cad7dc; font-size: 20px; max-width: 750px; line-height: 1.9; margin-top: 15px; }
.fractional-next .light-button { color: var(--navy); background: var(--gold-light); border-color: var(--gold-light); }
@media(max-width:900px) { .fractional-fit,.fractional-outputs { grid-template-columns: 1fr; gap: 30px; } .fractional-scope { grid-template-columns: repeat(2,minmax(0,1fr)); } .fractional-package { padding: 23px; } .fractional-next>.section { grid-template-columns: 1fr; gap: 25px; } .fractional-next .button { justify-self: start; } }
@media(max-width:700px) {
 .fractional-lead { padding-block: 30px 40px; } .fractional-lead>p { font-size: 19px; }
 .fractional-content h2 { font-size: 31px; } .fractional-scope,.fractional-packages-grid,.fractional-first90 { grid-template-columns: 1fr; }
 .fractional-packages-grid { gap: 0; } .fractional-package { padding: 26px 0; } .fractional-package+.fractional-package { border-inline-start: 0; border-top: 1px solid #d9d1c2; } .fractional-package .package-price { font-size: 37px; padding-block: 20px; }
 .fractional-first90 { gap: 25px; } .fractional-first90 li { display: grid; grid-template-columns: auto 1fr; gap: 18px; } .fractional-first90 h3 { margin-top: 0; }
 .fractional-comparison th,.fractional-comparison td { padding: 10px 7px; font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
 .fractional-comparison thead th { font-size: 14px; } .fractional-comparison thead th:first-child { width: 22%; } .fractional-next p { font-size: 18px; }
}

/* Compact shared introductions and single-column content on small screens. */
@media(max-width:700px) {
 .page-intro { padding: 25px 6% 30px; }
 .page-intro .breadcrumbs { margin-bottom: 22px; }
 .page-intro-content h1,html[lang=en] .page-intro-content h1 { font-size: 34px; line-height: 1.4; }
 .page-intro-content p { margin-top: 14px; font-size: 18px; line-height: 1.85; }
 .outputs { padding: 24px 0 0; border-inline-start: 0; border-top: 1px solid var(--line); }
 .fractional-fit,.fractional-outputs { padding-block: 40px; gap: 22px; }
 .fractional-content .fractional-checklist { grid-template-columns: 1fr; }
 .fractional-content .fractional-checklist li { font-size: 17px; }
 .fractional-content h2 { font-size: 29px; }
}
