/* ===========================================================================
 *  TechAmerica (techamerica.ai) - company page sections
 *
 *  Designed and developed by OASIS
 *    Web      https://oasis.ind.in
 *    Email    info@oasis.ind.in
 *  (c) 2026 OASIS. All rights reserved.
 * ===========================================================================
 *  Styles for the section plugins an editor places on About-style pages
 *  (Admin > Pages > Add Plugin):
 *
 *    1401_page_opening   black opening panel: breadcrumb, h1, lede
 *    1402_split_intro    heading left, lead + body copy right ("Who We Are")
 *    1403_topic_index    linked list of sections/categories ("What We Cover")
 *    1404_principles     side heading + grid of principles ("How We Report")
 *    1405_social_connect company social links from Website Settings
 *    1406_big_cta        large display link ("Contact the newsroom")
 *
 *  Loaded on page-manager pages only (ThemeLayoutClass::PageStyles). Every
 *  class is prefixed cp- so nothing here can collide with home.css, which
 *  already uses .who, .cta, .lead and .see-more for the homepage.
 *  Colours come from the theme tokens, so the sections follow light/dark.
 * ======================================================================== */

.cp-sec{padding-block:96px;background:var(--bg);color:var(--fg)}
.cp-sec.cp-tone-tint{background:var(--sunken)}
.cp-sec.cp-tone-dark{background:#000;color:#fff;--fg:#fff;--fg2:#c7c7cc;--muted:#a1a1a6;--bg:#000;--line-strong:#48484f;--sunken:#1d1d1f}

.cp-h2,.cp-display{font-family:"Figtree",var(--font-display);font-weight:900;letter-spacing:-.034em;line-height:1;text-wrap:balance}
.cp-h2{font-size:clamp(2.25rem,1.5rem + 3vw,4rem)}
.cp-eyebrow,.cp-kick{display:block;font-size:var(--tc-13,.8125rem);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.cp-eyebrow{margin-bottom:14px}
.cp-body{font-size:var(--tc-19,1.1875rem);line-height:1.65;color:var(--fg2);max-width:62ch}
.cp-rich>*:first-child{margin-top:0}
.cp-rich>*:last-child{margin-bottom:0}
.cp-rich p{margin:0}
.cp-rich p+p,.cp-rich p+ul,.cp-rich ul+p{margin-top:1em}
.cp-rich ul,.cp-rich ol{margin:0;padding-left:1.2em}
.cp-rich a,.cp-link{color:var(--fg);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.cp-rich a:hover,.cp-link:hover{text-decoration-thickness:2px}
.cp-note{font-size:var(--tc-15,.9375rem);color:var(--muted);line-height:1.5}
.cp-arw{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;transition:transform .2s}

/* Outline pill button (black outline; home.css's .see-more is green) */
.cp-more{display:inline-flex;align-items:center;justify-content:center;gap:9px;height:64px;padding:0 26px;border:2px solid currentColor;border-radius:999px;color:var(--fg);font-size:19px;font-weight:500;line-height:1;white-space:nowrap;flex:none;transition:background-color .15s,color .15s}
.cp-more:hover{background:var(--fg);color:var(--bg)}
.cp-more:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.cp-more .cp-arw{width:18px;height:18px;stroke-width:1.8}

/* ---- 1401 Opening panel (continues the black header) ---- */
.cp-open{background:#000;color:#fff;padding-block:20px 72px}
.cp-open .crumbs{color:#a1a1a6;margin:0;padding-top:0}
.cp-open .crumbs a{color:#d2d2d7;min-height:44px;padding-inline:4px;margin-inline:-4px}
.cp-open .crumbs a:hover{color:#fff}
.cp-open :focus-visible{outline-color:#fff}
.cp-open-body{margin-top:36px}
.cp-open .cp-eyebrow{color:#a1a1a6}
.cp-open h1{font-family:"Figtree",var(--font-display);font-weight:900;font-size:clamp(3.25rem,1.6rem + 6.4vw,7.5rem);line-height:.95;letter-spacing:-.036em;text-wrap:balance;color:#fff;margin:0}
.cp-open .cp-lede{margin-top:28px;font-size:clamp(1.375rem,1.1rem + 1.1vw,2rem);line-height:1.3;font-weight:500;letter-spacing:-.01em;max-width:24ch;color:#fff}
.cp-open .cp-sub{margin-top:16px;font-size:var(--tc-19,1.1875rem);line-height:1.5;color:#c7c7cc;max-width:46ch}

/* ---- 1402 Split intro ---- */
.cp-split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:40px 72px;align-items:start}
.cp-split .cp-h2{font-size:clamp(2.25rem,1.4rem + 2.8vw,3.5rem);max-width:13ch;margin-top:12px}
.cp-split .cp-lead{font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);line-height:1.35;font-weight:500;letter-spacing:-.02em;color:var(--fg);max-width:30ch}
.cp-split .cp-lead+.cp-body{margin-top:24px}
.cp-split .cp-rich p+p{margin-top:18px}
.cp-split .cp-more{margin-top:32px}

/* ---- 1403 Topic index ---- */
.cp-ix-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px 40px}
.cp-ix-head .cp-intro{margin-top:16px;font-size:var(--tc-19,1.1875rem);line-height:1.5;color:var(--fg2);max-width:46ch}
.cp-ix-list{list-style:none;margin:48px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:48px;border-top:2px solid var(--fg)}
.cp-ix-list li{border-bottom:1px solid var(--line-strong)}
.cp-ix{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 16px;align-items:center;padding:24px 0 22px;min-height:44px;color:var(--fg)}
.cp-ix-name{font-size:clamp(1.25rem,1.1rem + .6vi,1.5rem);font-weight:700;line-height:1.2;letter-spacing:-.4px}
.cp-ix .cp-arw{grid-column:2;grid-row:1}
.cp-ix-desc{grid-column:1/-1;font-size:var(--tc-16,1rem);line-height:1.5;color:var(--fg2);max-width:36ch}
a.cp-ix:hover .cp-ix-name{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px}
a.cp-ix:hover .cp-arw{transform:translateX(4px)}
a.cp-ix:focus-visible{outline:2px solid var(--fg);outline-offset:4px;border-radius:2px}

/* ---- 1404 Principles ---- */
.cp-approach{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:40px 72px;align-items:start}
.cp-approach-side{position:sticky;top:104px}
.cp-approach-side .cp-body,.cp-approach-side .cp-note{margin-top:16px}
.cp-princ{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
.cp-princ h3{font-size:clamp(1.375rem,1.2rem + .7vi,1.75rem);line-height:1.2;font-weight:700;letter-spacing:-.5px}
.cp-princ p{margin-top:10px;font-size:var(--tc-19,1.1875rem);line-height:1.6;color:var(--fg2)}
.cp-princ .cp-princ-foot{grid-column:1/-1;font-size:var(--tc-19,1.1875rem);line-height:1.6;color:var(--fg2)}
.cp-princ-foot p{margin:0}
.cp-princ-foot a{padding-block:11px}

/* ---- 1405 Social connect ---- */
.cp-connect{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px 72px;align-items:center}
.cp-connect .cp-intro{margin-top:14px;font-size:var(--tc-19,1.1875rem);line-height:1.5;color:var(--fg2);max-width:40ch}
.cp-spills{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.cp-spill{display:flex;align-items:center;gap:12px;min-height:56px;padding:0 18px;border:1px solid var(--line-strong);border-radius:4px;background:var(--bg);font-size:var(--tc-16,1rem);font-weight:600;color:var(--fg);transition:border-color .15s,background-color .15s,color .15s}
.cp-spill svg{width:20px;height:20px;flex:none;fill:currentColor}
.cp-spill:hover{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.cp-spill:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.cp-spills.cp-icons{display:flex;flex-wrap:wrap;gap:10px}
.cp-spills.cp-icons .cp-spill{width:56px;justify-content:center;padding:0;border-radius:999px}
.cp-connect .cp-note{margin-top:14px}

/* ---- 1406 Big CTA ---- */
.cp-cta{padding-block:88px 96px}
.cp-cta .cp-kick{color:var(--muted)}
.cp-cta-link{display:inline-block;margin-top:14px;color:var(--fg)}
.cp-cta .cp-display{font-size:clamp(2.5rem,1.5rem + 4.4vw,5.5rem);line-height:.95;letter-spacing:-.036em}
.cp-cta .cp-nw{white-space:nowrap}
.cp-cta .cp-arw{width:clamp(28px,1.5rem + 1.6vw,56px);height:clamp(28px,1.5rem + 1.6vw,56px);stroke-width:2.2;vertical-align:middle;margin-left:.1em}
.cp-cta-link:hover .cp-display{text-decoration:underline;text-decoration-thickness:4px;text-underline-offset:8px;text-decoration-skip-ink:auto}
.cp-cta-link:hover .cp-arw{transform:translateX(8px)}
.cp-cta-link:focus-visible{outline:2px solid var(--fg);outline-offset:6px}
.cp-cta .cp-intro{margin-top:18px;font-size:var(--tc-19,1.1875rem);line-height:1.5;color:var(--fg2);max-width:52ch}

/* ---- Responsive ---- */
@media (max-width:1180px){.cp-ix-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1023px){
  .cp-sec{padding-block:72px}
  .cp-split,.cp-approach,.cp-connect{grid-template-columns:minmax(0,1fr)}
  .cp-approach-side{position:static}
}
@media (max-width:760px){
  .cp-open{padding-block:16px 48px}
  .cp-open-body{margin-top:24px}
  .cp-sec{padding-block:56px}
  .cp-more{height:52px;padding:0 22px;font-size:17px}
  .cp-ix-list{grid-template-columns:minmax(0,1fr);margin-top:32px}
  .cp-ix{padding:20px 0 18px}
  .cp-princ{grid-template-columns:minmax(0,1fr);gap:32px}
  .cp-spills{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-spill{min-height:52px;padding:0 14px}
  .cp-cta{padding-block:64px 72px}
}
@media (prefers-reduced-motion:reduce){.cp-arw,.cp-more,.cp-spill{transition:none}}