/*
Theme Name: JCBO Global English Classic
Theme URI: https://en.jcbo.org/
Author: JCBO
Description: Standalone classic WordPress theme for JCBO English. Full-width homepage, approved JCBO hero, business navigation and article cards.
Version: 1.1.1
Text Domain: jcbo-global-en
*/
:root{--navy:#071b36;--blue:#0c5da5;--blue2:#083e78;--gold:#d79b32;--pale:#f3f7fb;--ink:#0b1b2d;--muted:#60758b;--line:#dce6ef;--max:1500px}
*{box-sizing:border-box}html,body{margin:0;width:100%;max-width:none;overflow-x:hidden}body{font-family:Arial,"Helvetica Neue",sans-serif;color:var(--ink);background:#fff;line-height:1.7}a{text-decoration:none;color:inherit}img{max-width:100%;height:auto}
.jtop{background:#061a33;color:#d9e7f4;padding:7px max(24px,calc((100vw - var(--max))/2));font-size:12px;display:flex;justify-content:space-between}
.jhead{width:100%;height:82px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - var(--max))/2));position:sticky;top:0;z-index:999}.admin-bar .jhead{top:32px}
.brand{display:flex;align-items:center;gap:12px}.mark{background:linear-gradient(135deg,#0b4d8b,#1679d2);color:#fff;border-radius:9px;padding:9px 12px;font-size:22px;font-weight:900}.brand b{display:block;font-size:15px}.brand small{display:block;color:#6c7f92;font-size:11px}
.nav{display:flex;align-items:center;gap:19px;font-size:13px;font-weight:750}.nav a:hover{color:var(--blue)}.langs{border:1px solid var(--line);padding:6px 10px;border-radius:22px}.toggle{display:none;background:none;border:0;font-size:25px}
.hero-image{width:100%;background:#1295dc;overflow:hidden}.hero-image img{display:block;width:100%;height:auto;max-width:none}
.intro{width:100%;text-align:center;padding:54px max(25px,calc((100vw - var(--max))/2)) 61px;background:linear-gradient(#fff,#f5f9fd)}.eyebrow{color:#b77c21;font-size:12px;font-weight:850;letter-spacing:.17em}.intro h1{max-width:1100px;margin:9px auto 18px;font-size:clamp(40px,5vw,68px);line-height:1.08;color:var(--blue2)}.intro p{max-width:930px;margin:auto;color:#4d6276;font-size:19px}.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:26px}.btn{background:var(--blue);color:#fff;padding:13px 20px;border-radius:7px;font-weight:800}.btn.gold{background:var(--gold);color:#071b36}.btn.white{background:#fff;color:var(--blue2);border:1px solid #bcd0e2}
.quick{max-width:var(--max);width:calc(100% - 48px);margin:0 auto 20px;display:grid;grid-template-columns:repeat(6,1fr);background:#fff;border:1px solid var(--line);box-shadow:0 13px 35px #12395a15;border-radius:12px;overflow:hidden}.quick a{padding:19px 10px;text-align:center;border-right:1px solid var(--line)}.quick b{display:block;color:var(--blue2);font-size:14px}.quick span{font-size:11px;color:#718397}
.section{width:100%;padding:76px max(28px,calc((100vw - var(--max))/2))}.soft{background:var(--pale)}.shead{text-align:center;max-width:830px;margin:0 auto 37px}.shead h2{font-size:39px;line-height:1.15;color:var(--blue2);margin:7px 0}.shead p{color:var(--muted)}
.grid,.posts{display:grid;grid-template-columns:repeat(3,1fr);gap:21px}.card,.postcard{background:#fff;border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 10px 28px #163d5c10}.card .visual{height:205px;background:linear-gradient(135deg,#0a3e73,#1285d2);display:flex;align-items:center;justify-content:center;color:#fff;font-size:29px;font-weight:850;text-align:center;padding:20px}.cardbody,.postbody{padding:21px}.card h3{font-size:23px;margin:0 0 8px}.card p,.postbody p{color:var(--muted)}.more{color:var(--blue);font-weight:800;font-size:13px}
.network{background:#061b36;color:#fff;display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}.network h2{font-size:44px;line-height:1.15}.network p{color:#c9dbee}.network img{width:100%;border-radius:20px}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:25px}.stats div{border:1px solid #ffffff25;padding:16px;border-radius:9px}.stats b{display:block;font-size:20px}.stats span{font-size:10px;color:#b3c9dd}
.cover{aspect-ratio:16/9;background:linear-gradient(135deg,#07396d,#0b5b9d);color:#fff;padding:22px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}.cover:after{content:"JCBO";position:absolute;right:-8px;bottom:-33px;font-size:92px;font-weight:900;color:#fff1}.cover small,.cover strong,.cover span{position:relative;z-index:2}.cover small{color:#ffc65a;font-weight:800}.cover strong{font-size:25px;line-height:1.28}.cover span{font-size:10px;letter-spacing:.15em}.postbody h3{font-size:18px;line-height:1.4;margin:0 0 8px}
.pagehero{background:linear-gradient(120deg,#071b36,#0d477f);color:#fff;padding:75px max(25px,calc((100vw - var(--max))/2));min-height:330px;display:flex;align-items:center}.pagehero h1{font-size:clamp(39px,5vw,65px);line-height:1.1;margin:7px 0}.crumb{max-width:var(--max);margin:auto;padding:16px 24px;color:#73879a;font-size:12px}.content{max-width:1120px;margin:auto;padding:55px 24px}.content h1{font-size:43px;color:var(--blue2)}.content h2{font-size:29px;color:#17436d;margin-top:38px}.content p,.content li{font-size:17px;line-height:1.9;color:#40586d}
.footer{background:#05152b;color:#d7e4f1;padding:52px max(28px,calc((100vw - var(--max))/2)) 20px}.fgrid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}.footer a{display:block;color:#b9cee2;margin:6px 0}.copy{border-top:1px solid #ffffff22;margin-top:28px;padding-top:17px;font-size:11px;color:#8da5bc}
@media(min-width:1450px){.grid,.posts{grid-template-columns:repeat(4,1fr)}}
@media(max-width:1000px){.nav{display:none}.toggle{display:block}.jhead.open .nav{display:flex;position:absolute;left:0;right:0;top:82px;background:#fff;padding:24px;flex-direction:column;box-shadow:0 12px 30px #0002}.quick{grid-template-columns:repeat(3,1fr);width:100%;border-radius:0}.grid,.posts{grid-template-columns:repeat(2,1fr)}.network{grid-template-columns:1fr}.fgrid{grid-template-columns:1fr 1fr}}
@media(max-width:700px){.jtop{display:none}.admin-bar .jhead{top:46px}.brand small{display:none}.brand b{font-size:12px}.intro{padding:35px 20px 42px}.intro h1{font-size:37px}.intro p{font-size:16px}.quick{grid-template-columns:repeat(2,1fr)}.grid,.posts{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}.fgrid{grid-template-columns:1fr}}


/* =========================================================
   JCBO Global English Classic v1.1.0
   TRUE FULL-WIDTH / 100VW OVERRIDES
   ========================================================= */

/* Kill every inherited WordPress/container max-width */
html,body,
body.custom-background,
#page,.site,.site-content,#content,#primary,#main,
.content-area,.site-main,.entry-content,.hentry,
main,header,footer{
  width:100%!important;
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* Remove legacy outer wrappers/paddings if WP/plugins add them */
body>#page,
body>.site,
.site-content,
.content-area,
.site-main,
.entry-content{
  padding-left:0!important;
  padding-right:0!important;
  border:0!important;
  box-shadow:none!important;
}

/* Every visual section spans the browser viewport */
.jtop,
.jhead,
.hero-image,
.intro,
.section,
.network,
.footer,
.pagehero{
  width:100vw!important;
  max-width:none!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:calc(50% - 50vw)!important;
}

/* Hero artwork truly edge-to-edge */
.hero-image{
  padding:0!important;
  margin-top:0!important;
  overflow:hidden!important;
  background:#118fd6!important;
}
.hero-image img{
  display:block!important;
  width:100vw!important;
  max-width:none!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  object-fit:cover!important;
}

/* Header content stays usable on ultrawide screens */
.jhead,
.jtop{
  padding-left:clamp(24px,4vw,78px)!important;
  padding-right:clamp(24px,4vw,78px)!important;
}

/* Main homepage text region also uses much more width */
.intro{
  padding-left:clamp(24px,5vw,96px)!important;
  padding-right:clamp(24px,5vw,96px)!important;
}
.intro h1{
  max-width:1350px!important;
}
.intro p{
  max-width:1200px!important;
}

/* Navigation/service strip almost full width */
.quick{
  width:calc(100vw - 48px)!important;
  max-width:none!important;
  margin-left:24px!important;
  margin-right:24px!important;
}

/* Section backgrounds full width, content can expand to 1700px */
.section{
  padding-left:clamp(24px,4vw,78px)!important;
  padding-right:clamp(24px,4vw,78px)!important;
}
.shead{
  max-width:1050px!important;
}
.grid,
.posts{
  width:100%!important;
  max-width:1700px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}

/* Network band full width */
.network{
  padding-left:clamp(28px,5vw,96px)!important;
  padding-right:clamp(28px,5vw,96px)!important;
}

/* Inner article text remains readable, but wider than before */
.content{
  max-width:1240px!important;
}
.crumb{
  max-width:1700px!important;
  width:100%!important;
}

/* Footer full width */
.footer{
  padding-left:clamp(28px,5vw,96px)!important;
  padding-right:clamp(28px,5vw,96px)!important;
}

/* Large desktop: 4 cards across and bigger visual presence */
@media(min-width:1380px){
  .grid,.posts{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  .card .visual{
    height:240px!important;
  }
}

/* Very wide screens: don't leave empty gutters */
@media(min-width:1800px){
  .grid,.posts{
    max-width:none!important;
  }
  .section{
    padding-left:70px!important;
    padding-right:70px!important;
  }
}

/* Mobile/tablet must remain truly 100% width */
@media(max-width:1000px){
  .jtop,.jhead,.hero-image,.intro,.section,.network,.footer,.pagehero{
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  .quick{
    width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}