/* ClarityCut — Education page v15
   Compact vertical topic tabs + modern content stage.
   Header/container alignment is preserved via .cc-container. */
.cc-education-page{
  --ed-bg:#090b0c;
  --ed-bg-2:#0c0f10;
  --ed-panel:#0f1214;
  --ed-panel-2:#0b0d0f;
  --ed-line:rgba(217,187,119,.24);
  --ed-line-soft:rgba(255,255,255,.075);
  --ed-text:#f5f1e9;
  --ed-muted:#bbb5ab;
  --ed-gold:var(--cc-gold,#d9bb77);
  background:var(--ed-bg);
  color:var(--ed-text);
  overflow:clip;
}
.cc-education-page .cc-container{
  position:relative;
  z-index:3;
  width:min(calc(100% - 88px),var(--cc-container,1400px));
  margin-inline:auto;
}
.cc-ed-eyebrow{display:inline-flex;align-items:center;gap:13px;color:var(--ed-gold);font-size:9px;font-weight:700;letter-spacing:.25em;text-transform:uppercase}
.cc-ed-eyebrow>span{display:block;width:36px;height:1px;background:currentColor}

/* Hero — intentionally simple: title + rule + subtitle only */
.cc-ed-hero{position:relative;isolation:isolate;min-height:520px;display:flex;align-items:center;overflow:hidden;background:#070809;border-bottom:1px solid var(--ed-line-soft)}
.cc-ed-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 38%,rgba(217,187,119,.055),transparent 31%),linear-gradient(120deg,transparent 0 62%,rgba(217,187,119,.018) 62% 100%);pointer-events:none}
.cc-ed-hero::after{content:"";position:absolute;right:-170px;top:-290px;width:650px;height:650px;border:1px solid rgba(217,187,119,.07);transform:rotate(45deg);pointer-events:none}
.cc-ed-hero-glow{position:absolute;right:9%;top:50%;width:430px;height:430px;transform:translateY(-50%);background:radial-gradient(circle,rgba(217,187,119,.085),rgba(217,187,119,.025) 38%,transparent 70%);filter:blur(22px);pointer-events:none}
.cc-ed-hero-shape{position:absolute;border:1px solid rgba(217,187,119,.08);transform:rotate(45deg);pointer-events:none}
.cc-ed-hero-shape--one{width:230px;height:230px;right:12%;top:24%}
.cc-ed-hero-shape--two{width:90px;height:90px;right:21%;bottom:16%;border-color:rgba(217,187,119,.14)}
.cc-ed-hero-inner{padding-block:clamp(82px,8vw,120px)}
.cc-ed-hero-copy{max-width:650px}
.cc-ed-hero h1{font:italic normal clamp(62px,5.2vw,86px)/1 Georgia,'Times New Roman',serif;letter-spacing:-.045em;margin:0;color:#fbf8f2}
.cc-ed-hero-rule{display:block;width:100px;height:3px;background:var(--ed-gold);margin:32px 0 40px}
.cc-ed-hero-intro{max-width:620px;color:#bdc2ca;font-size:17px;line-height:1.7}
.cc-ed-hero-intro p{margin:0}

/* Guide heading */
.cc-ed-guide{position:relative;isolation:isolate;padding-block:clamp(92px,8vw,142px);background:linear-gradient(180deg,#090b0c 0%,#0c0f10 58%,#090b0c 100%)}
.cc-ed-guide::before{content:"";position:absolute;left:-270px;top:300px;width:520px;height:520px;border:1px solid rgba(217,187,119,.055);transform:rotate(45deg);pointer-events:none}
.cc-ed-guide-glow{position:absolute;border-radius:50%;filter:blur(26px);pointer-events:none}
.cc-ed-guide-glow--one{width:500px;height:500px;right:3%;top:4%;background:radial-gradient(circle,rgba(217,187,119,.08),transparent 68%)}
.cc-ed-guide-glow--two{width:360px;height:360px;left:11%;bottom:4%;background:radial-gradient(circle,rgba(217,187,119,.04),transparent 70%)}
.cc-ed-guide-shape{position:absolute;right:-135px;bottom:10%;width:330px;height:330px;border:1px solid rgba(217,187,119,.055);transform:rotate(45deg);pointer-events:none}
.cc-ed-guide-head{display:flex;justify-content:space-between;gap:40px;align-items:flex-end;padding-bottom:44px;border-bottom:1px solid var(--ed-line)}
.cc-ed-guide-head h2{font:normal clamp(50px,4.8vw,76px)/.98 Georgia,'Times New Roman',serif;letter-spacing:-.045em;margin:18px 0 0;color:#f8f3ea}
.cc-ed-guide-meta{display:flex;align-items:center;gap:15px;color:#6f6b65;font-size:8px;letter-spacing:.2em;text-transform:uppercase;padding-bottom:8px}
.cc-ed-guide-meta span{color:var(--ed-gold)}
.cc-ed-guide-meta i{width:50px;height:1px;background:var(--ed-line)}
.cc-ed-guide-meta strong{font-weight:500}

/* Main Education stage */
.cc-ed-tabs{display:grid;grid-template-columns:194px minmax(0,1fr);gap:clamp(34px,4.5vw,70px);align-items:start;padding-top:clamp(56px,6vw,92px)}
.cc-ed-tab-rail{position:sticky;top:104px;z-index:6;border:1px solid var(--ed-line-soft);background:rgba(11,13,15,.82);backdrop-filter:blur(14px);box-shadow:0 20px 60px rgba(0,0,0,.22)}
.cc-ed-tab-rail-head{display:flex;align-items:flex-end;justify-content:space-between;gap:10px;padding:20px 18px;border-bottom:1px solid var(--ed-line-soft)}
.cc-ed-tab-rail-head span{font-size:8px;letter-spacing:.22em;color:#827c72}
.cc-ed-tab-rail-head strong{font:normal 28px/1 Georgia,'Times New Roman',serif;color:var(--ed-gold)}
.cc-ed-tab-list{display:flex;flex-direction:column}
.cc-ed-tab{appearance:none;-webkit-appearance:none;width:100%;min-height:72px;display:grid;grid-template-columns:27px 1fr 9px;gap:11px;align-items:center;padding:0 17px;border:0;border-bottom:1px solid var(--ed-line-soft);background:transparent;color:#b7b0a6;text-align:left;cursor:pointer;transition:background .22s,color .22s,padding .22s}
.cc-ed-tab:last-child{border-bottom:0}
.cc-ed-tab:hover,.cc-ed-tab:focus-visible{background:rgba(217,187,119,.04);color:#f2ede5;outline:none}
.cc-ed-tab.is-active{background:linear-gradient(90deg,rgba(217,187,119,.13),rgba(217,187,119,.018));color:#fbf6ed;padding-left:21px}
.cc-ed-tab-no{font-size:8px;color:#777168;letter-spacing:.12em}
.cc-ed-tab.is-active .cc-ed-tab-no{color:var(--ed-gold)}
.cc-ed-tab-name{font-size:12px;font-weight:650;letter-spacing:.105em;text-transform:uppercase}
.cc-ed-tab-mark{width:7px;height:7px;border:1px solid rgba(217,187,119,.42);transform:rotate(45deg)}
.cc-ed-tab.is-active .cc-ed-tab-mark{background:var(--ed-gold);border-color:var(--ed-gold);box-shadow:0 0 16px rgba(217,187,119,.32)}
.cc-ed-tab-rail-foot{padding:16px 18px;border-top:1px solid var(--ed-line-soft);font-size:7px;letter-spacing:.21em;color:#666057}

.cc-ed-panels{min-width:0}
.cc-ed-panel{position:relative;isolation:isolate;min-height:650px;padding:clamp(34px,4.6vw,66px);overflow:hidden;border:1px solid var(--ed-line-soft);background:linear-gradient(135deg,rgba(16,19,21,.96),rgba(8,10,11,.98));box-shadow:0 28px 90px rgba(0,0,0,.24)}
.cc-ed-panel[hidden]{display:none!important}
.cc-ed-panel::before{content:attr(data-label);position:absolute;right:-.02em;top:-.18em;z-index:-1;font:normal clamp(120px,13vw,210px)/1 Georgia,'Times New Roman',serif;letter-spacing:-.07em;color:rgba(255,255,255,.018);white-space:nowrap;pointer-events:none}
.cc-ed-panel::after{content:"";position:absolute;left:0;top:0;width:120px;height:1px;background:var(--ed-gold);opacity:.8}
.cc-ed-panel-glow{position:absolute;right:-110px;top:-120px;width:430px;height:430px;background:radial-gradient(circle,rgba(217,187,119,.095),transparent 68%);filter:blur(16px);pointer-events:none}
.cc-ed-panel-shape{position:absolute;right:-86px;bottom:-115px;width:260px;height:260px;border:1px solid rgba(217,187,119,.07);transform:rotate(45deg);pointer-events:none}
.cc-ed-panel-head{position:relative;z-index:2;display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:22px;align-items:end;padding-bottom:30px;margin-bottom:clamp(36px,4vw,54px);border-bottom:1px solid var(--ed-line-soft)}
.cc-ed-panel-index{display:flex;align-items:center;gap:10px;color:var(--ed-gold);font-size:8px;letter-spacing:.16em;padding-bottom:8px}
.cc-ed-panel-index i{width:34px;height:1px;background:rgba(217,187,119,.35)}
.cc-ed-panel-index strong{font-weight:500;color:#5f5a53}
.cc-ed-panel h3{font:normal clamp(52px,5vw,76px)/.9 Georgia,'Times New Roman',serif;letter-spacing:-.05em;margin:0;color:#f8f3ea}
.cc-ed-panel-label{font-size:7px;letter-spacing:.22em;color:#625e57;text-transform:uppercase;padding-bottom:10px}
.cc-ed-panel-layout{position:relative;z-index:2;display:grid;grid-template-columns:minmax(320px,.72fr) minmax(520px,1.28fr);gap:clamp(38px,5vw,76px);align-items:center}
.cc-ed-panel-copy{position:relative}
.cc-ed-panel-richtext{color:#c8c1b7;font-size:16px;line-height:1.86;max-width:640px}
.cc-ed-panel-richtext p{margin:0 0 19px}
.cc-ed-panel-richtext p:last-child{margin-bottom:0}
.cc-ed-panel-richtext ul{margin:6px 0 21px;padding-left:20px}
.cc-ed-panel-richtext li{margin:7px 0;padding-left:3px}
.cc-ed-panel-richtext li::marker{color:var(--ed-gold)}
.cc-ed-panel-media{margin:0;min-width:0;position:relative}
.cc-ed-panel-image-shell{position:relative;padding:clamp(14px,1.45vw,21px);background:#f2efe8;border:1px solid rgba(217,187,119,.34);box-shadow:0 35px 86px rgba(0,0,0,.3)}
.cc-ed-panel-image-shell::before{content:"";position:absolute;inset:8px;border:1px solid rgba(10,10,10,.065);pointer-events:none}
.cc-ed-panel-image-shell img{display:block;width:100%;height:auto;object-fit:contain}
.cc-ed-panel-media figcaption{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:14px;color:#706b64;font-size:7px;letter-spacing:.2em;text-transform:uppercase}
.cc-ed-panel-media figcaption span{color:var(--ed-gold)}
.cc-ed-panel-media figcaption em{font-style:normal}

/* Carat — editorial copy beside a broad chart */
.cc-ed-panel--carat .cc-ed-panel-layout{grid-template-columns:minmax(290px,.62fr) minmax(590px,1.38fr)}
.cc-ed-panel--carat .cc-ed-panel-copy{padding:28px 28px 28px 0;border-right:1px solid var(--ed-line-soft)}

/* Cut — visual first, framed text block second */
.cc-ed-panel--cut .cc-ed-panel-layout{grid-template-columns:minmax(560px,1.18fr) minmax(330px,.82fr)}
.cc-ed-panel--cut .cc-ed-panel-media{order:1}
.cc-ed-panel--cut .cc-ed-panel-copy{order:2;padding:32px;border:1px solid var(--ed-line-soft);background:rgba(217,187,119,.025)}
.cc-ed-panel--cut .cc-ed-panel-glow{right:auto;left:18%;top:28%}

/* Color — panoramic image, then text in a refined reading band */
.cc-ed-panel--color .cc-ed-panel-layout{grid-template-columns:1fr;gap:34px}
.cc-ed-panel--color .cc-ed-panel-media{order:1;max-width:980px;width:100%;margin:0 auto}
.cc-ed-panel--color .cc-ed-panel-copy{order:2;max-width:980px;width:100%;margin:0 auto;padding:28px 0 0;border-top:1px solid var(--ed-line-soft)}
.cc-ed-panel--color .cc-ed-panel-richtext{max-width:none;columns:2;column-gap:52px}
.cc-ed-panel--color .cc-ed-panel-richtext p,.cc-ed-panel--color .cc-ed-panel-richtext ul{break-inside:avoid}

/* Clarity — longer reading column with balanced visual */
.cc-ed-panel--clarity .cc-ed-panel-layout{grid-template-columns:minmax(420px,.92fr) minmax(500px,1.08fr);align-items:start}
.cc-ed-panel--clarity .cc-ed-panel-copy{padding-right:12px}
.cc-ed-panel--clarity .cc-ed-panel-media{margin-top:4px}
.cc-ed-panel--clarity .cc-ed-panel-glow{top:auto;bottom:-90px;right:7%}

@media(max-width:1180px){
  .cc-ed-tabs{grid-template-columns:178px minmax(0,1fr);gap:36px}
  .cc-ed-tab-rail{top:100px}
  .cc-ed-panel{padding:46px 38px;min-height:600px}
  .cc-ed-panel-layout,.cc-ed-panel--carat .cc-ed-panel-layout,.cc-ed-panel--cut .cc-ed-panel-layout,.cc-ed-panel--clarity .cc-ed-panel-layout{grid-template-columns:minmax(280px,.8fr) minmax(430px,1.2fr);gap:42px}
  .cc-ed-panel-head{grid-template-columns:100px minmax(0,1fr)}
  .cc-ed-panel-label{display:none}
}

@media(max-width:900px){
  .cc-ed-hero{min-height:460px}
  .cc-ed-hero-shape--one{right:-70px}
  .cc-ed-guide-head{align-items:flex-start}
  .cc-ed-guide-meta{display:none}
  .cc-ed-tabs{grid-template-columns:1fr;gap:26px;padding-top:48px}
  .cc-ed-tab-rail{position:relative;top:auto;border:0;background:transparent;backdrop-filter:none;box-shadow:none}
  .cc-ed-tab-rail-head,.cc-ed-tab-rail-foot{display:none}
  .cc-ed-tab-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--ed-line-soft)}
  .cc-ed-tab{min-height:58px;border-bottom:0;border-right:1px solid var(--ed-line-soft);grid-template-columns:22px 1fr;padding:0 11px}
  .cc-ed-tab:last-child{border-right:0}
  .cc-ed-tab-mark{display:none}
  .cc-ed-tab.is-active{padding-left:11px}
  .cc-ed-panel{min-height:0}
  .cc-ed-panel-layout,.cc-ed-panel--carat .cc-ed-panel-layout,.cc-ed-panel--cut .cc-ed-panel-layout,.cc-ed-panel--clarity .cc-ed-panel-layout{grid-template-columns:1fr;gap:34px}
  .cc-ed-panel--cut .cc-ed-panel-media,.cc-ed-panel--cut .cc-ed-panel-copy{order:initial}
  .cc-ed-panel--carat .cc-ed-panel-copy{padding:0 0 25px;border-right:0;border-bottom:1px solid var(--ed-line-soft)}
  .cc-ed-panel--cut .cc-ed-panel-copy{padding:28px}
  .cc-ed-panel--color .cc-ed-panel-richtext{columns:1}
}

@media(max-width:680px){
  .cc-education-page .cc-container{width:calc(100% - 40px)}
}

@media(max-width:620px){
  .cc-ed-hero{min-height:400px}
  .cc-ed-hero-inner{padding-block:70px}
  .cc-ed-hero h1{font-size:clamp(54px,16vw,72px)}
  .cc-ed-hero-rule{width:78px;height:2px;margin:25px 0 31px}
  .cc-ed-hero-intro{font-size:14px;line-height:1.75;max-width:510px}
  .cc-ed-hero-glow{right:-120px;width:360px;height:360px}
  .cc-ed-hero-shape--one{width:180px;height:180px;right:-85px;top:18%}
  .cc-ed-hero-shape--two{display:none}
  .cc-ed-guide{padding-block:70px 88px}
  .cc-ed-guide-head{padding-bottom:32px}
  .cc-ed-guide-head h2{font-size:clamp(44px,13vw,60px)}
  .cc-ed-tab-list{grid-template-columns:1fr 1fr}
  .cc-ed-tab:nth-child(2){border-right:0}
  .cc-ed-tab:nth-child(-n+2){border-bottom:1px solid var(--ed-line-soft)}
  .cc-ed-panel{padding:31px 22px}
  .cc-ed-panel::before{font-size:92px;top:-.08em}
  .cc-ed-panel-head{grid-template-columns:1fr;gap:10px;margin-bottom:30px;padding-bottom:22px}
  .cc-ed-panel-index{padding-bottom:0}
  .cc-ed-panel h3{font-size:clamp(44px,13vw,60px)}
  .cc-ed-panel-richtext{font-size:14px;line-height:1.8}
  .cc-ed-panel--cut .cc-ed-panel-copy{padding:22px}
  .cc-ed-panel-image-shell{padding:11px}
  .cc-ed-panel-media figcaption{display:block;line-height:1.7}
  .cc-ed-panel-media figcaption em{display:block;margin-top:3px}
}
